AnyDesign 设计分析技能
把截图、网站和 Figma 文件变成结构化、可执行的设计规格，让任何 AI 或设计师都能照着重建设计。
证据显示该技能为只读分析型：抓取网页/图片、生成文档，无删除性默认操作、无凭据处理、无隐蔽外传；失败时被明确要求告知用户而非编造内容。扣分点：未提供显式的用户确认机制与数据流披露（如 Playwright 抓取第三方站点时的隐私边界），抓取脚本与 cookie 自动关闭等行为源码未随评估提供，归属仅依赖作者自称的 MIT，未验证；扣至 15。
SKILL.md 工作流自洽、含 lint 交付门禁、明确的失败反馈原则（'tell the user clearly instead of inventing content'）、渐进式参考加载，快乐路径可信。扣分点：静态评审不能执行，脚本源码与 references 文件未在评估范围内出现，异常输入下的错误处理质量无法证实；按锚点封顶给 10。
受众（产品/体验设计师）、输入类型（图片/URL/Figma）、两种模式、歧义路由规则均写得很清楚，触发短语丰富、边界（lint 不适用 element.md、'Open Questions' 强制披露未知）有声明。扣分点：核心功能依赖 Figma MCP、claude.ai/design、v0 等海外服务，未声明中国大陆可达性与中文输出细节（仅泛称按用户语言），环境适配证据不足；扣至 10。
文档分层清晰（SKILL.md 主脑 + 按需加载的 references）、MIT 许可、完整 Keep-a-Changelog 语义化版本史、维护者身份（Alan Ponce）在 LICENSE 中可见。扣分点：SKILL.md 的结构树只列 4 个脚本而脚本表列 7 个，存在自相矛盾；references 脚本本身未随评估提供，安装/依赖仅在 README，发布者未经注册表验证；扣至 12。
CHANGELOG 与 README 声称对 vercel.com 等真实站点完成端到端运行并有 v0 下游重建演示，输出格式（design.md + DTCG JSON）可直接使用，相对手工分析有明确增量价值。扣分点：全部为作者自述证据，静态评审无法验证输出正确性与代表性结果；按锚点封顶给 7。
有多类可审计的一手材料线索：示例目录、真实下游 URL（v0-anydesignexample.vercel.app 等）、lint 验证声明、具体数字（808 个 CSS 变量、96 个 token 0 drift）。扣分点：这些均在示例文件与陈述层面，示例与脚本源码未纳入本次评估，无法独立复核；封顶给 4。
- 静态评审，未执行任何脚本；运行前请自行审计 scripts/ 下各脚本源码。
- 核心依赖 Figma MCP、claude.ai/design、v0 等海外服务，中国大陆网络环境下部分功能可能不可用。
- SKILL.md 结构树与脚本表存在不一致（4 个 vs 7 个脚本），以实际仓库内容为准。
- capture_site.py 会自动关闭 cookie 弹窗并抓取第三方站点，注意目标站点的使用条款与隐私边界。
- 发布者未经 FollowSkills 注册表验证，维护持续性证据有限。
这个 Skill 能做什么，适合哪些场景？
AnyDesign 是一个 Claude 技能，定位为“设计系统分析师”：分析图像、网站或 Figma 文件后，输出一份带置信度标记的 design.md（含设计令牌、组件清单、布局与重建说明），并可选生成 W3C DTCG 格式的 design-tokens. 和 WCAG 对比度报告。它支持两种模式：整站/整文件的完整分析，以及针对单个元素（如导航栏、3D 插画）的元素复制模式。输出是纯 Markdown 和 JSON，v0、Lovable、Cursor、Claude Code 或人类设计师都能直接使用。附带 7 个可独立运行的 Python CLI 脚本，即使不经过 Claude 也能提取 CSS 变量、做屏幕截图或对比度检查。
读取三类输入：本地图片（多模态视觉直接分析）、网站 URL（WebFetch 获取 HTML、提取 CSS 自定义属性，SPA 时用 Playwright 多视口截图）、Figma 链接（通过 Figma MCP 依次调用 get_metadata、get_variable_defs、get_design_context、get_screenshot）。随后按六层方法论分析（品牌识别 → 令牌系统 → 组件 → 布局 → 重建要点 → 品牌规则）并执行艺术方向 QA 检查。最终生成 design.md（带 YAML frontmatter 和置信度标记）、DTCG 格式的 design-tokens.、可选的 design-a11y.md WCAG 报告；元素模式则输出 element.md，包含代码重建提示词或基于提取调色板的图像生成提示词。交付前强制运行 lint_design_md.py 校验。
- 前端开发者想把 vercel.com 这类参考站的设计系统提取出来，交给 v0 或 Claude Code 重建一个类似风格的页面。
- 设计师只有一张 Dribbble 截图，需要从中拿到精确的十六进制调色板和字体规范来写设计文档。
- 品牌团队想复制某个导航栏或定价卡，但只需要那一个元素——元素模式给出可直接粘贴的重建提示词。
- 游戏美术团队需要一批风格一致的 AI 素材：技能一次性提取美术方向（调色板、光照规则），生成共享同一基调的提示词包。
- 设计负责人想审计 Figma 交付稿与线上实现之间的令牌漂移，用 verify_design.py 对比声明令牌与实际站点。
- 接手遗留产品的团队想把团队从未命名过的隐式设计系统文档化，形成基线。
这个 Skill 有哪些优点和局限？
- 输出是通用格式：Markdown + W3C DTCG JSON，v0、Lovable、Cursor、Style Dictionary、Figma Variables 均可直接消费，无锁定。
- 强制诚实机制：每个推断带置信度标记（✅⚠️❓），禁止编造令牌，必须列出未解决问题（Open Questions）。
- 元素模式独特：能为图像生成模型输出基于精确提取调色板的提示词，保证再生成素材与原设计一致，并内置 IP 护栏（只生成原创角色）。
- 附带 7 个纯 Python CLI 脚本，多数仅依赖标准库，可脱离 Claude 独立使用，包括令牌漂移审计和 WCAG 对比度检查。
- 有真实可复现的示例：vercel.com 完整分析（提取 808 个 CSS 变量）、poolsuite 播放器元素重建、Discord 3D 场景的图像提示词，均有线上验证结果。
- Figma 分析强依赖 Figma MCP 连接，未配置 MCP 则该输入源不可用。
- Playwright 截图首次安装约 300MB，capture_site.py 有额外依赖成本。
- 对 SPA（无 SSR 的 React/Next 站点）需要走 Playwright 截图路径，纯 HTML 分析路线会失效。
- 仓库未见自动化测试套件；图像令牌提取依赖多模态视觉的近似判断，精确度依赖 extract_colors.py 等辅助脚本。
- README 声称的下游效果（v0 重建等）由作者自己演示，缺乏独立验证。
如何安装这个 Skill？
git clone https://github.com/uxKero/anydesign.git，然后将文件夹复制到 ~/.claude/skills/（个人全局）或项目下的 .claude/skills/。可选：pip install -r requirements.txt，如需截图功能运行 playwright install chromium。要分析 Figma 文件需在 Claude 应用中连接 Figma MCP（Settings → Connectors）。文档未说明其他安装方式（如技能市场一键安装）。
如何使用这个 Skill？
安装后无需命令，直接用自然语言触发，例如：“提取这个网站的设计系统”、“复制这个导航栏”、“这个网站用的什么调色板？”并提供图片/URL/Figma 链接。技能会自动判断完整分析或元素模式，生成 design.md 和 design-tokens.。七个脚本也可脱离 Claude 独立使用，例如：python scripts/extract_css_vars.py https://vercel.com/ --pretty 提取令牌；python scripts/lint_design_md.py design.md 校验输出。
这个 Skill 与同类方案有什么区别？
源材料未直接点名竞品，但明确将其定位为“不是描述生成器，而是设计诊断工具”，并强调与 Style Dictionary、Tokens Studio 等 DTCG 消费工具的对接关系——它扮演这些工具的上游提取环节。