design-document

Invoke the skill with a short design brief describing the page, screen, or flow you need. It researches your codebase and domain, drafts a 14-section design document with wireframes and a contrast report, then refines it through specialist critics until approved.

The pipeline produces design.md following a 14-section template, wireframes.md with ASCII wireframes and Mermaid diagrams, and wcag-report.md with computed contrast ratios for every color pair. A final-summary.md indexes all artifacts after user approval.

An accessibility-specialist critic recomputes every contrast ratio from scratch using the WCAG luminance formula and verifies all color pairs are reported. Any text pair failing the 4.5:1 AA-normal threshold triggers a hard gate failure that blocks finalization.

Yes. The finalized design is presented in an approval gate where you can approve, reject, or reply with feedback. Feedback dispatches a revision writer that updates the artifacts and re-presents them, looping until you explicitly approve.

Do not use it to implement designs in code, review existing design docs, or brainstorm directions without committing to a spec. It is also out of scope for print, brand, or industrial design work.

The loop is capped at 5 iterations. If critics still report failures at the cap, the skill escalates to you with options to accept the design with unresolved findings logged, abort the task, or provide guidance for one final revision.