name: design-acceptance-check description: 通过 Figma、MasterGo 等设计稿链接与开发截图/URL,按 Notion《验收全量检测内容清单》三维度加权验收(视觉40%+交互35%+适配25%),DSL 基准、V/I/A 全量检查点、bbox 标注与极端场景附录,输出 HTML 报告。Use when the user mentions 设计验收、视觉验收、三维度、交互验收、适配验收、极端场景、Figma、MasterGo、全量检查点、验收报告。
对比 设计工具基准(Figma / MasterGo / Pixso / 即时设计等)与 开发实现(截图 + URL),按 Notion《验收全量检测内容清单》 三维度加权验收,输出计分与标注报告。
权威规则:rules-reference.md(Notion 定稿 + PDF)。计分:scoring-algorithm.md。
| 文件 | 用途 |
|---|---|
| rules-reference.md | V/I/A 检查点与扣分 |
| scoring-algorithm.md | 三维度加权与否决 |
| design-link-baseline.md | 设计链接 → baseline |
| figma-baseline.md / mastergo-baseline.md | 平台 DSL |
| full-checkpoint-checklist.md | 全量走查表 |
| interaction-checklist.md | 交互 I-* |
| adaptation-checklist.md | 适配 A-* |
| extreme-scenarios.md | 极端场景分层 |
| annotation-guide.md | bbox 标注 |
| acceptance-guardrails.md | 防误判 |
| report-generation.md | HTML 报告 |
| 必填 | 说明 |
|---|---|
| 设计稿链接 | 指向整页验收 Frame |
| 开发截图 | 已登录、与设计帧同宽 PNG |
| 强烈推荐 | 说明 |
|---|---|
| 开发 URL | 交互 I-*、适配 Lighthouse、CDP 精确抽测 |
Task Progress:
- [ ] 0. 读 acceptance-guardrails.md 开验前清单
- [ ] 1. 设计链接 → design-baseline.json
- [ ] 2. 路由/端型/采图(H5:/app/ + iPhone UA + CDP clip)
- [ ] 3. 视觉 L1/L2/L3(V-* 全量)
- [ ] 4. 交互走查(I-*,需 URL)→ interaction-checklist.md
- [ ] 5. 适配走查(A-*)→ adaptation-checklist.md
- [ ] 6. 极端场景 → extreme-scenarios.md + risk-acceptance.json
- [ ] 7. 三维度计分 + checkpoint_ledger(~51 行 V/I/A)
- [ ] 8. HTML 报告 + annotated-dev.png
design-baseline.json(含 source_tool)untestedVA-*,报告归一化为 V-*)bbox_px;design 引 DSLid: F-003
checkpoint_code: V-COLOR-BRAND
dimension: visual
severity: general
deduction: 2
bbox_px: [545, 162, 78, 16]
design: "Token brand-warning #F5A623"
actual: "截图取样 #1890FF"
verified_by: mastergo_dsl
见 interaction-checklist.md。无 URL 时 I- 标 untested + note,禁止*猜扣分。
见 adaptation-checklist.md。多视口/深色/Lighthouse。
见 extreme-scenarios.md。产出 risk-acceptance.json。
scripts/va_utils.py → build_scores_payload(ledger, findings)。ledger 每个 V/I/A 一行。
SKILL="${VA_SKILL_ROOT:-.}" OUT=reports/design-acceptance-<page>-<timestamp> python3 "$SKILL/scripts/generate-report.py" \ --dir "$OUT" \ --title "<页面>设计验收" \ --meta "375×812 · H5 · $(date +%F)" \ --dev dev.png \ --baseline design-baseline.json \ --findings findings.json \ --ledger checkpoint-ledger.json python3 "$SKILL/scripts/bake-annotations.py" \ "$OUT/dev.png" "$OUT/findings.json" -o "$OUT/annotated-dev.png"来源于7w4.net。
| 项目 | 本 skill(全量) | design-fidelity-audit(快速) |
|---|---|---|
| 设计源 | Figma/MasterGo DSL 为主 | PNG / 截图为主 |
| 范围 | V+I+A 三维度 + 极端场景 | 三维度但弱 DSL/MCP |
| 编码 | V/I/A-* + guardrails | V/I/A-* |
| 报告 | 脚本化 HTML + 多维度分 | Canvas/HTML 摘要 |
| 选用 | 正式验收、有设计链接 | 仅两张截图快速扫一眼 |
详见 fidelity-audit-migration.md。
design-baseline.json + report-meta.jsonbbox_px;design 引 DSLscores.json 含 visual/interaction/adaptation/total/grade/veto_applied这个 Skill 质量扎实,文档非常详细,验收规则清晰,扣分机制设计合理,能有效避免误判。支持对比设计稿和开发实现,自动生成带评分的 HTML 报告。不足之处是配置文件命名有个小问题,以及部分文档较长、较专业,新手需要花时间消化。总体推荐使用。