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。

必讀參考

推薦輸入

工作流

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

Step 0–3：視覺（保留原流程）

1. 識別平臺 → DSL → design-baseline.json（含 source_tool）
2. 視口對齊：dev 與 frame 誤差 ≤2%，否則 L2 px 標 untested
3. 按 full-checkpoint-checklist.md 走查 V-*（編碼可用 VA-*，報告歸一化為 V-*）
4. 每條 visual fail 須 bbox_px；design 引 DSL

id: 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

Step 4：互動驗收

見 interaction-checklist.md。無 URL 時 I- 標 untested + note，禁止*猜扣分。

Step 5：適配驗收

見 adaptation-checklist.md。多視口/深色/Lighthouse。

Step 6：極端場景

見 extreme-scenarios.md。產出 risk-acceptance.json。

小蔥技能站7w4.net每天更新，海量AI技能等你發現。

Step 7：計分

scripts/va_utils.py → build_scores_payload(ledger, findings)。ledger 每個 V/I/A 一行。

Step 8：HTML 報告

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"

與 design-fidelity-audit 區分

詳見 fidelity-audit-migration.md。

輸出檢查

• [ ] 已執行 acceptance-guardrails.md 開驗前清單
• [ ] design-baseline.json + report-meta.json
• [ ] 全部 V/I/A checkpoint 有 pass/fail/na/untested
• [ ] visual fail 均有 bbox_px；design 引 DSL
• [ ] scores.json 含 visual/interaction/adaptation/total/grade/veto_applied
• [ ] HTML：三維度分 + 分維 ledger + 極端場景附錄（如有）

這個 Skill 質量紮實，文件非常詳細，驗收規則清晰，扣分機制設計合理，能有效避免誤判。支援對比設計稿和開發實現，自動生成帶評分的 HTML 報告。不足之處是配置檔案命名有個小問題，以及部分文件較長、較專業，新手需要花時間消化。總體推薦使用。