See it before you build it

Today Julia started her first real build, the restaurant menu, and the first lesson had nothing to do with code.

Step one: amputate

Her notes were thorough: features, details, edge cases. Too thorough. The instruction: pick the one main thing, build only that, add the rest later ▸ 3:59. Detail written before direction is inventory you’ll probably throw away.

Step two: look at it before it exists

Then, before any code: generate images of the app. GPT-4o sketched screens; they came out ugly; we fed the idea through Google AI Studio to explore the flow in detail, then back to image generation, and suddenly the screens looked right ▸ 4:28. Wireframing, but conversational, minutes per iteration.

“Es muy importante visualizar las cosas. Cuando uno ya está viendo cómo va a ser, uno ya sabe qué hacer.” When you’re already seeing how it will look, you already know what to do. ▸ 5:26

míralo antes de construirlo →

Why this is the remedy

Entry 2-2 diagnosed the disease: the AI does what you say, and what’s in your head is less complete than it feels. You can’t fix that by thinking harder; the gaps in a mental image are invisible from inside. But render the idea as actual images and the gaps become visible on screen, where they’re cheap to fix. Visualization converts “I’ll know it when I see it” from a client’s curse into a build step.

The full loop, named: see it (images), spec it (now you know what to say), build it (the translator takes over), straighten the sapling early. Every step got cheaper this year except the first one going skipped…