我让 claude 一下午出了六个设计方向
ÉLAN 是我做的一个灵感/日记 app，给创作者用的。这个项目卡了我三周，功能上倒没卡住，卡住的是打开这个 app 应该是什么感觉。像暗房？像私密日记？还是像画廊？想法我有，但没法验证。因为对 solo dev 来说，验证一个方向就得做一个原型，一个原型大概要一天。
所以大多数时候手上就只有一个方案。周二脑子里冒出什么就去做什么，做出来就是它了，没有别的版本可以比。我感觉大多数 solo dev 产品的设计上限就卡在这儿，审美倒是其次，主要是样本量不够。你永远只有一个方案，没法拿它跟「本来可以做成的样子」比一比。
claude design 解决的就是这个问题。它大概二十分钟能出完六套主题方向，每套的 palette、字体、排版、手机屏 mockup 全都有。而且这六套差得很远，是六种完全不同的视觉语言，不像是同一个想法换了六组参数。
这篇就讲讲我现在用的这条流程，讲它真正擅长什么，也讲方向定下来以后，big-task 的 ui profile 怎么接着往下走。
claude design 是什么
先说清楚，它不是一个独立产品。还是同一个 claude code session，还是同一个模型，区别全在 skill 栈上。用的是 design-consultation、design-md、frontend-design，加上 impeccable:* 一整套（animate、colorize、distill、extract、harden、normalize、onboard、polish、typeset、critique、bolder、quieter、delight）。skill 换了，指令的语气换了，它干活的方式也就跟着换了。
用起来感觉像个独立工具，是因为这套 skill 调教的重点是审美、品味、品牌表达这些东西，而不是吞吐量。impeccable:typeset 会认真去调字距和 font pairing，tdd-workflow 是绝对不会管这种事的。
整条流程
大概是这样：写 brief → 出六个方向 → 收敛到三个（带分析）→ 我自己选一个 → 把选中的方向展开做 study → 落成 HANDOFF.md → 交给 big-task 的 ui profile → ship。
从 1 个方案发散到 6 个方向、再收敛到 3 个决选、选定 1 个、最后锁进 HANDOFF.md 的设计漏斗流程
第 1 步：写 brief
就写一段话，说清楚产品是什么、给谁用、希望它让人有什么感觉。功能列表不用写，要写的是情绪、参照物、取舍这些。
我给 ÉLAN 写的 brief 是这样的："给创作者的灵感/日记 app。感觉像胶片暗房——慢、郑重、有触感。用户像冲胶片一样'冲洗'条目。跟 Instagram 无限下拉的相反面。" 一段话就够了，它要是觉得信息不够，会自己来追问。
第 2 步：出六个方向
claude design 会出六套主题方向，每套都有自己的 palette、字体、typography 和组件语言，直接画成手机屏。
ÉLAN 六方向主题探索——六种完全不同的视觉语言，各自的调色板和手机屏 mockup
出来的六个里，一般有一半跟你的 brief 明显不搭，另一半里会有点东西，这很正常。六个方向有用，主要是因为它们散得够开。彼此差得够远，摆在一起你才看得清每个选项到底差在哪。你自己一天做一个原型，是永远攒不出这么大的差距的。
第 3 步：收敛到三个，带分析
接下来它会从六个里挑出最强的三个，每个写一份分析，讲它独特在哪，字体、palette 和交互语言合起来长什么样，要做哪些取舍。
ÉLAN 三方向文本分析——Film Stock（方向 A）、Chiaroscuro（方向 B）、Field Notes（方向 C）的字体、色板、交互签名和取舍拆解
这一步大概帮我省了两周。三份分析摆在一起，你就不得不去看它们到底哪里不一样，看明白了才谈得上选。
ÉLAN 三个决选方向手机屏并排——Film Stock / Chiaroscuro / Field Notes 各三张代表屏
第 4 步：自己选一个
claude design 能把六个收到三个，但三个里选哪个，它替不了你。这一步靠的是你自己的品味，它给不了。
ÉLAN 我选了 A，Film Stock，暗黑的电影质感，打字机字体，暖红色。它跟「暗房」这个 brief 对得最直接，而且这个隐喻能很自然地往下延伸。用户有一「卷胶卷」，条目可以「冲洗」，有 contact sheet 视图，长文编辑器就是暗房的氛围。
B 是 Chiaroscuro，光从黑暗里升起来；C 是 Field Notes，旅行手账。这两个都不弱。最后选 Film Stock，是因为它的隐喻最有可能延伸到每一个屏，我比较有信心它不会做完第一张 mockup 就撑不住了。
第 5 步：方向 study
选完以后，claude design 会把这个方向展开，做成详细的多屏设计。一个方向铺到好几个屏上，视觉上完全自洽。
ÉLAN Film Stock 方向完整 study——Undeveloped / Developing / Fresh Prints 三张手机屏的冲洗流程，Cormorant 字体、暗房调色板、contact sheet 交互
这一步其实是在压测这个隐喻能撑多远。设置页能不能用 Film Stock 的语言做？空状态呢？错误状态呢？搜索页呢？如果隐喻到第 7 个屏就会塌，宁可现在就知道，别等实现完了才发现。
ÉLAN 这个隐喻撑住了。设置页变成「冲洗偏好」（ISO、曝光），空状态变成「未冲洗的胶卷——今天去拍点什么」，错误状态变成「漏光——这卷损坏了」。
第 6 步：HANDOFF.md
方向定下来以后，要把整个设计系统写进一个 markdown 文件里，包括字体 scale、色板 token、组件行为、动效规则，还有每个屏的像素级布局。另外还有 directions/*.jsx，参考屏直接写成 React 组件存进 repo。
这么做是因为后面所有环节，big-task 的 ui profile、Playwright verify、code review，都从 HANDOFF.md 和 directions/*.jsx 里读。以后再问「这个屏应该长什么样」，就只有一个地方给答案。
big-task 接手
然后在 ÉLAN 的 repo 里开一个新 session，big-task 的 Phase 0.0 会检测到三个东西：
components-ui（有 components 目录 + Tailwind + Radix）design-ref（HANDOFF.md 存在）playwright（依赖里有）
检测到以后，它会自动路由到 ui-project profile。这个 profile 强制走 Tier 3 GSD-lite，跳过完整 GSD 那套仪式（.planning/ 那堆 meta 产物），实现任务走 superpowers:subagent-driven-development 的两段 review。
真正把设计锁住的，是 Phase 2g 的 verify。如果 HANDOFF.md、directions/*.jsx、Figma PNG 都在，big-task 就会强制跑视觉验证，流程是这样的：
- 起 dev server。
- Playwright 把每个改过的 route × 每个主题变体都截一张图，存到
docs/reports/{phase}-visual/。 - 每张 PNG 派一个 subagent 并行去看。ÉLAN 是 12 个 route × 2 个主题 = 24 张 PNG，主线程不碰原图，每个 subagent 读
{screenshot_path, design_ref_path}，回一个{route, verdict, concerns}，不超过 200 token。 - 主线程把结果汇总成一个 verdict matrix，每个 route 给一个 PASS / FLAG / BLOCK。
BLOCK 会自动开 fix task；FLAG 带着具体的 concern（间距、颜色、对齐、缺组件）报给我；PASS 就不用我再看一眼了。
这套验证靠谱，是因为校验 agent 是拿像素跟锁定的参考在对。你要是问 LLM 好不好看，它几乎永远说好看。但这里它要回答的是「这个跟参考对没对上」，不是「这个看起来好不好看」，对不上它会老老实实标出来。
视觉验证机制：Playwright 把每张截图分派给一个并行 agent，各自拿像素比对锁定的参考屏，汇总成 PASS/FLAG/BLOCK 矩阵
ÉLAN 最终实现——Film Stock 方向的生产屏，Cormorant 衬线、黑底暖红、"冲洗 / contact sheet / 灵感卡"流程
claude design 真正擅长的，和它做不到的
第一是在早期把搜索空间拉开。从一个方案变成六个方案，这一步在整条流程里花的成本最低，但我今年在设计产出上最大的提升就来自它。
第二是同一个方向里的视觉能自洽。主题选定以后，后面每个屏都是这个主题的，不会做着做着风格就漂了。
第三是交接的东西机器能读。HANDOFF.md 加 directions/*.jsx，是一份能 lint、能 diff、能 regenerate 的设计规范。传统的设计交接放在 Figma 或者截图里，这套放在 repo 里，跟代码一起进版本管理。
第四是最后的打磨。impeccable:typeset、impeccable:polish、impeccable:animate 负责最后那 20%，像字距、字体搭配、微交互这些，我这种没有设计背景的人自己弄，肯定不如它。
它做不到的地方也很清楚。它不会替你做选择，能把六个收到三个，但没法告诉你三个里哪个适合你的品牌，这个判断还是得你自己来。
真正原创的美学它也做不出来。claude design 是把它见过的那些设计重新排列组合，不会发明一个新的视觉运动。对大多数产品来说这无所谓，但如果你要做的是视觉上真有原创性的东西，那还是得找真设计师。
还有一个硬伤，就是 brief 不能含糊。你跟它说「做得好看点」，会拿到六个「还行」；你跟它说「胶片暗房、慢、有触感、跟无限下拉相反」，拿到的就是六个真在这个方向里探索的方案。brief 写得多具体，出来的方向就有多具体。
最后说说我的判断。solo 或者小团队做 UI，这条流程里杠杆最大的就是六方向探索那一步，因为它直接解决了样本量的问题，你不用再赌第一直觉了。后面的 HANDOFF.md、big-task ui profile、Playwright verify 都有用，但只是在这基础上再往上加一点。
代价就是你得写一个好的 brief。动手之前花二十分钟，把「这个产品应该让人感觉到什么」讲清楚，后面六方向那步大概能帮你省回二十个小时。反正我现在新项目都是先把 brief 写了再说。
延伸阅读：
- 上一篇 两个月，我把 AI 工作流推倒重来了四次 ——
big-task是什么、为什么要分 Tier 3 GSD-lite。 - ÉLAN 产品系列：ÉLAN 开发手记。
