Back/Engineering/Cursor/v0
IntermediateEngineeringCursorv0Devin

How to Build and Ship a UI Feature in Under an Hour with v0 and Devin

Learn Gumroad CEO Sahil Lavingia's process for rapidly prototyping a UI with v0, then using the AI agent Devin to autonomously code, implement, and submit the feature for review, turning a multi-day task into a one-hour workflow.

From How I AI

How I AI: Gumroad CEO Sahil Lavingia’s Workflow for Building Features 40x Faster

with Claire Vo

How to Build and Ship a UI Feature in Under an Hour with v0 and Devin

Tools Used

Cursor

AI-first code editor

v0

Vercel AI UI generator

Devin

AI software engineer by Cognition Labs

Step-by-Step Guide

1

Identify a UX Problem

Start by identifying a small but annoying user experience issue in your product. For example, Sahil Lavingia targeted a clunky, native browser date picker in an internal tool.

2

Prototype and Iterate with v0

Use a generative UI tool like v0.dev to create an interactive prototype from text prompts. Iterate on your prompts to refine the design and functionality in real-time, brainstorming with the AI to discover what you really want. Aim for a descriptive prompt that captures the full user experience.

Prompt:
build a really dope natural language day picker for an HR product onboarding form
Pro Tip: Don't try to get the prompt perfect on the first try. Use the tool to explore different ideas, adding features like natural language input as you refine your vision.
3

Hand Off the Prompt to Devin

Once you're happy with the v0 prototype, take your final, refined prompt and give it directly to an AI software engineer like Devin. Specify the repository and the exact page or component that needs to be updated.

4

Monitor Devin's Autonomous Work

Observe as the AI agent sets up the development environment, identifies the relevant files, installs necessary dependencies (like shadcn/ui), writes the new code, and replaces the old component. The process is typically recorded, allowing you to review its steps.

5

Review and Merge the Pull Request

Within minutes, the AI agent will create a pull request on GitHub with the completed feature. Conduct a human review of the generated code. If any minor tweaks are needed, use an AI-native editor like Cursor or Devin's pairing mode to make final adjustments before merging.

Become a 10x PM.
For just $5 / month.

We've made ChatPRD affordable so everyone from engineers to founders to Chief Product Officers can benefit from an AI PM.