审美判断力 + 精工度评分 + 自我批评循环
以审美判断力驱动前端设计,而非套用模板。Explore/Production 双模式确保方案从发散到收敛,Critique Protocol 在交付前执行自我批评循环。反 AI 审美同质化,输出精工级、可实施的设计规格。
FEATURES
核心参考 aesthetic-intelligence.md。每个方案基于审美维度评估,而非套模板。破除 AI 审美同质化。
自我批评循环:以苛刻设计评论家视角审视方案。Production 结束自动触发,用户亦可手动唤起。
Explore(发散 2-3 方向)→ Production(收敛唯一方案 + 质量评分 + 工程交接)。
5 份独立参考文档按任务阶段按需加载(审美/批评/设计系统/页面模式/工程交接),避免上下文膨胀。
10 项必含产出:色彩方案 OKLCH、字体配对、组件树、状态覆盖、批评报告、性能预算。
输出 React/Vue 可直接实施的组件结构、Design Token 定义和现代 CSS 指引。
从 v0.2.0 起,本技能不再是「设计教科书」——它是审美判断力提示词工程。 Agent 通过
aesthetic-intelligence.md获得审美锚点,通过critique-protocol.md获得自我批评能力。
对 Agent 说"帮我设计订单列表页",自动进入探索再收敛:
> "设计一个订单管理页面"
Agent 执行:
1. 加载 aesthetic-intelligence.md — 审美锚定
2. Explore 模式 — 提出 2-3 个方案方向并对比
3. 用户选择方向后进入 Production 模式
4. 收敛为唯一主方案 + ≤ 2 备选(附拒绝原因)
5. 自动触发 Critique Protocol — 修复所有 🔴
6. 输出质量评分 + 工程交接文档方向已明确时跳过探索:"按这个 wireframe 出 Production 级规格"
随时触发:"critique"、"残酷审视"、"review the design"
Agent 按任务阶段按需加载,避免上下文膨胀:
| 阶段 | 参考文档 | 说明 |
|---|---|---|
| 方案启动 | references/aesthetic-intelligence.md | 审美判断力核心 — 始终首先加载 |
| 交付批评 | references/critique-protocol.md | Critique Protocol — Production 结束或用户请求时 |
| 视觉定义 | references/design-system.md | Design Token 定义、现代 CSS 指引 |
| 页面结构 | references/page-patterns.md | 页面原型、状态覆盖、交互模式 |
| 工程交接 | references/engineering-handoff.md | React/Vue 交接规范 |
loading / empty / error / success / permissionINSTALL