Prototype Feedback Loop Workflow
Rapidly iterate on prototypes using AI-powered building and automated feedback collection.
Quick Start
- Share a prototype link (v0/Lovable/Bolt) or describe what you built
- I check the related PRD, design system, and user research for context
- I run a structured feedback analysis (PRD alignment, usability, multi-perspective)
- I deliver prioritized recommendations: must-fix, should-fix, and nice-to-have
- You iterate on the prototype and we repeat until validated
Example: "Review my checkout prototype: [link]. PRD is in thoughts/shared/pm/prds/checkout-redesign.md"
Output: Saved to thoughts/shared/product/prototypes/[feature]-feedback-round-[N].md
Time: 30 minutes per feedback round
Context Routing
Check these files before providing feedback:
| Source | Files/Folders | What to Extract | | -------------------- | --------------------------------------------------- | -------------------------------------------------- | | PRD | thoughts/shared/pm/prds/ | Requirements, acceptance criteria, success metrics | | Design System | design docs | Colors, typography, component patterns to match | | Stakeholder Profiles | thoughts/shared/pm/context/stakeholder-template.md | Who reviews this, their priorities and concerns | | User Research | thoughts/shared/pm/ | User pain points, quotes, behavior patterns | | Past Prototypes | thoughts/shared/product/prototypes/ | Previous feedback rounds, resolved issues |
Overview
Tools: v0/Lovable/Bolt + NotebookLM + Claude When: Validating new features before full build
Feedback Analysis Template
Use this structure for every feedback round:
PRD Alignment Check
| PRD Requirement | Prototype Status | Gap? | | --------------- | ------------------------------- | -------------------- | | [Requirement 1] | Implemented / Partial / Missing | [Description if gap] | | [Requirement 2] | Implemented / Partial / Missing | [Description if gap] | | [Requirement 3] | Implemented / Partial / Missing | [Description if gap] |
Usability Assessment
| Heuristic | Rating (1-5) | Issues | Recommendation | | ----------------------------------- | ------------ | ------ | -------------- | | Visibility of system status | | | | | Match between system and real world | | | | | User control and freedom | | | | | Consistency and standards | | | | | Error prevention | | | | | Recognition over recall | | | | | Flexibility and efficiency | | | | | Aesthetic and minimal design | | | |
Multi-Perspective Feedback
Engineering view: [Technical feasibility, performance concerns, implementation complexity, tech debt risks]
Design view: [Visual consistency, interaction patterns, accessibility gaps, design system alignment]
User view: [Ease of use, value clarity, friction points, learning curve, "would they actually use this?"]
Tool-Specific Feedback Adjustments
Adjust feedback focus based on which tool generated the prototype:
v0.dev prototypes (single components):
- Focus on: Component behavior, interaction states, visual polish, responsive behavior
- De-emphasize: Navigation flow, multi-page consistency, backend integration (v0 is component-level)
- Ask: "Does this component work in isolation? How will it integrate with the existing UI?"
Lovable/Bolt.new prototypes (full-stack apps):
- Focus on: End-to-end user flow, page-to-page navigation, data persistence, error handling
- De-emphasize: Pixel-perfect styling (these tools prioritize function over form)
- Ask: "Does the full flow work? Are there dead ends or missing states?"
Claude Artifacts (quick mockups):
- Focus on: Conceptual accuracy, layout structure, content hierarchy
- De-emphasize: Visual fidelity, interaction details (Artifacts are low-fidelity by nature)
- Ask: "Does this capture the right concept? Is the information architecture correct?"
design prototypes (designer-created):
- Focus on: Design system compliance, accessibility, edge case handling, micro-interactions
- De-emphasize: Technical feasibility (that's the engineer's feedback domain)
- Ask: "Is this usable? Does it handle real-world scenarios beyond the happy path?"
ASCII/napkin sketches (from /napkin-sketch):
- Focus on: Layout logic, information hierarchy, flow completeness
- De-emphasize: Everything visual (it's ASCII art, not a design comp)
- Ask: "Is the structure right? Are we missing any screens or states?"
Prioritized Recommendations
| # | Issue | Severity | Fix | Iteration | | --- | ---------------------- | -------- | -------------- | --------- | | 1 | [Must-fix before beta] | Critical | [Specific fix] | Current | | 2 | [Should-fix before GA] | Medium | [Specific fix] | Next | | 3 | [Nice-to-have polish] | Low | [Specific fix] | Later |
Workflow
Step 1: Build Initial Prototype
Using v0 (for UI components):
# Go to v0.dev
# Paste your feature description:
"Build a task management interface with:
- List view of tasks with checkboxes
- Ability to add new tasks
- Filter by status (all/active/completed)
- Clean, modern design similar to Linear
Include:
- Search functionality
- Due date display
- Priority labels (high/medium/low)"v0 generates:
- React component
- Fully functional prototype
- Copy-paste ready code
Using Lovable (for full-stack apps):
# Go to lovable.dev
# Describe full feature:
"Build a customer feedback submission portal:
- Public form for submitting feedback
- Backend to store submissions
- Admin dashboard to review
- Email notifications on new submissions"Lovable generates:
- Frontend + backend
- Database schema
- Working prototype with real functionality
Using Bolt (middle ground):
- Good for interactive prototypes
- Handles forms, validation, multi-step flows
- Between v0 (UI only) and Lovable (full stack)
Pro tip: Start with PRD from your PRD workflow, paste into AI builder, get 80% done automatically.
Step 2: Refine Prototype (30-60 min)
Iterate with AI:
"Make these changes:
1. Move the search bar to the top right
2. Add bulk actions (select multiple, mark complete)
3. Make priority labels more prominent
4. Add keyboard shortcuts (enter to add task, / for search)"AI updates code in real-time. Test changes immediately.
Polish details:
- [ ] Error states (what happens when something fails?)
- [ ] Empty states (what shows when no data?)
- [ ] Loading states (what shows while loading?)
- [ ] Mobile responsive (does it work on phone?)
Step 3: Collect User Feedback (1 day)
Deploy prototype:
- v0: Export to CodeSandbox or Netlify
- Lovable: One-click deploy
- Bolt: Deploy to their hosting
Share with users:
Email template:
Subject: Quick feedback needed on [Feature] prototype
Hi [Name],
We're exploring [feature] and would love 15 minutes of your time to get feedback on a prototype.
Try it here: [link]
Then book time: [calendly link]
Or just reply with your thoughts!
Thanks,
[You]Interview script:
1. Don't explain anything. Just share link.
2. Watch them try to use it (screen share).
3. Ask: "What do you think this does?"
4. Ask: "Try to [accomplish task]. Think out loud."
5. Note: Where do they