Claude Design 作者本人讲述 Claude Design 诞生始末，以及分享 10 个实用技巧
- 工程师用上 AI 之后出活快了一大截，设计师还是老速度。Anthropic 的产品设计师 Nate Parrott 卡在这个落差里，最后做出了 Claude Design。这篇是他把自己每天在用的十条心得全摊开了讲。
- 他撞上的答案是 HTML：我们把它当做网页的格式，但幻灯片能做的、视频能做的、PDF 能做的，一个网页全都能做，而 Claude 恰好特别会写 HTML。
- 十条按你干活的顺序读：动手之前 4 条、出稿的时候 4 条、收尾 2 条。最反直觉的一条是收尾，微调自己动手拖，直接编辑不烧 token。
- 不告诉它该长什么样，它就会给你那套一眼能认出来的样子：米白底、锈橙点缀、大号斜体衬线字。Anthropic 自己的文档也承认这个默认一直都在，笼统地说「别用奶油色」只会让它换到另一个固定色板。
Claude Design 诞生始末：一个设计师，追不上两个工程师
这篇文章的作者 Nate Parrott，就是 Claude Design 的设计者本人。文章讲了三件事：这个工具怎么从他自己的一个窘境里长出来、他每天拿它做什么、以及十条他天天在用的心得技巧。下面按这三件事的顺序讲。
先说窘境。2025 年秋天，Nate Parrott 是 Claude Code 的 VS Code 版本上唯一的产品设计师，跟两个工程师搭伙干活。9 月底测试版上线，11 月 Opus 4.5 发布，团队开始一个接一个往外发新功能。那两个工程师因为 AI 加持，出活比以前多得多，而他还是老速度，设计稿还是一笔一笔画出来的。
他第一次的解法很顺理成章，也没成：Claude Code 跑在终端里满屏是字，他就照着文字的思路办，把终端输出复制给 Claude、配上截图，说「我们要加这么个功能，你来设计一下」。出来的东西不行。这事他拿业余时间磨了一个月左右。
最后撞上的答案是一句我们都知道、但很少往这个方向想的事实：Claude 特别会写 HTML。我们习惯把 HTML 当成做网站的格式，但网页什么都能装，幻灯片能做的、视频能做的、PDF 能做的，一个网页全都能做，而且还能点、能动。于是他不再要设计稿，改让 Claude 直接吐 HTML，再给自己搭了个界面：左边聊天，右边看效果。
光能吐 HTML 还不够，产品设计得懂自己家的品牌，所以他把 Anthropic 的字体、颜色、素材、原则熬成提示词塞进去，出来的东西天生就合规范。这个小东西丢给团队之后，设计师们立刻抢去做能点的原型（clickable prototype），传统工具里做一个能点的原型，你得把每个页面的每个状态都画出来再手动连线；在这儿是把素材扔给它，说一句「让它能点」。
后来 Anthropic Labs 团队外出开会做点子提案，在场每个人都用它现凑幻灯片，好多人是等着轮到自己讲的时候在会议中间做的。那场会之后 Labs 给它配了人，它成了正式产品：Claude Design。
有两条边界他说得很直。它不生图：里面没有图像模型，做 logo 特别不合适，正确姿势是把已有的 logo 带进来。要出真正上线的软件还是用 Claude Code：Claude Design 管早期构思和对齐方向，两边能来回倒。
/design-sync
把设计系统拉进来