prototype

Prototype is single-use code designed to answer a specific design question. Use it when you need to verify whether a state model or logic feels correct, or to explore what a UI should look like. After validating the decision, capture findings and discard the prototype.

• Choose between logic validation (state machine behavior via interactive HTML) or UI exploration (multiple design variations via URL params)
• Run with zero setup friction—single HTML file or one task-runner command
• Keep state in memory with no persistence layer; focus on learning, not production concerns
• Expose full state after each action so changes are immediately visible
• Skip polish: no tests, minimal error handling, no abstractions—speed over perfection

1. 1.Identify the core question: 'Does this logic/state model feel right?' or 'What should this look like?'
2. 2.For logic questions, build a single shareable HTML file with buttons and tabbed walkthroughs that drive the state machine
3. 3.For UI questions, generate several distinct design variations on a single route, switchable via URL search params and a floating control bar
4. 4.Place the prototype next to the code it validates, with naming that clearly marks it as throwaway (not production)
5. 5.Run the prototype from a single command or file double-click with no setup required
6. 6.After each action or variant switch, display the complete relevant state so changes are visible
7. 7.Once you've validated the decision, capture the verdict in the implementation issue, save the prototype on a throwaway branch as a reference, and merge only the verified decision into main