Generates self-contained HTML prototypes with design context from project files. Read design principles, personas, and hypothesis files, then produce a working prototype for Usability and Value risk validation. Use when creating prototypes or validating through tangible artifacts.
Prototypes are hypothesis validation tools, not final implementations. They test Usability and Value risks by making ideas tangible enough for evaluation.
Generate a single self-contained HTML file in docs/discovery/prototypes/. The file must:
Before generating, read the relevant project files to understand the full context:
docs/product/design-principles.mddocs/product/personas/docs/discovery/hypotheses/docs/product/vision.md for tone and value propositionThese files drive every design decision. A prototype built without reading them validates nothing.
docs/product/design/ exists)Read all available artifacts from docs/product/design/ (information architecture, brand direction, user flows, content model, AI interaction model). When present, brand direction overrides ad-hoc aesthetic inference from design principles.
How to connect prototypes with your design system depends on your setup:
docs/discovery/prototypes/For detailed construction patterns, state design guidance, and scope boundaries, see references/prototype-prompt-guide.md.