用 Claude Design 做界面,最容易踩的坑是「AI 味」太重——配色像 PPT 模板、组件像 Demo 截图,看着精致但没人敢拿去上线。宝玉给出的第一条建议就直指要害:把设计系统加进去,比如 Adobe Spectrum 2、Cohere 那一类企业级 token,扔进项目的知识库并设为默认。这样 Claude 在生成组件时会自动套用品牌色、间距和圆角规则,你只管盯着布局和交互逻辑,细节它自己会收。少了这套锚点,再聪明的模型也只能给你吐出一堆「科技蓝渐变」。
接下来的工作流是反着来的。别一上来就让 AI 写整页,先搭一两个核心功能模块跑通结构,再利用左侧聊天框对单点反复推敲——文案措辞、空状态提示、按钮层级,都可以在对话里直接改,不用重写全部代码。宝玉特别提到一个被很多人忽略的能力:Markup 框选。在预览界面选中局部区域,右侧会弹出评论框,你可以针对某个卡片、某段文案单独反馈,AI 只会调整这一处而不会牵动全局。配套的 Edit 按钮则打开元素树,碰上 AI 改不动的顽固样式,可以手动微调 class 和 style,这在传统 prompt 流程里几乎做不到。
最后两条更像是纪律层面的提醒。上下文管理是 LLM 工具的通病——一个会话里塞了十几个需求后,模型开始遗忘早期约束,输出越来越飘。宝玉的做法是每开一个新任务就新建会话,让 Claude 带着干净的记忆重新理解设计系统。Tweaks 面板则是临门一脚:主题色、栅格密度、加载动画、骨架屏,都能在不动代码的前提下切换预览,省去反复编译的等待。如果页面多到需要导航,Tweaks 里也能加,直接生成顶部 Tab 切换不同界面状态。把这五步串起来,Claude Design 才真正像个能交付的协作工具,而不是又一个 Demo 生成器。

