Build throwaway HTML demos and UI variants to answer design questions.
npx skills add https://github.com/sndrgrdn/skills --skill prototype-sndrgrdn
Please help me install this Agent Skill. Skill: prototype Source: https://github.com/sndrgrdn/skills/tree/main/prototype Command: npx skills add https://github.com/sndrgrdn/skills --skill prototype-sndrgrdn
?variant= URL param and a floating bottom bar with arrow-key navigation. - Capture workflow: Fold validated decisions into real code and preserve the prototype on a throwaway branch as a primary source. - Use Case: You are unsure whether a state machine handles an edge case. The Skill builds a shareable HTML demo where a PM clicks through scenarios and discovers the illegal transition themselves. ## Quick Start Ask the AI to prototype whether your state machine handles the edge case where a user cancels mid-checkout, as a shareable HTML demo.High-intent search queries and answers about installing and using this skill.
Build a single self-contained HTML file with the state machine as a pure module, free-play buttons for each action, and tabbed guided walkthroughs for edge cases. Anyone can open it by double-clicking, with no framework, bundler, or server required.
Render 3-5 structurally different variants on the same route, gated by a ?variant= URL search param, with a floating bottom bar to cycle between them. Variants must differ in layout and information hierarchy, not just colors or copy.
Prototypes should use in-memory state by default, since persistence is usually the thing being checked, not a dependency. Only hit a scratch database or clearly marked local file when the question explicitly involves persistence.
Skip prototyping when the question is already answered or when you would add tests, error handling, or abstractions, since those signal production work. A prototype answers one question fast and is never promoted directly to production.
Fold the validated decision into the real code, then commit the full prototype to a throwaway branch as a primary source with a pointer on the implementation issue. The main branch keeps only the validated decision, not the prototype shell.
pixelasticGenerate a PRD from conversation context and publish it to the issue tracker.
shaahyBuilds throwaway prototypes to answer logic or UI design questions.
coalesce-labsAnalyze structured prototype feedback and generate prioritized iteration plans.
DeiblerSelects the appropriate prototype fidelity for each iteration and research question.