prototype

Build throwaway prototypes to validate state models or explore UI design variations.

Updated Jul 16, 2026
One-click install
npx skills add https://github.com/MaksymilianCzadowski/skills --skill prototype-maksymilianczadowski
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: prototype
Source: https://github.com/MaksymilianCzadowski/skills/tree/main/skills/engineering/prototype
Command: npx skills add https://github.com/MaksymilianCzadowski/skills --skill prototype-maksymilianczadowski

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Design questions about business logic or UI layout are hard to answer on paper. This Skill builds throwaway prototypes that let you push a state model through real cases in a terminal, or flip between radically different UI variants in the browser, so you can feel what works before committing to production code. ## Core Features & Use Cases - Logic Prototypes: Build a lightweight interactive TUI around a pure reducer, state machine, or function set to test edge cases in your state model by hand. - UI Prototypes: Generate 3-5 structurally different variants of a page on an existing route, switchable via a ?variant= URL param and a floating bottom bar with arrow-key navigation. - Clean Capture Workflow: Fold validated decisions into real code while preserving the full prototype on a throwaway branch as a primary source. - Use Case: You're unsure whether your state machine handles a specific edge case. The Skill builds a one-command terminal app where you press keys to dispatch actions and watch the full state re-render after each step, exposing the flaw in minutes. ## Quick Start Ask the AI to build a throwaway prototype that tests whether your state model handles a specific edge case, or to generate three UI variants of a page switchable via a URL parameter.

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 writing production code?▼

Build a small interactive terminal app around a pure reducer or state machine with no I/O. Each keystroke dispatches an action, and the full state re-renders after every step so you can push the model through edge cases by hand.

How to create multiple UI variants on one page for design review?▼

Render structurally different variant components on the same route, gated by a ?variant= URL search param. Add a floating bottom bar with arrow buttons and keyboard navigation so reviewers can cycle through variants and share specific ones by URL.

Should a prototype include tests and error handling?▼

No. A prototype that needs tests is no longer a prototype. Skip tests, persistence, and polish; the goal is to answer one design question fast, then rewrite the validated decision properly when folding it into production code.

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

Use a logic prototype when the question is whether a state model or data shape behaves correctly under real cases. Use a UI prototype when the question is what a page should look like, comparing several structurally different layouts.

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

Fold the validated decision into the real codebase, then commit the full prototype to a throwaway branch outside main as a primary source. Leave a pointer to that branch on the implementation issue so the context stays discoverable.