Look first, generate second: how to stop spending time on rebuilds
An evening goes on working out what you wanted: you phrase a description, wait, look, redo it. The problem is not the generation but deciding blind. Below is a different order, and a technique that changes the client conversation before the work starts.
An evening goes on working out what you wanted: you phrase a description, wait, look, redo it. The problem is not the generation but deciding blind. Below is a different order, and a technique that changes the client conversation before the work starts.
---
Three hours on something that turned out wrong
A typical evening for somebody building a website with AI.
You phrase a request. You wait. You look — wrong. You rephrase. You wait. Closer now, but the background is off and the animation is irritating. You redo it a third time.
By the end of the evening you have four versions, none entirely satisfactory, and you cannot remember what was in the first one, which was actually all right.
You spent three hours working out what you wanted. In itself that is normal — any search works that way. What is not normal is that every iteration here costs waiting time and generation money.
There is a different order, and it changes the economics of the work.
The problem is not generation but choosing blind
Let us go through exactly what happens.
You make the decision before seeing the result. You phrase the description in words — "a modern minimalist landing page with smooth animations" — and only after generation do you learn what the model meant by that.
And "minimalist" can mean any of a dozen directions to it. So can "smooth animations".
Words describe style badly. That is not your phrasing problem, it is a property of language: the visual comes through text approximately, and the spread of interpretations is enormous.
Showing an example is easy. Describing one is nearly impossible. Hence the right order.
The right order
Look first. Take second. Adapt third.
Not "thought of it — generated it — judged it" but "saw it — chose it — adapted it".
The difference is where the moment of decision sits. In the first scheme you decide blind and verify expensively. In the second you decide while looking at a result, and there is nothing to verify.
What that gives you practically:
The iterations are free. Scrolling twenty previews is minutes rather than hours of waiting.
The decision is grounded. You chose what you saw rather than what you imagined.
There is something to show a client before the work starts. That is a separate value, and we will come back to it.
How this works in the catalogue
The website templates section holds 343 prompts, and every one has a preview. You see the finished result — how it looks, how the animation behaves, what happens on scroll.
The catalogue is arranged for searching by task:
Websites — 240 of them: hero sections — 80, landing pages — 61, SaaS — 33, agencies — 10, portfolios — 8, shop windows — 8, plus creative, AI, 3D, fintech, automotive, presentations, travel, Web3.
Sections — 80 standalone blocks: pricing, testimonials, footer, log-in form, call to action, about.
Backgrounds — 23 animated ones for your own content.
The order of work: open the category you need, scroll the previews, take a suitable one, copy the prompt, paste it into your environment, adapt it to the task.
The prompts are written for a standard stack and are not tied to a service — they paste into any environment that can write code.
What to look at in a preview
Not "do I like it". Four specific things, and they filter faster.
The structure against your task. A launch landing page needs one order of blocks, a shop window another. Something attractive with the wrong structure will have to be rebuilt — which is exactly what you are avoiding.
Content density. How much text fits. A template designed for short headlines will fall apart under your three paragraphs.
Animation behaviour. Look not at the first screen but at what happens on scroll. Animation is most often what turns out to be irritating a day later.
How it will look on a phone. Half the visitors will come from there.
What you do not need to look at: colours and fonts. Those are the easiest things to change, and choosing by them is the most frequent mistake.
What to do after choosing
Three rules, so you do not return to rebuilds from another direction.
Change the content without touching the structure. Copy, images, names — yes. The order of blocks and the stylistic decisions — only if genuinely necessary.
Change style coherently. Changed the accent colour — check the contrast where text sits on it. Isolated changes break a system the prompt has already built.
Make changes by address. Not "make it better" but "in the pricing section change the order of the columns, do not touch anything else". Plus a line about what must not change.
The last matters particularly. Most problems arise not on the first build but on the third revision, when every change breaks the previous one.
Previews as a sales tool
Here is what makes this worth learning even if you do not build websites yourself.
A client cannot picture things from a description. You say "we'll make a modern landing page with the emphasis on the first screen" — they nod, and in their head is something of their own. The mismatch surfaces at delivery.
Showing previews before the work starts removes that entirely. You open three or four options and ask: "which is closest?" The client points, and you know exactly what to do.
What that gives you:
Agreement before the work rather than after. The rounds of revisions shrink several times over.
The conversation goes from abstract to concrete — and with it the discussion of timescales and price.
You look like somebody with ready solutions rather than somebody who will experiment at the client's expense.
A practical technique. Going into a first conversation, pick three previews for the client's type of business. That is twenty minutes of preparation and it changes the whole conversation: you arrive not with an offer of services but with options.
What this changes in the economics
Time. An evening of groping becomes twenty minutes of choosing.
Spend. Generations in a development environment cost money and waiting time. Twenty previews scrolled cost nothing.
Rounds of revisions. What was agreed before the start does not get redone after.
The price range for comparison. By my scrape of 848 listings: a multi-page website — $245–730, against a $30–75 median for one-off work. A caveat: the scraper has no separate "development" category, so the ranges are a guide.
At that fee, an evening saved and two rounds of revisions is a noticeable part of your actual profit.
What is available on the platform
Website templates — 343 prompts with previews. Around 10 000 characters each on average, the most detailed up to 75 000: structure, typography, colours, how animation behaves on hover and scroll.
The Plus plan.
Skills for Claude Code — more than 10 000. The catalogue and descriptions are open to everyone, the files come with Basic, advanced ones with Creator+.
The creative assistants — an art director, a web designer, a UX designer. They will help choose for a task and explain to a client why that option. From Basic.
Registration is free and opens three days of full Basic access. The catalogues and previews are open to guests anyway — you can see what exists before registering at all.
Where to start today
One action. Open the catalogue and spend twenty minutes not generating but looking.
Scroll the category closest to your work and mark three options. Not to use — to understand what exists.
After that your next client conversation goes differently: you will be showing rather than describing in words.
---
The same principle in other sections
"Look first" is not only about website templates.
In Gen AI the price of a particular model is visible before you press. You compare two options on cost rather than finding out after the charge.
In AI Workflow the quote for the whole run gets calculated before launch, along with your remaining balance. Money for steps not completed returns automatically.
In Marketing Studio the quote gets shown before the pipeline starts.
What they share. The decision gets made on a visible result or a known price rather than blind with verification after the fact.
And the same in the automations archive: the descriptions of every template are open before downloading. You can see what a flow does, which services it reaches and which credentials it will ask for — before you spent time importing it.
---
What to read next
[A 30 000-character brief](/en/blog/prompt-30000-characters) — what stands behind a preview.
[A specialist's portfolio site](/en/blog/specialist-portfolio-site) — where this gets used most often.
[What of this actually sells](/en/blog/what-sells-from-vibecoding) — eight formats and their previews.
[A landing page per segment](/en/blog/landing-per-segment) — how to show options to a client.
[Skills for Claude Code](/en/blog/claude-code-skills-guide) — the full guide to skills.