ui-audit
Drive a running web or Electron app and emit a deterministic UI/UX + functional audit — accessibility, contrast, spacing, tap targets, dead buttons, affordance/focus-visible, motion duration, visual regression, plus the extended gates (Lighthouse perf/CWV, dual-theme + reflow capture, APCA advisory, a 2nd a11y engine, real-NVDA, Design2Code mirror fidelity, Storybook a11y) (Track-A) — then a structured design-quality VERDICT (Track-B) where Claude reasons over the pre-computed numbers + the screenshot on the DESIGN-EVAL v1 rubric — nine dimensions each scored 0-4, a critical-error override that forces a zero and caps the verdict, a weighted composite (color-contrast highest), a one-dimension-per-call reliability protocol, and an optional cross-vendor Codex critic (5th persona) reconciled into a conservative consensus — against Refactoring-UI/Material/HIG/Nielsen/WCAG. READ-ONLY (drives and inspects; never edits app source). Emits terminal-state typed findings plus a typed critique schema with a computed weighted composite. Optional UIClip numeric prior (opt-in, RAM-guarded).
- License 许可
- MIT
- 最近更新
- 2026-11-02
- Stars
- ★ 0
- Forks
- 0
01 前言 Front Matter
- name
- ui-audit
- agent
- general-purpose
- context
- fork
- metadata
- { "origin": "user" }
- description
- Drive a running web or Electron app and emit a deterministic UI/UX + functional audit — accessibility, contrast, spacing, tap targets, dead buttons, affordance/focus-visible, motion duration, visual regression, plus the extended gates (Lighthouse perf/CWV, dual-theme + reflow capture, APCA advisory, a 2nd a11y engine, real-NVDA, Design2Code mirror fidelity, Storybook a11y) (Track-A) — then a structured design-quality VERDICT (Track-B) where Claude reasons over the pre-computed numbers + the screenshot on the DESIGN-EVAL v1 rubric — nine dimensions each scored 0-4, a critical-error override that forces a zero and caps the verdict, a weighted composite (color-contrast highest), a one-dimension-per-call reliability protocol, and an optional cross-vendor Codex critic (5th persona) reconciled into a conservative consensus — against Refactoring-UI/Material/HIG/Nielsen/WCAG. READ-ONLY (drives and inspects; never edits app source). Emits terminal-state typed findings plus a typed critique schema with a computed weighted composite. Optional UIClip numeric prior (opt-in, RAM-guarded).
02 资源文件 9
- 许可证LICENSE.txt11.1 KB
- 参考文档reference/evaluation.md21.2 KB
- 参考文档reference/mcp_best_practices.md7.2 KB
- 参考文档reference/node_mcp_server.md27.9 KB
- 参考文档reference/python_mcp_server.md24.5 KB
- 脚本scripts/connections.py4.8 KB
- 脚本scripts/evaluation.py12.3 KB
- 脚本scripts/example_evaluation.xml1.2 KB
- 脚本scripts/requirements.txt29 B
03 SKILL.md 正文
ui-audit Skill
Drives a live web or Electron app and runs five deterministic audit gates. Produces a structured findings JSON that Claude (as orchestrator) then reasons over for design critique (Track-B).
Skill location: ~/.claude/skills/ui-audit/
When to use
- Auditing your own running apps: Reframe (Electron+React), momentstudio (web), bilbo-web (web).
- Spotting WCAG contrast failures, off-scale spacing, dead buttons, and tap-target violations before a PR.
- Establishing a visual baseline and detecting regressions between builds.
- This is the "See" step before Claude provides the "Reason" (Track-B design critique).
Install once
cd ~/.claude/skills/ui-audit
npm install
npx playwright install chromium
Optional (if pixelmatch/pngjs are missing):
npm install pixelmatch pngjs
Gates — 5 core + the extended lane
Core gates (5) — shipped + enforcing:
| Script | Gate | Browser? |
|---|---|---|
capture.mjs |
Evidence bundle: screenshot + computed styles + a11y tree + console/network + pageErrors | Yes |
layout_lint.mjs |
Deterministic design heuristics (contrast, spacing, tap targets, type scale) | No — pure JSON |
dead_button_crawl.mjs |
Clicks every interactive element (by handle); flags those with zero observable effect | Yes |
axe_scan.mjs |
WCAG violations via @axe-core/playwright |
Yes |
visual_diff.mjs |
Baseline screenshot compare via pixelmatch; flags regressions | No — pure PNG |
Invocation per gate
1. Capture evidence bundle
2. Layout lint (no browser — runs on captured bundles)
Single bundle:
All bundles in a directory:
3. Dead button crawl
4. axe accessibility scan
5. Visual diff (baseline compare)
After capture.mjs has written PNGs:
6. Extended Track-A gates (SHADOW — separate-apply engines)
04 同仓库更多 Skills
clarify-requirements
Resolve genuine pre-execution ambiguity by scanning repo context, generating 1-6 grounded options, and asking 1-3 focused questions via AskUserQuestion. NOT for mid-task use (injection risk); NOT when the goal is already unambiguous; use to disambiguate vague prompts before any file edits.
openmm-md
Run FREE, open-source, Windows-native GPU molecular dynamics via the openmm-md MCP (OpenMM + CUDA on the local NVIDIA GPU). Use for protein / protein-ligand MD when you want a free stack or are on Windows without a Schrodinger license. Covers the full workflow (prepare, solvate, minimize, equilibrate, production, analyze, mmgbsa) AND an honest decision guide vs Schrodinger Desmond, including how to run Desmond legitimately on Linux or a cloud GPU with a real license. This is a deliberately LESSER free alternative and does NOT replace the schrodinger MCP tools. Do NOT use it to pick a free tool when a validated FEP+, WaterMap, IFD-MD, or Prime MM-GBSA result is actually required.
visual-review
Take screenshots of web pages and UI using Playwright for visual review and iteration
status
Diagnostic status report — shows metaswarm installation state, project setup, and potential issues
start
Use when starting work on any task, when the user mentions metaswarm, or when the user wants to begin tracked development work
setup
Interactive project setup — detects your project, configures metaswarm, writes project-local files