Aakash GuptaWe prototyped 5 features in 84 mins (Bolt, Cursor, Lovable, Replit, v0)
CHAPTERS
- 0:00 – 0:35
Why AI prototyping matters: faster solution testing cycles
Colin frames AI prototyping as a way to compress idea-to-customer-feedback loops from months into hours or days. Aakash sets up the episode as a live “cooking session” to build something real-time.
- •AI prototyping aims to accelerate experimentation and validation
- •Goal is testing ideas with customers in-product, not just static mockups
- •Expectation shift: hours/days instead of months for early validation
- 0:35 – 2:28
Bolt build kickoff: paid booking links concept and screenshot-based cloning
Aakash proposes a paid booking links feature for Apollo-like scheduling. Colin starts from scratch in Bolt, using screenshots of the existing UI to anchor styling and layout.
- •Feature requirements: admin sets price; booker pays during scheduling
- •Using screenshots as design context to match an existing product UI
- •Bolt as a web-based prototyping environment with configurable behaviors
- 2:28 – 4:36
Sponsor break (Gibson AI, Vanta)
Aakash delivers sponsor messages for Gibson AI and Vanta. The conversation then returns to building in Bolt.
- •Gibson AI: AI-assisted database design and API generation
- •Vanta: automated compliance across SOC2/ISO and vendor risk workflows
- •Transition back into the live prototype workflow
- 4:36 – 6:39
AI-generated PRD workflow: planning first, then building in phases
Colin demonstrates prompting Bolt to create a plan (which becomes a PRD) before writing code. He explains why a PRD file helps preserve context across long iterative chats.
- •Prompting for a plan produces a PRD-like artifact (workflows, phases, design system)
- •Custom instructions can force PRD-first behavior
- •PRD acts as durable context when chat memory degrades
- •Proceeding via phases reduces failures vs “build everything” prompts
- 6:39 – 9:32
Iteration tactics in Bolt: reflection, no-code previews, and file structure
Colin introduces “reflection” to compare output to the screenshot and improve fidelity before implementing. He also explains why asking for changes without code and keeping files modular helps control and maintainability.
- •Reflection: ask the model to critique and propose UI diffs before changing code
- •Ask for plans/no-code first to prevent large unwanted edits
- •Undo is coarse-grained, so tighter iterations are safer
- •Splitting into smaller files improves model context handling
- 9:32 – 14:36
Admin flow completion: edit page + price settings for meeting types
The prototype quickly reaches an Apollo-like admin UI with an edit flow. Colin adds a pricing toggle and price input, then verifies the price persists in the admin list view.
- •Implementing edit/detail view from screenshot context
- •Adding paid toggle and price input to meeting configuration
- •Validating state updates and admin list display
- •Speed comparison vs traditional Figma for non-experts
- 14:36 – 22:25
Preview & payment flow: adding time selection, debugging state across tabs
Colin builds the booking preview page, then tries to add time selection and payment info in one go. When pricing doesn’t appear, he models a debugging workflow and fixes the issue by opening preview in the same tab (state persistence).
- •Heuristics on request sizing: minimal page first, then enhancements
- •Example of doing “too much” leading to missing UI elements
- •Debugging approach: check assumptions, reproduce, inspect console as needed
- •Root cause: opening in a new tab lost state; fix via same-tab navigation or localStorage
- 22:25 – 24:07
From prototype to learning: analytics, user testing, and when to use AI prototyping
They discuss how code-based prototypes can integrate analytics (Mixpanel/PostHog) and support richer usability testing. Colin explains when AI prototyping replaces Figma and why it’s especially valuable for AI product experiences.
- •Code prototypes can be instrumented with analytics and session replay
- •Best feedback still comes from watching users interact
- •AI prototyping as a Figma replacement for many PM workflows
- •Needed for prototyping AI/LLM experiences that Figma can’t simulate well
- 24:07 – 28:59
Tool landscape & pricing: chatbots vs web tools vs IDEs; databases and servers
Colin categorizes the space into chatbots, web-based builders (Bolt/Lovable/Replit/v0), and developer IDEs (Cursor/Windsurf). He explains when you need server/database support and why Replit is strongest for full-stack prototyping.
- •Three buckets: chatbot prototyping, web-based builders, IDEs for developers
- •Bolt pricing and token-based usage discussion
- •Client-only prototypes vs full-stack needs (auth, persistence)
- •Replit best for server+DB; others often rely on Supabase integrations
- 28:59 – 32:06
Communication over code: discovery workflow and opportunity solution trees
Colin argues prototypes are primarily communication tools, not production-ready handoffs. He connects rapid prototyping to better discovery via more customer conversations and maps it into the solutions/hypotheses layer of opportunity solution trees.
- •Prototypes improve communication with users and engineers vs long PRDs
- •Faster building should increase learning velocity, not feature shipping volume
- •Fit within OST: rapidly test solution hypotheses under opportunities
- •Clickable experiences elicit better feedback than documents
- 32:06 – 44:26
Cursor tutorial: exporting from Bolt, running locally, and adding an AI-sequence improvement
They move the project into Cursor, showing local setup and the Composer workflow. Colin prototypes an improved “Create sequence with AI” flow with questions upfront and social proof, including a real example of context mistakes and reverting.
- •Export code from Bolt → run locally in Cursor
- •Cursor strengths: model switching (e.g., o1), sharper bug-fixing, IDE control
- •Common failure mode: forgetting to pass file context; fix by resending with context
- •Revert/restore is often faster than debugging a bad context run
- •Result: multi-step intake questions + generated sequence + social proof UI
- 44:26 – 58:52
Lovable tutorial: Figma-to-prototype via Builder.io; element selection and minor UI fixes
Colin demonstrates converting designs to code through Builder.io into Lovable, noting screenshot-only conversions can be hit-or-miss. They discuss why layer metadata improves fidelity and show Lovable’s element selector for targeted cleanup.
- •Builder.io plugin converts Figma layers/metadata → Lovable project
- •Screenshot-only conversion works sometimes but is less reliable
- •Lovable can be slower on complex screens but closer to 1:1 designs
- •Element selection tool enables precise UI tweaks (e.g., remove stray div/artifact)
- •Tradeoff: Lovable hides code, making it friendlier but less transparent
- 58:52 – 1:11:29
Replit tutorial: agent vs assistant, adding database + auth, and deployment
They switch to Replit for full-stack capabilities, building a React to-do app, adding a database, then adding authentication with a simple prompt. Colin highlights agent autonomy (including risky changes) and shows how to deploy to a live URL.
- •Replit modes: Agent for big tasks; Assistant for smaller iterations
- •Database setup is integrated; agent can run SQL to validate data
- •Complexity increases failure risk (crashes, loops) but agent self-corrects
- •‘Add auth’ is fast, but agent actions can be destructive (e.g., dropped data)
- •Deploy flow: scale settings, approve and deploy, get a public URL
- 1:11:29 – 1:14:06
v0 tutorial and final takeaways: component marketplace + learning path
Colin positions v0 as similar to Bolt/Lovable, with Vercel deployment and a community library of reusable UI components. They close with recommendations on picking a primary tool, learning via Colin’s Maven course, and following ongoing tips on LinkedIn/Substack.
- •v0: fast UI generation, Vercel deploy, no built-in DB (needs third-party)
- •Community templates/components accelerate starting points
- •Advice: pick one tool and get fluent vs constantly switching
- •Where to learn: Maven course + ongoing content channels
