Vercel design.md：200+ 轮评测把品牌规则写成 Agent 可遵守的约束

原文 · Vercel Blog · 2026-08-31

Vercel 内部用编程 Agent 做必须「看起来像 Vercel」的页面与材料。仓库内已有 product-design skill，但报告、提案、一次性页面常在读不到仓库文件的工具里完成。答案是公开的 design.md：一个 URL，任何 Agent 都能加载。

直接把 skill 糊成超长 prompt 失败了——模型对「干净」「品牌感」各解各的。团队改为从零重写，并用固定评测提示逐条校准。

无 design.md 时，同一续约提案提示会得到通用 SaaS 仪表盘：推荐结论不突出、商业证据分散、同伴指标不好比。有文件后，页以续约建议开篇，证据进网格，同伴值落在同一尺度。作者结论：文件改变的是结构与层级，不只是换肤。

系统收成三层：

1. design.md：教 Agent 如何按读者任务组页、写具体主张与诚实但书、处理层级/字体/颜色，并点名反复出现的生成式设计反模式；
2. 公共样式表：把字体、间距、表格、stat strip 等收成类名与 token，Agent 只引用类名，不把 CSS 塞进上下文；
3. 评测闭环：7 个来自真实用途的固定场景（用量报告、续约提案、基准报告、交互规划页、自建 vs 外购简报、安全治理简报、演示稿）；人审主观项，确定性检查抓机械失败（如表格未用满宽度）。

纠错落到最窄层：判断→散文规则；可复用机制→CSS；可机器抓→代码检查。里程碑做盲测 A/B。Slack 上的 @design-agent 承接真实请求，每周把重复投诉沉淀回文件。

短引：「Nothing got in any other way.」——每条指导都经评测闭环（Vercel）。

七个冻结场景故意覆盖不同读者任务：交互规划页把控件放前面，续约提案把建议与商业对比放前面——同一套视觉语言，结构却按任务分化。本地评审应用做全页渲染与盲测 A/B，每条纠错绑到确切 run（提示、输入、模型配置、design.md 版本、截图）。

周度把 Slack、GitHub、Figma 的重复投诉聚类成提案，人决定改 design.md、样式表、确定性检查还是 agent 本身；若投诉率不降，说明修复未生效。

Vercel 自述（C）：

• 构建过程累计 200+ 次运行（含整轮、定向、试跑与死胡同）；
• 抽 3 个桌面场景×有/无文件各生成 1 次（共 6 页、不重抽）：已知失败模式从 91 降到 39（约少 57%）；
• 作者明确：检查只能抓已登记失败；6 页样本太小，不能当整体设计质量证明；有文件的页仍至少有一处「足以挡发布」的问题。

• 对外部团队复现同一 57% 需要同等样式表与检查器，公开程度有限。
• 跨模型稳定性（文称用 Claude Opus 与 GPT 系）未给完整分模型表。
• 「200+」含多少无效探索，分母不透明。

可迁移点：品牌/设计约束要「可观察」；评测场景冻结输入；机械失败进确定性检查；反模式要起名字。

minimal_trial：选一种重复产出（如周报），先存无指导基线截图；把最近 10 条设计评审意见改成可检查句子写入一页 design.md；再同提示生成一次做盲比。先量：首轮人工纠错条数。

• Vercel：How our agents build on-brand pages with design.md