Communitygithub.com

tsvetaeff-den/ai-ready-sites

设计、构建、改进或审计网站及网页界面;编写或编辑网站文案、产品说明和技术文档,包括中英文翻译。适用于落地页、产品UI、响应式组件、重新设计和就绪检查。将工作范围限定在文本相关任务、小修复和审计请求内。不适用于仅后端实现或原生应用。

ai-ready-sites 是什么?

这是一个为AI代理(如Claude Code、Cursor等)设计的全方位网站与界面技能。它涵盖了从规划、设计、实现到浏览器QA、审计以及文本编辑的完整工作流程。该技能的核心优势在于其自包含性:所有必要的指导都集成在SKILL.md及其引用的参考文件中,无需依赖外部设计引擎或全局指令。它支持多种任务类型,包括新网站建设、小部件修复、界面审计、文案翻译(RU/EN)以及技术文档编写。工作流程以用户需求为起点,根据不同的请求类型引导代理执行相应的参考指南(如设计、实现、质量控制)。该技能强调在真实浏览器中验证结果,确保交付的UI是可用的、符合语义的,并且所有变更都在授权范围内。它不会创建假数据或虚构后端,并提供了可选的Node.js助手脚本用于本地能力检查。最终交付时必须附上变更摘要及执行的检查证据。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/tsvetaeff-den/ai-ready-sites/tree/HEAD/skills/ai-ready-sites

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

AI-Ready Sites

一个自包含的网站和界面技能。本技能所需的所有指导都包含在此处。请勿加载其他已安装的技能、调用外部设计引擎或要求全局指令来遵循此工作流程。使用宿主提供的工具和项目中已有的适当依赖。可选的工具有助于增强验证;缺少它们不会阻碍设计或实现。

从用户所处阶段开始

检查请求、适用的项目说明、技术栈、现有组件以及相关的产品/设计文档。对于变更,检查现有实现和可用的渲染UI。简要确定成果和最小可行的路径。用户的简要说明和项目约定指导视觉选择。缺少DESIGN.md并不意味着可以重新设计。

请求阅读并执行
计划或讨论简介和UX,然后是相关设计指南;提供计划,除非要求,否则不更改项目文件
新网站或重大重新设计简介和UX → 设计 → 实现 → 浏览器QA 和适用的质量 → 完成
小部件或UI修复检查受影响的区域;仅使用相关的设计/实现指南、有重点的浏览器检查和必要的项目检查
仅审计/审查相关的设计/质量/浏览器指南;收集证据并报告按优先级排序的发现;不编辑被审计的项目
动效动效、受影响的UI和减少动效验证
网站或界面文本网站和界面文案和编辑审查;在请求的范围内编写或编辑
说明或技术文档技术写作和编辑审查;验证相关过程,无需构建网站
中英文编辑或翻译编辑审查,加上相关的文案/文档指南;保留事实、可执行文本和实际UI标签
准备发布?完成、当前浏览器证据和必要的项目检查;不表示部署

根据需要加载参考文件,而不是一次性全部加载。这是一个能力的选择,而不是强制顺序。重用有效证据;不要以不同的名称重复等效审查。

交付有用工作

  • 对于新工作,将产品事实转化为连贯的方向,并在扩展之前完成一个有效的用户旅程。对于优化,保留现有身份和范围之外的行为。对于重新设计,在更改所请求的视觉系统的同时,保留产品事实和必需的功能。
  • 使用真实内容和有效控件进行构建。标记演示数据、本地模拟和不可用的集成。不要虚构客户引用、性能声明、价格或工作后端。
  • 在编写或编辑文案时,使用相关的文本指南。保留事实、条件、命令和当前UI标签。提高清晰度和实用性;不要为作者检测器分数而优化。纯文本工作不会触发设计或浏览器阶段,除非所请求的声明需要它们。
  • 使文本、表单、导航和状态在目标屏幕上、使用键盘和辅助技术语义时可用。设计雄心与表面相匹配:表达性营销、精确任务UI、可读编辑,或以工作本身为主导的体验。
  • 通过在实际浏览器中观察结果来确认行为。检查屏幕截图以验证视觉声明;源代码、成功点击和成功构建并不能证明渲染结果。
  • 如果工具、认证、资产或运行时先决条件不可用,则完成独立工作并说明具体缺失的检查。不要伪造PASS、安装无关工具或默默替换用户的技术栈。
  • 将工作保持在授权范围内。网站创建不授权发布、真实表单提交、付费服务或生产环境更改。继续常规授权工作而无需重复请求批准。

工具和可移植性

相对于此SKILL.md解析所有引用/脚本。不需要个人路径、特定操作系统、外部技能名称、API密钥、框架或托管账户。浏览器QA涵盖了工具发现、无浏览器行为和可选的包含助手。Chrome DevTools和Playwright是包内说明,而不是对其他技能的依赖。

包含的Node.js助手是可选的。scripts/doctor.mjs无需安装任何东西即可报告本地基本能力;scripts/browser-check.mjs在Playwright和浏览器已存在时执行受限的烟雾测试。从它们的--help开始。无需Node运行时即可简单地读取此技能并与宿主工具一起使用。

以证据结束

首先报告更改的表面或审计结果,然后报告实际执行的检查、相关工件和限制。对于重大交付,使用项目约定保存简洁的QA证据。对于小修复,最终回复可能就足够了。当检查无法执行时,声明NOT RUN;为实际通过且无已知阻塞的必需检查保留PASS。完成定义了报告和验收边界。

归属记录为THIRD_PARTY_NOTICES.md;它是来源记录,而非运行时说明。没有捆绑上游CLI、二进制文件、付费服务或自动更新程序。

相关技能