03 — Plan Before You Code — From Vibe Coding to Vibe Planning

I kept skipping the plan precisely because the AI made starting so cheap — type a prompt, get a screen, get fooled. The idea that the rest hangs off: cheap starts hide expensive middles. When I can produce a working-looking thing in an hour, the temptation is to skip the plan and let the tool find the shape. By hour ten the codebase is a tangle of contradictory decisions the AI made for me, and unwinding them costs more than the plan would have.

The framing that landed: vibe coding without vibe planning is just faster chaos. The discipline isn't "don't use AI early." It's "use AI to plan first, then to build."

Define the MVP before the first prompt

The single most useful act before any code is written is writing down what the minimum viable product actually is — the smallest version of the idea that delivers its core value, and just that. The roadmap's phrasing: _define your MVP and break the project into phases. Don't try to build everything at once; work step by step_ [1].

The reason this matters more with AI than without: the AI will happily build everything at once if I let it. A vague prompt like "build me a habit tracker" comes back with auth, social sharing, streaks, badges, push notifications, and a dashboard — none of which I needed for the MVP, all of which now have to be maintained, tested, and debugged. The AI doesn't filter for "is this in scope." That filter is my job, and it only works if the scope exists on paper before the first prompt.

The MVP isn't a smaller version of the dream. It's the smallest thing that proves the idea. Everything else is a later phase, built on a foundation that already works.

Use AI to plan, then to build

The part that surprised me: the AI is also the best planning tool I have. The roadmap points at this directly — _you can even use AI itself to help you plan. Tell it your idea, let it help you refine it, and break it into phases_ [1]. I used to think of planning as the human part and coding as the AI part. In practice the AI is genuinely useful at interrogating a vague idea, surfacing decisions I hadn't considered, and proposing a phased breakdown.

A planning prompt looks different from a build prompt. Instead of "build X," it's something like:

I want to build [idea]. Before any code:
- What's the smallest MVP that proves this?
- What are the risky/unknown parts I should prototype first?
- Break the rest into phases, ordered by dependency.
- What decisions do I need to make before phase 1?

The output isn't a spec I accept wholesale — it's a draft I edit. But it surfaces the decisions far faster than staring at a blank page, and the act of editing it forces me to commit to a scope before any code exists [2].

Examples are the planning material

The roadmap names one more ingredient that I underestimated: give the AI examples — mockups, screenshots, code samples — so it understands what I want [1]. In a planning context this means: don't describe the goal in words alone. Paste a sketch, link a similar app, drop in the one component I want to copy. The AI's prior on "what good looks like" is vastly tighter when it has a concrete example to anchor on. Vague verbal descriptions invite the model to fill in the gap with the most statistically common version of the thing — which is rarely mine.

The discipline I keep: before a build prompt, gather the artifacts. A screenshot of the layout, a link to the interaction I want, the existing component to match. The plan is the words; the examples are the picture; both together is what the AI actually needs.

How I use this

Before any greenfield session, I write a one-page plan: the MVP in one sentence, the phases in dependency order, the riskiest part called out, and the examples I'll attach. The AI helps me draft that page before it writes a line of code. Only when the page exists and I've edited it down do I start the build — phase by phase, each one shipped and tested before the next begins. The cost is thirty minutes up front. The savings show up every time I don't have to unwind a tangle the AI built because I never told it where to stop.

References

[1] roadmap.sh, "Plan before you Code," 2026. [Online]. Available: https://roadmap.sh/vibe-coding/plan-before-you-code

[2] Tessl, "From vibe coding to vibe planning," 2026. [Online]. Available: https://tessl.io/blog/from-vibe-coding-to-vibe-planning/