critique 是技能集 pbakaus/impeccable 中的一个设计评审技能(Skill),用于从用户体验(UX)视角评估界面设计,评估维度包括视觉层级、信息架构、情感共鸣、认知负荷与整体质量。
用途 该技能的目标是生成一份结合了主观设计评审与客观自动检测的设计评审报告,供设计负责人视角的反馈使用。它强调直接、具体、按优先级排序的反馈,不软化批评。
使用方式 技能以分步流程组织:
第 1 步:准备。调用 /impeccable,其中包含设计原则、反模式与上下文收集协议。必须先遵循该协议;如果尚无设计上下文,必须运行 /impeccable teach。同时收集界面想要达成的目标。
第 2 步:收集评估结果。启动两路互相看不到对方输出的独立评估以避免偏差,建议分别委派给独立子代理;若环境不支持子代理则顺序完成并写入内部笔记。在浏览器自动化可用时,每个评估必须新建标签页,不能复用已有标签页。
评估 A(LLM 设计评审):读取相关源码(HTML、CSS、JS/TS),若可用则通过浏览器自动化目视检查实时页面,新建标签页后将标题设为 document.title = '[LLM] ' + document.title;。以设计负责人视角评估 AI Slop 检测(对照 impeccable 技能中所有 DON'T 指南,检查 AI 配色、渐变文字、暗色光晕、玻璃拟态、英雄指标布局、千篇一律卡片网格、通用字体等)、整体设计评审(视觉层级、信息架构、情感共鸣、可发现性、构图、排版、色彩、状态与边界情况、微文案)、认知负荷(8 项认知负荷清单,统计失败项 0-1 为低/良好、2-3 为中等、4+ 为严重;每个决策点可见选项若超过 4 个则标记;检查渐进式披露)、情感旅程(峰值-终值规则、高风险时刻的情绪低谷与设计干预)、Nielsen 启发式(对 10 项各评 0-4 分)。返回结构化发现,包括 AI slop 判定、启发式评分、认知负荷评估、2-3 项做得好的点、3-5 项优先问题、次要观察与值得思考的问题。
评估 B(自动检测):运行内置确定性检测器,可标记 25 种特定模式(AI slop 特征与通用设计质量问题)。 CLI 扫描命令:npx impeccable --json [--fast] [target] 可传入 HTML/JSX/TSX/Vue/Svelte 文件或目录(任何含标记的内容),不要传仅 CSS 文件。URL 跳过 CLI 扫描(需要 Puppeteer),改用浏览器可视化。大型目录(200+ 可扫描文件)使用 --fast(仅正则,跳过 jsdom),500+ 文件时缩小范围或询问用户。退出码 0 表示无问题,2 表示有发现。 浏览器可视化(当浏览器自动化工具可用且目标是可查看页面时):叠加层是给用户的可视辅助,不要滚动截图,改为读取控制台输出。启动实时检测服务器:npx impeccable live &;记下 stdout 打印的端口(自动分配),可用 --port=PORT 固定。新建标签页并导航到页面,不复用已有标签页。通过 javascript_tool 将标题设为 document.title = '[Human] ' + document.title;。滚动到页面顶部后注入: const s = document.createElement('script'); s.src = 'http://localhost:PORT/detect.js'; document.head.appendChild(s); 等待 2-3 秒待检测器渲染叠加层,然后用 read_console_messages 以 pattern impeccable 读取结果(检测器以 [impeccable] 前缀记录所有发现)。清理:npx impeccable live stop。多视图目标在 3-5 个代表性页面注入;注入失败则仅用 CLI 结果。返回 CLI 发现(JSON)、浏览器控制台发现(如适用)与已注意到的误报。
第 3 步:生成合并评审报告。将两路评估综合为一份报告,不简单拼接,注明双方一致之处、检测器发现而 LLM 漏掉之处、以及误报。报告结构:设计健康度评分(以表格呈现 Nielsen 10 项启发式评分,含总分与评级区间;4 分表示真正优秀,多数真实界面为 20-32 分);反模式判定(先说是否像 AI 生成,包含 LLM 评估、确定性扫描摘要与可视化叠加层说明);整体印象;做得好的地方(2-3 项);优先问题(3-5 项,每项标注 P0-P3 严重度,并给出 What/Why it matters/Fix 与建议命令,命令只能取自:/animate、/quieter、/shape、/optimize、/adapt、/clarify、/layout、/distill、/delight、/audit、/harden、/polish、/bolder、/typeset、/critique、/colorize、/overdrive);人设红旗(自动选择 2-3 个与该界面类型最相关的用户画像,若 .github/copilot-instructions.md 含来自 impeccable teach 的 ## Design Context 段,还可从受众/品牌信息生成 1-2 个项目专属画像,并列出具体失败元素与交互);次要观察;值得思考的问题。
第 4 步:询问用户。基于实际发现提出 2-4 个针对性问题,涉及优先方向、设计意图、范围与可选约束;每个问题必须引用报告中的具体发现,提供具体选项而非开放式提问;若发现较为直接(仅 1-2 个明确问题)可跳过提问直接进入第 5 步。
第 5 步:推荐操作。根据用户回答给出按优先级排序的操作摘要,先按用户声明的优先级、再按影响排序,每项描述携带足够上下文,将每个优先问题映射到合适的命令,跳过零收益命令,若用户选择有限范围则只包含范围内项,若标记了禁区则排除会触及该区域的命令。若有任何修复建议,以 /polish 作为最后一步。最后告知用户可按任意顺序逐个或一次性运行这些命令,并在修复后重新运行 /critique 查看评分提升。
适用场景 适用于对界面设计进行系统性 UX 评审,例如需要判断设计是否带有明显的 AI 生成痕迹、评估视觉层级与信息架构、检查认知负荷、以用户画像视角发现具体障碍,并在评审后获得基于命令的后续修复路径。
限制 两路评估的独立性依赖环境是否支持子代理;浏览器可视化依赖浏览器自动化工具与 Puppeteer,URL 场景无法使用 CLI 扫描;--fast 仅正则并跳过 jsdom,大目录需缩小范围;检测器可能存在误报;启发式评分与命令建议属于该技能的框架性输出,其具体价格、收费与平台支持信息在资料中暂未提供。