What problem does it solve? It prevents frontend design documents from ignoring the actual repository by forcing every UX, wireframe, visual, and layout decision to be grounded in real routes, components, tokens, and styling evidence instead of assumptions. ## Core Features & Use Cases - Evidence-First Design Flow: Reads design-context.md, PRDs, spec.md, and actual frontend repo files before writing any design artifact, recording evidence IDs and file paths. - Structured Artifact Pipeline: Produces ux-spec.md, wireframe-spec.md, DESIGN.md, visual-design-spec.md, layout.md, screen-preview.html, and QA/review reports in a session artifact directory without polluting the product repository. - Option Gates and Quality Review: Generates three visual and three layout directions on a shared neutral frame, enforces uniqueness gates, and runs rendered browser QA plus a scored visual quality critique. - Use Case: After a PRD is approved, run this flow to produce a repo-aware design system, layout contract, and high-fidelity HTML preview that frontend planning can implement directly. ## Quick Start Use the repo-aware UI design flow to turn the approved design-context.md into UX, wireframe, visual, and layout specs plus an HTML preview grounded in this repository.
