Look first, generate second: how to stop wasting time on redoing things
An evening goes on working out what you wanted: you phrase a description, wait, look, redo. The problem is not the generation but deciding blind. Below is a different order and a technique that changes the conversation with a client before the work starts.
An evening goes on working out what you wanted: you phrase a description, wait, look, redo. The problem is not the generation but deciding blind. Below is a different order and a technique that changes the conversation with a client before the work starts.
Three hours on something that turned out wrong
The typical evening of somebody assembling a site with a model.
You phrase the request. You wait. You look — not right. You rephrase. You wait. Closer now, but the background is wrong 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 seemed all right.
You spent three hours working out what you wanted. In itself that is normal — that is how any search works. What is not normal is that every iteration here costs waiting time and money for the generation.
There is another order, and it changes the economics of the work.
The problem is not generation but choosing blind
Let us look at what actually happens.
You make the decision before seeing the result. You phrase a description in words — "a modern minimalist landing page with smooth animations" — and only after generation find out what the model meant by it.
And "minimalist" can mean any of a dozen directions to it. "Smooth animations" too.
Words describe style badly. That is not your problem with phrasing, it is a property of language: the visual conveys approximately through text, and the spread of interpretations is enormous.
Showing an example is easy. Describing one is almost impossible. Hence the right order.
The right order
Look first. Then take. Then fit.
Not "thought it up — generated — assessed" but "saw it — chose — adapted".
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 the result, and there is nothing to verify.
What that gives in practice:
Iterations are free. Scrolling through 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 the client before the work starts. That is a separate value; we will come back to it.
How preview works in the catalogue
The site templates section has 343 prompts, and each has a preview. You see the finished result — how it looks, how the animation behaves, what happens on scroll.
The catalogue is sorted for searching by task:
Sites — 240: 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 individual blocks: pricing, testimonials, footer, login form, call to action, about the company.
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, fit it to the task.
The prompts are written for an ordinary 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 for your task. A launch landing page needs one order of blocks, a shop window another. Something handsome 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 the thing that becomes irritating within a day.
How it will look on a phone. Half the visitors will come from there.
What not to look at: colours and typefaces. Those are the easiest things to change, and choosing on them is the most common mistake.
What to do after choosing
Three rules, so you do not come back to redoing things from another direction.
Change the content without touching the structure. Texts, images, names — yes. The order of blocks and the stylistic decisions — only if genuinely necessary.
Change the style consistently. Changed the accent colour — check the contrast where text sits on it. Isolated corrections break a system the prompt has already built.
Correct 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 be changed.
The last matters especially. Most problems arise not at the first assembly but at the third correction, when every change breaks the previous one.
Previews as a sales tool
Here is why this is worth learning even if you do not assemble sites yourself.
A client cannot picture things from a description. You say "we will make a modern landing page with the emphasis on the first screen" — he nods, and in his head is something of his own. The discrepancy 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:
Agreement before the work rather than after. The rounds of revisions shrink several times over.
The conversation moves 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, select 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.
Spending. Generations in a development environment cost money and waiting time. Twenty previews scrolled cost nothing.
Rounds of revision. What was agreed before the start does not get redone after.
The order of prices for comparison. In our bot's feed of 5 986 jobs over four months: a multi-page site $245–730, against a median one-off job of around $60. A caveat: there is no separate "Development" category in the parser, so the ranges are a guide.
At that kind of fee, an evening saved and two rounds of revisions are a noticeable part of your real profit.
What the platform offers for preview
Site templates — 343 prompts with previews. Averaging around 10 000 characters each, the most detailed up to 75 000: structure, typography, colours, animation behaviour on hover and scroll.
Plus plan.
Skills for Claude Code — over 10 000. The catalogue and descriptions are open to everyone, the files come with Basic, advanced ones with Creator+.
The "Creative" category assistants — art director, web designer, UX designer. They help choose for a task and explain to the client why this option. From Basic.
Registration is free and opens three days of full Basic access. The catalogues and previews are open to guests meanwhile — 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 kind of work and mark three options. Not for a job — to understand what exists.
After that your next conversation with a client will go differently: you will be showing rather than describing.
The same principle in other sections
"Look first" is not only about site templates.
In Gen AI the price of a specific model is visible before you press. You compare two options by cost rather than finding out after the debit.
In Cerebrum the model's estimate, the cost of the move and the balance remaining are visible before launch. Money for generations not completed is returned to the balance automatically.
What they have in common. The decision is made on a visible result or a known price rather than blind with a check after the fact.
And the same in the automation templates catalogue: the descriptions of every template are open before downloading. You see what a scenario does, which services it calls and which credentials it will ask for, before you have spent time importing it.
Where this is built into the platform itself
The article's principle is built into the payment model of every generation section:
Gen AI — the price of a specific model is visible before you press the button. Top up from $5, debited on usage, no standing charge for idleness.
The AI SKILLS connector for Claude (Full plan) — paid steps are named with an estimate before launch, and money for anything not delivered returns to the balance automatically — if a generation did not complete, its cost comes back to the balance.
Cerebrum — the model's estimate, the cost of the move and the balance on one line. Nothing paid is launched without explicit agreement.
Drafts before the final. Inside the pipelines, generation runs first at low resolution — 480p — and only an approved frame goes to the expensive run.
Skills where the check comes before the spend
The article's principle is to look first. In the catalogue it is implemented three ways: stopping before launch, choosing a cheap model for the task, and tracking spend as you go.
- A Socratic dialogue before starting — it blocks generation until decisions on scope and constraints are closed. One question at a time, with a recommendation and a description of the alternative
- Comparing models by speed, price and quality — it runs the same request through several models and compares them by time, tokens and cost. A choice on data rather than on impressions
- Cost optimisation in a pipeline — it drops to a cheaper model as the budget approaches, skips optional steps, and on exhausting the limit stops and returns a partial result
- Real-time spend tracking — it counts what has been spent after every answer, accounting for cache separately, and warns as a threshold approaches
- Spend analysis by model — it breaks the spend down by model: you can see which costs more and where exactly the budget goes
The common principle in all of them. A cheap step before an expensive one. A question costs a fraction of a second, a low-quality draft costs cents, the final generation costs money and time. The order between them determines how much you spend in a month.
What to take on the platform for this task
- The “Site templates” section — 343 prompts with previews, Plus plan
- The “VIBE CODING” course — Creator plan; the lesson “Interface previsualisation: see the app before building it”
- Art director — assistant: visual strategy, branding, creative identity, Basic plan
- Web designer — assistant: UI/UX and web design with layout analysis, Basic plan
- UX designer — assistant: UX audit and user-journey design, Basic plan
What to read next
A 30 000 character prompt — what sits behind a preview.
A specialist's portfolio site — where this is applied most often.
What sells from what you assemble — eight formats and their previews.
A landing page per segment — how to show options to a client.
Skills for Claude Code — the full guide to skills.