unslop

用途

unslop 是一个在使用 AI 编码智能体开展前端界面工作之前调用的技能。它的核心原则是：不要让编码智能体从一段简短提示词就直接开工。智能体应当从清晰的产品解读、具体的设计契约、已知的设计系统方向、明确的品味控制、无障碍约束、响应式规则、根因治理、浮层规则、安装智能体工具链（Install Agent Harness）建议以及实现交接说明出发。如果这些交付物缺失、薄弱或充满占位符，实现就会被阻断。

三份核心交付物

PRODUCT.md

记录产品与策略背景，不充当视觉风格指南。应包含产品名称、产品类别、核心用户、用户情境、主要待办任务、产品承诺、情感基调、品牌特质、产品绝不能给人的感觉、UX 风险、无障碍需求、本地化需求、写作语气、反向参考、成功标准、假设，以及已知时的设计系统基线与适配理由。不应放入颜色、阴影、间距尺度、圆角或组件样式。

DESIGN.md

面向实现的设计契约。应包含 Design Read、Taste Controls、Design System Decision、视觉方向、颜色令牌、字体尺度、间距与密度规则、层次与阴影、组件契约、响应式行为、无障碍规则、方向性规则、模态框视口契约、浮层与反馈规则、堆叠上下文与 z-index 推理、弹窗定位策略、敏感数据展示规则、根因模式规则、安装智能体工具链建议、反 AI 敷衍指南、智能体交接与预检。只写“现代、高级、干净、极简、类 SaaS、AI 驱动”等空泛形容词的 DESIGN.md 不算实现就绪。

AGENTS.md

告诉 AI 编码智能体如何在仓库中工作。应包含变更规模策略、编码前必读文件、需运行的 CLI 命令、测试预期、必须保留的产品/设计约束、无障碍与隐私要求、就绪规则、根因模式顺序、安装智能体工具链顺序，以及先应用修复清单再实现的指令。新项目使用 AGENTS.md；已有 AGENT.md 的项目保持向后兼容。

主要能力

项目模式分类：fresh-seed、existing-scan、redesign、implementation、audit、amplify、repair、root-cause-fix、harness-readiness；模式不明确时推断并简要说明假设。
项目扫描：在可访问文件系统时检查 PRODUCT.md、DESIGN.md、AGENTS.md、AGENT.md、package.json、src/、app/、pages/、components/、样式文件、截图与参考图等。
设计系统基线门槛：允许值为 atlassian、salesforce-lightning、shopify-polaris、material-design、apple-human-interface、custom-hybrid；基线指导结构与行为，不得复制其他公司品牌皮肤。
品味校准：DESIGN_VARIANCE、MOTION_INTENSITY、VISUAL_DENSITY 三个 1 到 10 的刻度，缺失或非法值会阻断就绪。
占位符策略：PRODUCT.md 或 DESIGN.md 中残留 [audience]、[Feature 1]、[product name]、TODO、TBD 等未解析模式时阻断实现。
根因模式：涉及 bug、布局、视口、浮层、z-index、裁剪、回归等问题时，必须先复现、分离症状与根因、找出最小根修复、检查邻近回归并提供验证证据；不接受魔法数字、z-9999 或未诊断的大范围重写。
模态框视口与浮层治理：要求视口契约、宽度与高度防护、内部滚动、移动端行为，以及小视口、横屏、键盘打开状态下的 QA 证明；分层 UI 需有放置计划、堆叠上下文审计、层级尺度、portal 策略与冲突矩阵。
安装智能体工具链建议：只推荐当前缺失的技能与工具，输出活动宿主、项目形态、风险画像、优先级、理由、安装方式与验证回滚说明，禁止批量安装。
源码扫描：检查可点击的非交互元素、原生 alert()/confirm()、虚假内容、暴露的 API 密钥、根级 overflow:hidden、硬编码颜色、通用渐变、缺失地标与标签、无名称的纯图标按钮、无无障碍名称或焦点行为的模态框、无碰撞处理的下拉菜单、无 z-index 令牌的浮层、盲目升级 z-index 等。

使用方式

推荐命令包括：

npx unslop init
npx unslop audit --verbose
npx unslop repair --dry-run --report
npx unslop autopilot

源码扫描命令：

npx unslop scan src/
npx unslop scan:a11y src/
npx unslop scan:viewport http://localhost:3000

仓库测试命令：

npm test

报告应包含评分、就绪等级、分类细分、阻断项列表、安全修复摘要、源码修复清单、确切的下一条命令，以及编码智能体接下来必须读取的文件。

就绪等级

blocked：关键阻断项仍在，不得实现。
needs-spec-work：交付物存在但过于空泛，先修复或重写文档。
agent-ready-with-fix-list：基本就绪但仍有修复清单项，先应用清单再重跑审计。
agent-ready：足够具体，可交给编码智能体开始实现。

修复策略

允许的安全修复包括：创建缺失的 PRODUCT.md、DESIGN.md 或 AGENTS.md；补充缺失的必需章节与清单；添加缺失的模板块；编写修复清单说明；添加报告输出。应避免破坏性修复：不保留有用决策地重写完整产品策略、随意删除用户决策、未经审查大范围修改源码、把警告级设计偏好变成任意新品牌决策。

适用场景

SaaS 仪表盘、管理后台、落地页、产品页、双语 RTL/LTR 产品、阿拉伯语优先产品、设计系统准备、UI 重设计、AI 生成前端清理，以及需要更安全智能体设置的 vibe-coded 项目。

限制

不适用于纯后端任务、仅数据库工作、非 UI 脚本，或成熟设计系统已完全约束前端实现的项目。对于无法安全自动修复的源码问题，应写入修复清单交由编码智能体处理。具体收费、价格与平台支持信息暂未提供。