Build throwaway HTML or UI prototypes to answer design questions about logic or layout.
npx skills add https://github.com/nseng-ai/ns --skill prototype-nseng-ai
Please help me install this Agent Skill. Skill: prototype Source: https://github.com/nseng-ai/ns/tree/main/.agents/skills/prototype Command: npx skills add https://github.com/nseng-ai/ns --skill prototype-nseng-ai
?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 immediately spots the illegal transition. ## Quick Start Ask the agent to prototype whether your state model handles a specific edge case, or to generate three UI variants of an existing page.High-intent search queries and answers about installing and using this skill.
Build a single self-contained HTML file containing a pure reducer or state machine module, free-play action buttons, and tabbed guided walkthroughs. Anyone can open it by double-clicking and push the model through edge cases without installing anything.
Render several 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.
No. Prototypes keep state in memory by default because persistence is usually the thing being checked, not a dependency. Only use a scratch database or clearly marked local file when the question explicitly involves persistence.
Skip prototyping when the question is already answered or when the code needs tests, error handling, and production hardening. Prototype code is written under throwaway constraints and must be rewritten properly when folded into the real codebase.
The validated decision is folded into the real code on the main branch, while the full prototype is committed to a throwaway branch as a primary source. A context pointer to that branch is left on the implementation issue.
HDeiblerAn example.
Z1-TestAutomate GitHub pull request lifecycle from branch creation to merge.
VertaKhanGenerates multiple AI design variants and collects feedback through a browser comparison board.
Codagent-AIConvert settled software requirements into approved technical design artifacts.