From “I wish this existed” to a working app, in a single sitting.

Overview

Take a tool idea from concept to deployed application using the full workflow: spec first, prototype fast, polish with Claude Code.

Draws from: Modules 01, 02, 03, 07 Time estimate: 4-6 hours Difficulty: Medium-high Prerequisites: A clear idea for a tool you actually want

Step-by-Step

Phase 1: Define and Spec (45-60 min)

1. Pick your tool idea. Realistic options for a day project:
   • Personal CRM (track clients, interactions, follow-ups)
   • Bookkeeping helper (categorize expenses, generate reports)
   • Project time tracker (log hours, calculate rates, invoice prep)
   • Content calendar (plan, draft, schedule posts)
   • Knowledge base (save, tag, and search notes and resources)
2. Write the spec using the Module 03 template
3. Keep scope tight: 3-5 core features max. Everything else goes in “Out of Scope / Future”
4. Define the data model (use Module 07 thinking)

Phase 2: Rapid Prototype (60 min)

1. Use a Tier 3 builder (Bolt.new or Replit Agent)
2. Feed it your spec: “Build this application: [paste spec summary]”
3. In ~30 minutes, you should have a working prototype
4. Click through it. Does the concept work? Is the UX reasonable?
5. Note what’s good and what needs to change — this prototype is a reference, not the final product

Phase 3: Build for Real (120-180 min)

1. Set up a fresh project with a CLAUDE.md
2. Use Claude Code with your spec: “Implement the spec in specs/[tool].md”
3. Work in chunks: database layer first, then API, then UI
4. Use subagents for testing and documentation as you go
5. Monitor context — start new sessions at natural boundaries

Phase 4: Deploy (30 min)

Choose your deployment:

• Vercel/Netlify: Best for static sites and serverless functions. Free tier.
• Replit: One-click deploy with hosting included.
• Your own VPS: Maximum control, requires server management.
• Local only: If the tool is just for you, running locally is fine.

What Success Looks Like

• A deployed, functional tool that you actually use
• Experience with the full vibe coding lifecycle: spec → prototype → build → deploy
• A concrete understanding of where spec-driven development saves time

Stretch Goals

• Add MCP integration so Claude can interact with your tool’s data in future conversations
• Build an n8n workflow that triggers based on your tool’s events
• Add authentication if you want to share the tool with others

Previous: Project D: Build an n8n Workflow | Back to Project Lab