Figma 的精细度无可替代,但在建立共享设计语言这件事上,AI 正在开辟一条完全不同的路径。设计师 Jonathan Simcoe 最近在 X 上分享了他用 Claude Design 从零构建 Mercury 品牌设计系统的完整过程,获得了广泛关注。
10分钟,90% 核心组件自动生成
Simcoe 的起点很朴素:接入一个 GitHub 仓库,同时指向本地代码目录,给 Claude 一些方向性指引——这个设计系统主要服务于 Mercury 品牌、更偏重演示文稿和视觉资产而非 UI 组件。
Claude Design 的反应是:自动识别了代码库中使用的 Tiempos 字体(用于编辑博客和 Meridian 内容),并将其纳入设计系统的排版规范。Simcoe 的评价是:"让它去做,它真的做对了。"
随后 Claude 生成了一套完整的组件包,其中包括:
- UI Kit:主组件库,面向前端组装
- Website Exploration Kit:因为代码库是营销网站,Claude 额外生成了网站探索套件
- Presentation Kit:响应 Simcoe "需要演示支持"的需求,专属套件,用于快速生成幻灯片风格的视觉内容
一切皆可 Prompt,一切皆可迭代
这套系统的核心逻辑不是"一次生成",而是持续可深化。任何组件、任何视觉资产、任何排版细节,都可以在目录里直接用 Prompt 继续精修。Simcoe 在帖子中展示了他如何用截图、Pdf 等材料进一步细化某个组件——全程在 Claude Code 的设计系统目录内完成,不需要打开 Figma。
甚至颜色也可以通过粘贴截图来匹配。Simcoe 提到 Claude Design 对截图中的颜色识别准确度"出乎意料地高"(.fig 文件导入暂不可用,他期待后续修复)。
团队协作的新入口
Simcoe 对 Claude Design 的定位很清晰:不是 Figma 的替代品,而是 Figma 之前的探索工具。
Figma 擅长精确 spec 和流程搭建,而 Claude Design 擅长在没有本地 Git 环境的条件下,让市场、法务、产品等非技术团队成员快速探索和共建设计语言。设计系统目录里自带 SKILL.md 和 README.md,团队成员可以直接在系统内 Prompt协作,不需要懂代码。
这打开了设计工作流的一个新入口:设计资产不再只是设计师的输出物,而是团队共享的 Prompt 上下文。