https://github.com/pbakaus/impeccable 讲一下这个skill的核心理念和流程

回复 群友 9755： 先说这仓库是什么：pbakaus/impeccable，作者 Paul Bakaus，Apache 2.0，现在 65.5k star。一句话定位是"给 AI coding agent 用的设计语言"——它不生成设计，它纠正 AI 生成前端的默认审美。 它被做出来的原因很具体。Anthropic 的 frontend-design 是第一个被广泛使用的 Claude 设计 skill，Impeccable 是从那里起步的。但所有模型都在同一批 SaaS 模板上训练，不干预的话每个项目都会出现同样的破绽：什么都用 Inter 字体、紫到蓝的渐变、卡片里再套卡片、彩色背景上放灰字、每个标题上方都顶一个圆角方形图标块。你肯定见过这种页面，一眼就知道是 AI 写的。Impeccable 就是把这些"tells"变成可检测、可修的东西。 核心理念有三条，我掰开说。 第一，把"产品的长期事实"和"表面的视觉方向"分开存。这个是它跟别的设计 skill 最不一样的地方。/impeccable init 会记录受众、目的、使用场景、约束、语气、证据这些durable product truth 到 PRODUCT.md；而视觉系统（是沿用现有设计还是新建）单独记在 DESIGN.md。访客模式、视觉方向是后面每个 surface 单独选的。为什么这么分？因为产品是什么不会天天变，但一个页面的视觉方向是每次都要重新决定的，混在一起 AI 就会把"我们的用户是开发者"这种事实当成"所以要用暗色科技风"这种视觉结论，然后每个页面都套同一个模板。 第二，给 AI 一套共享的设计词汇。23 个命令都是词，不是函数：polish、audit、critique、distill、animate、bolder、quieter、harden、onboard、colorize、typeset、layout、delight、overdrive、clarify、adapt、optimize、live 等等。好处是你跟 AI 讨论设计时说的是同一套语言。比如"这个落地页太吵了"，你打 /impeccable quieter landing，它知道要往哪个方向调；反过来觉得太平庸，用 bolder。用得多的命令可以 pin，/impeccable pin audit 之后就变成独立的 /audit。 第三，确定性规则和 LLM 判断分层。61 条 detector 规则是纯确定性的，跑的时候不需要 LLM、不需要 API key，CLI 和浏览器扩展都能跑：npx impeccable detect src/ 扫目录，也能直接扫 URL。它能抓两类问题，一类是 AI 味（侧边 tab 边框、紫色渐变、bounce 缓动、暗色 glow），一类是通用设计质量（行宽过长、内边距太挤、触控区域太小、标题层级跳级）。LLM 只负责 critique 那种需要判断的部分。README 里有句话我觉得挺诚实：detector 跑干净只是证据，不等于视觉和可访问性质量过关，不能替代你自己在多视口下看渲染效果。 流程上大概是这么一条链： init 一次，把 PRODUCT.md 立起来，能配的话顺手配好 live 模式。 shape 先规划 UX/UI，别急着写代码。 craft 是完整的"先定形再构建"流程，带视觉迭代。 做完了用 critique 做 UX 评审（层级、清晰度、情感共鸣），audit 做技术检查（a11y、性能、响应式），document 从现有代码反向生成 DESIGN.md，extract 把可复用组件和 token 抽进设计系统。 最后 polish 收尾、harden 补边界情况、onboard 补首次进入和空状态。 还有一个我比较喜欢的机制是设计 hook。装完之后，Claude Code、Copilot、Codex、Cursor、Grok Build 上会在你直接改 UI 文件时自动跑 detector，把发现的问题回注到 agent 流程里。Cursor 更进一步，会在错误的写入落盘之前就拦下来。Codex 需要你手动 /hooks 批准一次，Grok 需要 /hooks-trust。 另外它有个 buildPath 设置，init 时问一次：comp-first（先生成高保真稿再照着写代码，更大胆但慢）还是 code-first（直接在代码里build，把野心写进 development-only 的方向合同里，到收尾时检查，更轻更快）。没有图像生成能力的 harness 就别选 comp。 安装就两步，项目根目录 npx impeccable install，然后进 AI 工具里跑 /impeccable init。支持的工具挺全，Claude Code、Cursor、Gemini CLI、Codex、Copilot、Grok、Hermes、Pi、Trae、Qoder、Vibe、Veto 都有对应的安装方式，也支持 npx impeccable detect 进 CI。 一句话总结：它把"别让 AI 写出千篇一律的 SaaS 脸"这件事，从一句口头提醒做成了一套有命令、有规则、有 hook 拦截的工程化流程。