forge
SolidBuilding rapid prototypes for frontend (UI components/pages) and backend (API mocks, simple servers). Use to validate new features or turn ideas into working demos. Working software over perfection.
Install
Quality Score: 85/100
Skill Content
Details
- Author
- simota
- Repository
- simota/agent-skills
- Created
- 7 months ago
- Last Updated
- today
- Language
- HTML
- License
- MIT
Integrates with
Similar Skills
Semantically similar based on skill content — not just same category
prototype
Build production-feel HTML prototypes for sales demos and reviews. Runs a discovery Q&A, scaffolds a zero-dep static site (HTML + Tailwind CDN + theme/layout switchers + URL-state + feedback overlay + control bar) and runs a design-quality loop. Use when the user says "prototype", "mockup", "demo", "pitch page", "sales demo", "click-through", or describes a UI they want to show someone without building the real thing. Also handles /prototype variant "<vibe>" (fork a variant) and /prototype apply-feedback <file> (apply pinned feedback JSON).
06-core-prototype-ui-live-in-the-real-site-with-mock-data
CORE — never delete. HARD MANDATE: this is THE default way to prototype/mock/show ANY UI or UX idea. Trigger the moment a task is 'mock this up', 'show me how X would look', 'design a screen', 'what if the layout was…', 'make me a bento', or any look-and-feel iteration. NEVER build a throwaway HTML file, a separate standalone app, or reach for v0/Lovable/bolt/Figma — those lose fidelity and get thrown away. Instead scaffold the screen INSIDE the real running app using its existing shared components + theme tokens, feed it MOCK DATA behind a flag so it renders instantly with no DB/auth, run it locally, and show the user via the chrome-devtools MCP (Chrome) so they can iterate by voice ('smaller', 'move that', 'make it a bento') against the actual site. The prototype IS the product — zero translation step at the end.
web-artifacts
Turns any idea into a live single-file HTML prototype in minutes — inline CSS/JS, CDN-only dependencies (cdnjs), mobile-first, seeded with believable fake data, interactive states wired — ready to open in a browser or paste as a Claude artifact. Use when the user says "prototype this", "show me a working demo", "make this idea clickable", "can we test this flow before building it", or needs to feel an interaction instead of reading a spec.