前Google高手做了一套反AI审美工具,18个命令治好你的AI设计脸盲症
你的 AI 写代码很强,但做出来的页面是不是都长这样:
Inter 字体、紫色渐变、到处都是圆角卡片、深色背景带发光效果、弹窗一关又弹一个。
恭喜你,你中了”AI 设计脸盲症”。
Paul Bakaus——Google 前 Web 性能团队负责人——受不了了。上周他发了 Impeccable 2.0,一个开源的 AI 设计技能包。核心理念很简单:AI 模型都从同一批模板学的设计,所以它们犯的错也一模一样。Impeccable 命名这些错误,检测它们,并教会 AI 避开它们。
PART 01
PART 01 问题:AI 的设计从哪来,就长成啥样
大模型的设计审美,本质上是训练数据的均值。
网上什么样的网页最多?Bootstrap 模板、Material Design、Tailwind 默认配置。AI 从这些”大多数”里学到了什么?
- 字体永远是 Inter 或 Roboto
- 配色永远是青色 + 紫色 + 霓虹点缀
- 布局永远是等宽卡片网格
- 标题上面永远放一个圆角大图标
- 动效永远是弹跳缓动(bounce easing)
- 深色模式永远带发光描边
这不是 AI 不行,是 AI 太”行”了——它精准地复现了互联网上最平庸的设计共识。
Paul Bakaus 管这个叫 “monoculture”(设计单一化)。Impeccable 的使命就是打破它。
PART 02
PART 02 方案:一个技能包 + 18 个设计命令
Impeccable 不是一个新工具,而是一套设计技能包(skill),直接装进你现有的 AI 编程工具里。
支持的工具:Cursor、Claude Code、Gemini CLI、Codex CLI、VS Code Copilot、OpenCode 等等。
安装方式超简单:
npx skills add pbakaus/impeccable
装完之后,你的 AI 编程助手就多了 18 个设计命令:
创建类
/impeccable— 生成有辨识度的、生产级的界面/shape— 先设计后编码,先做用户调研再写代码
评估类
/critique— 从 UX 视角评估设计质量/audit— 技术质量检查(无障碍、性能、响应式)
打磨类
/typeset— 改善字体排版/layout— 改善间距和视觉节奏/colorize— 有策略地加颜色/animate— 加有意义的动效/delight— 加惊喜感/bolder— 把无聊的设计变大胆/quieter— 把过火的设计调淡
简化类
/distill— 去繁就简/clarify— 改善文案表达/adapt— 跨设备适配
加固类
/polish— 上线前最终打磨/optimize— UI 性能优化/harden— 生产环境加固
系统类
/impeccable teach— 为项目设置设计上下文/impeccable extract— 提取可复用组件到设计系统
这些命令可以串联使用:
/audit # 全站扫描问题
/audit blog # 只审计博客页面
/polish checkout-form # 打磨结账表单
/audit /polish blog # 审计 + 打磨一条龙
PART 03
PART 03 杀手锏:25 条反模式检测
Impeccable 最实用的功能不是那 18 个命令,而是反模式检测器。
它定义了 25 条确定性规则,专门抓 AI 常犯的设计错误。不需要 LLM,纯正则 + 静态分析,扫一遍代码就知道哪里有问题。
字体反模式
- 使用 Inter、Roboto、Arial 等过载字体
- 用等宽字体假装”技术感”
- 全站只用一个字体家族
- 字号层级太平,看不出层次
颜色反模式
- 灰色文字放在彩色背景上(看不清)
- 纯黑
#000或纯白#fff(永远要带色调) - AI 经典配色:深色背景 + 青色 + 紫蓝渐变 + 霓虹点缀
- 用渐变色当文字(花哨不高级)
- 默认深色模式 + 发光描边
布局反模式
- 所有东西都包卡片
- 卡片里面套卡片
- 等宽等高的卡片网格无限复制
- “大数字 + 小标签”的 Hero 指标模板
- 什么都居中
- 全站用同一个间距值
动效反模式
- 动画布局属性(width、height、padding)
- 弹跳缓动(2026 年了还 bounce)
# 直接扫描项目
npx impeccable detect ./src
# 扫描线上页面
npx impeccable live https://your-site.com
PART 04
PART 04 核心洞察:字体选择的”反反射”流程
Impeccable 里最让我拍案叫绝的,是它的字体选择流程。
它要求 AI 在选字体之前,必须执行以下步骤:
第一步:写出品牌的 3 个具体关键词。不是”现代”、”优雅”这种废话,而是”温暖 + 机械 + 有态度”、”冷静 + 临床 + 谨慎”、”快 + 密集 + 不屑”。
第二步:写下你第一个想到的 3 个字体。然后——全部否决。因为 AI 的第一选择一定是训练数据里的高频字体,而高频 = 平庸。
第三步:带着品牌关键词去字体目录(Google Fonts、Pangram Pangram、Future Fonts 等)找一个像”物理对象”的字体——博物馆展品的说明文字、手绘店铺招牌、70 年代主机终端手册、大衣内侧的织物标签。
第四步:交叉验证。优雅不一定是衬线体,技术不一定是等宽体,温暖不一定是 Fraunces。如果最终选择符合直觉模式,回到第三步。
这个流程的核心思想:打破反射性选择,强迫模型做它不自然会做的事。
PART 05
PART 05 实测验证:AI 输出的多样性到底提升了多少
Paul Bakaus 建了一套内部评估框架,让同样的设计需求在有/无 Impeccable 的情况下,分别用 GPT-5.4 和 Qwen 3.6 Plus 跑一遍,然后测量输出落入”设计单一化”的程度。
结果:有 Impeccable 的情况下,字体和颜色的多样性显著提升,整体质量更高。
关键机制叫 anti-attractor(反吸引子)程序:强制模型先枚举出它的反射性默认选项,然后明确拒绝它们,再做选择。
在 15 个细分领域上验证有效。
简单说:Impeccable 让 AI 从”做安全的设计”变成”做有个性的设计”。
PART 06
PART 06 我的判断
三个观点:
第一,Impeccable 解决的是真问题。 AI 生成的前端代码审美趋同不是假象,是训练数据偏差的必然结果。18 个命令 + 25 条反模式检测,是从规则层面纠正这种偏差。
第二,”先设计后编码”的理念值得关注。 /shape 命令在写代码之前先做用户调研、生成设计 brief,然后 /impeccable craft 根据 brief 实现。这比”让 AI 直接写代码”有效得多——方向对了,执行才有意义。
第三,这东西对非设计师特别有用。 你不需要懂设计,只要知道怎么用 18 个命令,AI 就能帮你产出专业级的设计。命令本身就是设计知识的封装。
安装方式:
npx skills add pbakaus/impeccable
开源地址:github.com/pbakaus/impeccable(Apache 2.0)
THANKS FOR READING
⚡ 爱马仕 · Hermes Agent 技术分享
夜雨聆风