prototype

Build throwaway terminal or UI prototypes to validate logic and design questions.

2|Updated Jan 26, 2026
One-click install
npx skills add https://github.com/Nzettodess/Awesome-Agent-Skills --skill prototype-nzettodess
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: prototype
Source: https://github.com/Nzettodess/Awesome-Agent-Skills/tree/main/Skills/Engineering%20Skills/skills/engineering/prototype
Command: npx skills add https://github.com/Nzettodess/Awesome-Agent-Skills --skill prototype-nzettodess

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Designs and state models often look correct on paper but break when exercised with real cases, and teams waste effort committing to untested ideas. This Skill produces throwaway prototypes that answer a specific question before real implementation begins. ## Core Features & Use Cases - Logic Prototypes: Build a small interactive terminal app with a pure, portable state module (reducer, state machine, or function set) to test business logic and state transitions by hand. - UI Prototypes: Generate several structurally different UI variants on one route, switchable via a ?variant= URL param and a floating bottom bar with arrow-key navigation. - Branch Routing: Automatically routes the request to the right prototype shape based on whether the question is about logic/state or visual design. - Use Case: Before building a new settings page, generate three radically different layouts on the existing route, flip through them in the browser, pick a winner, then delete the losers and fold the winner into the real page. ## Quick Start Prototype three different layouts for the settings page so I can compare them in the browser.

Frequently Asked Questions about prototype

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I prototype a state machine before implementing it?▼

Build a small interactive terminal app where the state logic lives in a pure, portable module such as a reducer or state machine, driven by keyboard shortcuts. Each action re-renders the full current state so you can push the model through edge cases and see where it breaks.

How to compare multiple UI design options in one app?▼

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.

Should a prototype have tests and error handling?▼

No. A prototype is throwaway code that answers one question, so tests, abstractions, and polish are explicitly skipped. If a prototype needs tests to be trusted, it has stopped being a prototype and should be written as real code.

When should I use a logic prototype versus a UI prototype?▼

Use a logic prototype when the question is about business rules, state transitions, or data shape, and a UI prototype when the question is what something should look like. If ambiguous, match the surrounding code: backend modules suggest logic, pages or components suggest UI.

What happens to prototype code after the question is answered?▼

The answer is captured in a commit message, ADR, issue, or NOTES.md, then the prototype is deleted or the validated logic module is folded into the real codebase. The terminal shell and losing UI variants are never shipped to production.