Guide

From Validated Spec to a v0 Build

Turn a validated ShipFit playbook into a v0 build: feed Vercel v0 your buyer, V1 scope, and brand voice so it generates the right UI instead of a generic dashboard.

To turn a ShipFit playbook into a v0 build, export your validated decisions as a v0 prompt, paste it into Vercel v0, and generate screens against your validated buyer, V1 scope, and brand voice. v0 then produces UI for the product you validated instead of the generic dashboard it would otherwise default to.

Before you start

You need a finished playbook. Run the full 9-decision flow first (a Quick Take takes about 2 minutes, the full playbook 15 to 20 minutes). The export only works once the prior 8 decisions are locked, because that is what fills the prompt with real content: your buyer, your above-the-line pains, your V1 cut, and your brand voice.

You also need a v0 account. v0 generates React and Tailwind UI from prompts, so this guide is about the interface layer. Pair it with a full-stack builder or your own backend for the rest.

Step by step

  1. Finish the playbook and reach the export step. The export is the last of the 9 decisions. Pick v0 as a target (you can pick more than one tool at once). ShipFit packages your validated decisions into a prompt written for v0’s UI generation.

  2. Open a new v0 chat. Start clean so the first generation is shaped by your validated scope, not by a sample layout v0 picked on its own.

  3. Paste the export as your first prompt. It frames who the product is for, the V1 screens that matter, and the brand voice and copy guidelines. v0 generates components against that frame instead of a generic admin shell with every widget it assumes a SaaS app needs.

  4. Generate one screen at a time. v0 works best focused. Ask for the core screen tied to your top above-the-line pain first, then move outward. Because the prompt already carries your V1 cut, you can lean on it: “build the screen for [validated buyer] to do [V1 job],” and the result should reflect your scope.

  5. Check the UI against the scope. If v0 starts adding settings tabs, notification panels, or admin views that were cut from V1, restate the scope from the prompt. The MVP scope decision should survive into the UI instead of dying in a doc.

  6. Export the code. v0 hands you React and Tailwind components. Drop them into your project and wire them to your backend, or hand them to a full-stack builder. The validated copy and brand voice carry through with the markup.

Keeping it in sync

Re-run the export after any meaningful pivot, e.g. a new buyer segment or a reframed core job. Use the refreshed prompt for new screens so the UI tracks your current validated state. A stale prompt is worse than none, because v0 will confidently style screens around decisions you have already abandoned.

For the product-side detail on what the export contains and how v0 consumes it, see the v0 integration page. This guide is the how-to; that page is the what-and-why.

Common mistakes

  • Prompting v0 with a vague idea. A casual prompt gets you a polished but generic dashboard. The export is what ties the UI to your validated buyer, V1 job, and brand voice.

  • Generating the whole app in one shot. v0 is sharpest one screen at a time. Start with the screen tied to your top pain, then expand, keeping the scope from the prompt in view.

  • Letting v0 reintroduce cut features. If the UI sprouts settings and admin views that V1 did not include, restate the scope. The cut list is part of the validated spec for a reason.

  • Treating v0 as the validator. v0 generates UI; it does not validate. The validation happens upstream in the playbook, where roughly 1 in 4 ideas gets killed before it reaches a builder. If you have not done that work, see pricing to start (the free tier includes 3 credits a month, paid playbooks from $5).

Ready to make your next product a success?

9 decisions between your idea and a product worth building.

No credit card required.

Try an example: