The seven levels of designing a website with AI

Almost everyone who opens an AI tool and asks it to "design a homepage for my brand" gets the same thing back. A centred hero. A gradient nobody chose. Three feature cards with rounded corners. A call-to-action button in a colour that means nothing. It is competent, it is instant, and it looks exactly like the ten thousand other pages produced the same way. The natural conclusion is that AI has no taste.

That conclusion is wrong, and getting it wrong is expensive, because it makes people stop climbing. The model is not lacking taste. It is lacking direction. When you say almost nothing, it gives you the statistical average of every website it has ever seen, and the average website is forgettable. The skill of designing with AI is not finding a better tool. It is learning to articulate, in steadily sharper terms, what you actually want. That skill has levels, and this is the ladder we climb on every site we build.

Why does AI design look so generic by default?

A model trained on the whole web has seen the best sites ever made and the worst, in roughly the proportions they exist. The worst, and the merely fine, vastly outnumber the great. So when your prompt gives it almost nothing to go on, it regresses to the mean. It reaches for the safest, most common pattern, because that is the answer most likely to be "correct" for a vague request. Vague in, average out.

This is the single idea that unlocks everything that follows. The model already contains the capability to produce extraordinary work, it has studied extraordinary work in detail, but it will only reach for that capability when your direction forces it to. Every level on this ladder is a more precise way of pointing. You are not teaching the model taste it does not have. You are removing the ambiguity that lets it hide in the average.

“

A model trained on the whole web has seen the best sites ever made and the worst, in roughly the proportions they exist.

The ladder at a glance

The seven levels run from the floor that everyone starts on to the frontier that almost nobody reaches. You do not need to live at level seven to win. Most beautiful, high-converting sites are built somewhere around levels four and five. But knowing the whole ladder tells you where you are, why your output looks the way it does, and what the next rung would change.

Level 1: Plain prompting

The floor. You describe the page in plain words and accept whatever the model returns. "Build me a landing page for a skincare brand." It works, it is fast, and it is where the generic-output problem lives, because a short prompt is an invitation for the model to give you the average of everything.

There is nothing wrong with level one as a starting point. The mistake is staying there and blaming the tool for the result. If your only experience of designing with AI is typing one sentence and judging the output, you have not tested the model. You have tested your prompt. Almost everyone who says "AI design is soulless" never left this level.

Level 2: Design direction

The first real climb. Instead of a sentence, you hand the model a brief. Who is this brand, what does it feel like, what is the type doing, what is the spacing rhythm, what are the two or three colours that matter and what does each one mean. You give it constraints, and constraints are what turn a generic generator into a focused one.

This is the level where most of the gain is hiding, and most people skip it. A model with a clear design language behaves like a junior designer who has read your brand guidelines. A model without one behaves like a stranger guessing. The work of level two is the work of knowing your own brand well enough to describe it, which is why it pays off far beyond the website.

Level 3: Visual references

Words have limits. You can describe "premium and minimal" a hundred ways and still get something that misses, because those words mean different things to you and to the model. So you stop telling and start showing. You feed it screenshots of sites whose design you admire and ask it to learn the structure, the restraint, the way space is used, not to copy the content.

This is a step change, because a single good reference carries more direction than a paragraph of adjectives. The model can see the proportion of the hero, the size jump between headline and body, the discipline of a tight colour palette. Show it three references that share a sensibility and you have communicated a taste you could never have typed. The skill here is curation: knowing which sites are actually good, which is itself something you build by looking at a lot of them.

Level 4: Deconstructing the greats

References show the model what good looks like. Deconstruction shows it how good is built. At this level you stop treating elite sites as inspiration and start treating them as documentation. You study how a site you admire is actually assembled, its layout system, its spacing scale, the way it handles motion and state, and you have the model rebuild those patterns inside your own brand.

This is where output stops looking AI-made and starts looking designed, because you are no longer borrowing surface style, you are borrowing engineering decisions that great teams spent months making. It is also where your own eye sharpens fastest. You cannot deconstruct a site without learning why it works, and that vocabulary feeds straight back into levels two and three. The ladder is a loop: climbing it makes you better at the rungs below.

Level 5: Custom components and original assets

By level five the page is well-structured and on-brand, but it is still built from parts the model would reach for on its own. This level is where you add the things it would never invent: a bespoke section that does something specific to your product, original photography or illustration, custom iconography, a short looping video behind the hero, motion that responds to the visitor.

These are the elements that make a site feel like it belongs to one brand and no other. AI is an extraordinary accelerator here, generating imagery, drafting animation, scaffolding interactive components, but the direction has to be yours, because a custom asset is custom precisely because it is not the default. This is the level where most genuinely memorable commercial sites live. It is ambitious without being exotic, and the payoff in how the brand is perceived is large.

Level 6: Visual tools in the loop

Code is precise but slow to judge by eye. So at level six you bring a visual surface into the loop. You generate and iterate on a layout in a visual design environment, moving things, trying directions, reacting to what you see, then push the resolved design back into real, production code. You get the speed of visual iteration and the fidelity of hand-built output, instead of choosing one.

This level is about workflow, not just output. It acknowledges that some decisions are made faster with your eyes than your words, and that the fastest path is a loop between the two: describe, see, adjust, commit. It is also where a brand can move quickly without losing consistency, because the visual exploration is bounded by the design direction set back at level two.

Level 7: Immersive 3D and WebGL

The frontier, and the rarest. Real-time 3D, custom shaders, scroll-driven scenes, the kind of work that makes a visitor stop and wonder how a website is even doing that. This is the territory of award-winning product launches and flagship brand sites, and it is genuinely hard, which is exactly why it stands out.

AI has pulled this level dramatically closer than it was. Work that needed a specialist studio and a long timeline can now be scaffolded, explored and refined with a fraction of the effort. It is still not push-button, and it is overkill for most pages, but it is no longer out of reach for an ambitious brand with clear direction. The point of naming it is not that you must build here. It is that the ceiling is far higher than the generic output at level one ever suggested.

What does this ladder actually mean for a brand?

The practical lesson is that the quality of AI-designed work is mostly a function of the person directing it, not the tool. Two brands using the identical model will get wildly different results, and the difference is entirely in how well each one can say what good looks like. That is good news, because direction is a skill you can build, and a moat your competitors mostly are not building.

It also reframes what you are paying for when you work with people who do this well. You are not paying for access to a tool that anyone can open. You are paying for the climbed ladder: the design vocabulary, the reference library, the deconstructed patterns, the judgement about which custom asset earns its place. The model is the same for everyone. The direction is not.