跳到正文
WC.

泛用设计的代价:默认 UI 与 agent 生成的设计

•1 分钟阅读•开发者工具•
•
#design#agents#constraints#ui

同一个站你看过一百遍了。一样的圆角、一样的灰底白卡、一样的渐变 hero 加 CTA。不难看,但也和上季度上线的每一个产品长得差不多。

这和内容上的老问题一样:没有约束的 agent 产出泛用文案。同样的逻辑正在 UI 上重演。默认组件库和没被教过你约束的 agent,会收敛到同一套视觉语言。泛用的代价不是「丑」——是没有区分度。看不出谁做的、为什么做的。

默认泛用 UI 卡片与编码了 token 和意图的设计系统之间的对比。

默认值是你没做过的选择

当你用一套 UI 套件——Tailwind UI、shadcn、没做主题的 Radix 原语——你会得到一致性,也会得到「所有人选择的平均」。间距、字阶、圆角、颜色都由库作者或模型训练分布决定。想快、不在乎身份时这很有用;想要一个感觉像你的产品时就是陷阱。

Agent 会放大这种效果。让它做一个 dashboard 或落地页,它会用到处见过的那套原语拼:卡片、徽章、弹窗。没有 design token、没有风格指南,agent 就不知道「你的」UI 长什么样,只能产出平均值。和内容问题一样:不给方向就是一种方向——往中间靠。

约束同时提升人和 agent

解决办法不是不用库或不用 agent,而是加约束,把「合法输出」的空间收窄。

Design token 是最直接的杠杆。颜色、间距、字体、圆角有单一事实来源,既给人 guardrail,又给 agent 一份规格。

当 token 写明「primary 是 #0f172a」「card 圆角 0.375rem」,agent 不用发明,只在系统里组合。输出能保持品牌感,因为品牌被编码进去了。

和语气一样,UI 也需要「要这样」和「别这样」。「表格用紧凑变体」是模式;「同一视图里不超过两种强调色」是反模式。两者都减少 agent(或初级开发)要做的决定,错误地方的决策越少,越不容易滑向泛用。

我在实际项目里见过:有一小套明确的 design token 和简短「要/不要」清单的,做出来的 UI 有意图感;靠「弄好看点」或裸组件库的,做出来像模板。差别不在天赋,在约束。

教 agent 你的 UI 语气

教 agent 写作语气的那套思路,同样适用于产品和界面。你不是给 agent 一张白布然后指望奇迹,而是给它一套系统:token、组件使用规则、以及「做完长什么样」的示例。

把反模式写清楚,让 agent 知道要避免什么。在输出算完成前跑一遍 checklist——对比度、层级、一致性。

这些工作对人也有用。一套够让 agent 跟的 design system,通常也够一个团队跟。把约束写下来的过程会逼你想清楚自己到底在意什么。

默认值不再隐形,而是显式的。你可以改。

泛用的代价是可以避免的。默认 UI 和没有约束的 agent 会继续产出千篇一律的站,直到我们把设计像内容一样对待:需要编码的意图。Token、模式、反模式。不是少自由,而是边界更清晰,让边界内的产出真的像你。

继续阅读

本站 i18n 是怎么做的,以及两个 agent skill 如何配合

常有人问 wchen.ai 怎么做多语言、怎么在英文、西语和中文之间保持同步而不靠复制粘贴。简短回答:站点围绕一套清晰的内容模型来建,两个 agent skill——website-content 和 content-translation——规定内容放在哪、如何扩散。架构负责重活,两个 skill…

•2 分钟阅读•开发者工具
i18nnextjsskills
技能中的渐进式披露

技能里塞得越多就越有用——直到不再有用。一个 SKILL.md 想把每种内容类型、每种 schema、每种语气规则都写进去,可以轻松上百行。Agent 会一次性全加载。Token 预算被烧掉,真正和当前任务相关的部分淹没在噪音里。 我设计技能时,让主文件当路由器,不当垃圾桶。它告诉 agent…

•1 分钟阅读•开发者工具
skillsagentscursor
教代理用你的口吻写作

你正在读的这篇博客是 AI 代理写的。但听起来像是我写的。 这不是巧合。我写了一个 skill——一套可复用的指令——教代理如何用我的口吻写、按我的内容 schema 来、按我会用的结构组织文章。这篇文章既是说明,也是证明。 真正的问题不是能力…

•1 分钟阅读•开发者工具
skillsagentscursor
Spec-Kit 教训:先打草稿再写 spec,先定范围再写代码

第一次用 spec-kit 时,我塞进去一段含糊的需求就点了运行。出来的 spec 技术上成立——但 practically 没用:太宽、太野心、和编码代理一次会话里能执行的东西脱节。 问题不在工具,在我的输入。 在多个项目里跑了几十次 spec-kit…

•2 分钟阅读•工作流
spec-kitagentscursor