chapter[14] · part 3 / AI 辅助设计
先纠正一个流行的认知错误:好的 prompt 不是咒语,不靠"魔法词"。prompt 是一份微缩的规格说明书(spec)——你每天给人写的需求文档、给函数写的接口注释,换了个收件人而已。写得好的标准也完全一样:意图明确、约束完整、验收可判。本章把第十三章的"放大器定律"展开成可执行的技艺。
把任何高质量的 UI 生成请求拆开,都是这五个部分:
| 器官 | 回答的问题 | 来自本书 |
|---|---|---|
| ① 意图 | 这是什么?给谁用?什么场景下出现? | 第六章"解释"层——先有意图才有形式 |
| ② 结构 | 有哪些信息?层级顺序是什么? | 7.1 层级 · 10.2 范式由数据结构决定 |
| ③ 系统 | 用什么 token?字体、色彩、间距标尺? | 第八章——治"全局失忆"的唯一药 |
| ④ 参照 | 气质靠近什么?(风格锚点) | 第三章色彩语义 · 第四章字体性格 |
| ⑤ 边界 | 不要什么? | 7.7 克制——负向约束往往最值钱 |
## 一个完整的五器官模板
[意图] 为一个面向独立开发者的付费 newsletter 做订阅卡片,
出现在文章末尾,读者刚读完一篇深度长文。
[结构] 信息按重要性:价值主张一句话 > 邮箱输入 + 订阅按钮
> 隐私承诺小字。不要标题党,不要表情符号。
[系统] 使用以下 token:背景 #FAF7F0,正文 #211D19,
强调色 #C2452D 仅用于按钮;衬线标题 + 无衬线正文;
间距用 8px 的倍数;圆角统一 6px。
[参照] 气质像一本严肃杂志的征订页,不像 SaaS 落地页。
[边界] 禁止渐变、禁止阴影堆叠、禁止超过一个强调色块、
禁止"立即""马上""免费"类催促词。
看五个器官逐步加入时,产出怎么变。任务:上面那张订阅卡片。下面三个结果是对各轮典型产出的忠实模拟(SVG 重绘):
14.1 的五器官模板。适合新组件、新页面。纪律:意图永远写在第一行——它是其余约束的判断依据。
"密度像 Linear,温度像 Notion"。锚点把上千个微决定一次性传输。代价是同质化——锚点应该用来定方向,不该用来抄长相(13.2:分布中心没有品牌)。
把第八章的 token 文件直接贴进对话(或放进项目的 AI 配置文件,如 CLAUDE.md / system prompt),从此每次生成自动讲你的方言。治"全局失忆"的根治术。
"不够好→重新生成"是赌博;"间距从 16 改成 24,其余不动"是实验。每轮迭代说出哪一个维度要变,否则你无法知道是什么起了作用——对,这就是控制变量法。
没有 token 时反过来用 AI:"为这个产品生成一套 design token(色彩五角色、1.25 字阶、8px 标尺)",人工审定后再让它依此生成界面。先立法后施工。
贴上截图:"用 Feldman 四步法 review 这个界面:先客观描述,再分析层级/对齐/色彩/间距,再推断意图,最后给出三个最高优先级的修改建议。"AI 的描述与分析极其勤奋(13.2 它擅长的位置),常能看到你已经麻木的问题。
| 症状 | 诊断 | 处方 |
|---|---|---|
| 产出是"平均脸",像所有人的落地页 | 形容词污染:prompt 全是"简洁现代高级" | 形容词换术语(第六章禁用词表反向使用),补器官③④ |
| 每个页面各自好看,放一起像三个产品 | 全局失忆:逐页独立采样 | 模式 03/05——token 进 system prompt,不进单条消息 |
| 第五轮迭代比第一轮还差 | 赌博式重生成 + 要求互相打架 | 模式 04:回到最好的一版,一次只动一个变量 |
| 一个 prompt 提了十个要求,每个都只做了一半 | kitchen sink:约束过载且无优先级 | 砍到 5 条以内,意图置顶;剩下的留给迭代轮 |
| AI 对你的每个想法都说"好主意" | 过度顺从:你在用它求安慰,不是求判断 | 强制要价:"给出这个方案的三个代价,以及你会怎么取舍" |
| 生成的界面"技术上对"但毫无生气 | 只给了规则,没给意图与张力 | 回器官①:场景、情绪、用户那一刻在想什么——形式追随的那个"功能" |
纯文字 prompt 有个天花板:用语言描述视觉,是有损压缩。"克制的留白、温暖的中性灰、紧凑但不拥挤的间距节奏"——写得再准,也不如直接甩一张图过去。今天的工具大多能看图,于是 prompt 从"说给 AI 听"升级成"给 AI 看"。但图是一种高带宽却很钝的输入:你给它一张参照图,它会把图里的一切都当成指令照单全收,包括你没想要的部分。所以多模态的关键不是"附张图",而是给每张图指定一个角色,并说清要取它哪个维度、丢它哪个维度:
多模态里最高杠杆的一招是截图迭代闭环:把当前界面截图发给 AI,配一句"现在长这样,问题是 X,改成 Y"——它能看到自己上一版的真实渲染结果,而不是凭文字想象,迭代收敛快得多(这把 14.3 的模式 04"一次一变量"装上了眼睛)。两个工程提醒:① 喂真实内容,别让 AI 自己编占位——把你数据库里最长的名字、最大的金额、最空的账户截图给它,逼它当场处理换行、截断、空态,直接堵死 13.5 第⑤种翻车;② 参照图要标注——能在图上圈一笔、或在文字里指明"看红圈处",就别让 AI 猜你指的是哪儿。一句话:文字给意图,图给事实;意图说"我要什么",图说"长这样、就这里、用真的"。
把本章压缩成一条公式:prompt 质量 = 意图清晰度 × 约束完整度 × 迭代纪律。三个因子全部是第一、二部分能力的直接变现——意图来自鉴赏(你得知道自己要什么),约束来自系统(第八章),纪律来自方法论(第六章)。多模态只是给"约束"开了一条更高带宽的通道:能给 AI 看的,就别只说给它听。AI 没有改变设计能力的构成,只是把它从手上转移到了嘴上和眼里。
完成第十三章练习的进阶版:把你那个真实小需求按 14.1 模板写满五个器官,跑模式 01 生成;然后连续做四轮模式 04 迭代(每轮记录你改的那一个变量和效果);最后用模式 06 让 AI review 自己的产出,看它的四步分析与你的判断差在哪里。整个过程存档——这份记录在下一章会直接用上:它就是你个人 AI 设计工作流的第一块样本。多模态加练:找一张你欣赏的界面截图当风格参照喂给 AI,但只准它取一个维度(比如"只学这张的间距节奏"),明确写下"别学它的 X、Y、Z"。看 AI 能不能做到"取一维、弃其余"——做不到的地方,往往就是你那句"取什么弃什么"还说得不够具体。