How a project runs · Step 6 of 9

How does Marbl Codes design a page, and how many rounds does it take?

Two or three sections a round, hero first, each one built from the locked kit and checked against it before you see it. Three rounds on one section means we stop and ask a different question.

The mock is the first time you see your pages. It is built from the locked design system and shown a few sections at a time, with Richard driving. You never get a whole site in one reveal, because a whole site nobody has said yes to is the most expensive thing to change.

Why a few sections at a time?

Because the hero is where the direction is proven or not. It comes first, on its own. When the hero is right, the next two or three sections follow, and so on down the page. Each round is small enough to react to in minutes rather than needing a meeting.

Every section is composed from the kit’s parts and measured against the kit on the rendered page, not on the drawing, before it is shown. It also passes a design check, Serene [AI]’s eye on spacing, hierarchy and rhythm, before Richard sees it, and before you do. What reaches you has already been looked at twice.

Is the mock a picture or a page?

A page. It has an address, it opens in a browser, and it works on your phone. Where a picture of a design can hide how text wraps, how a menu behaves, or what a button does when you press it, a page cannot. What you see is what will ship, in the kit’s real sizes and colours.

The words are real too. We draft the copy as part of this step and you correct it. Placeholder text is not allowed, because it hides the most common design problem: a section that exists but has nothing to say.

What happens if a section is not working?

Round one, round two: tweaks, and it usually lands. Three rounds on the same section means we stop. Not a fourth attempt, a different question: is this a design problem, or is something underneath it wrong, the layout, the content, a decision that was never actually made? Most of the time it is the second, and the fix is a sentence, not another mock.

A fourth round on the same section is not an available answer. That rule is what keeps the step from turning into an afternoon of nudging things by a pixel.

When is the design locked?

When Richard says it looks right, with you where you care. From then on, a tweak is just that tweak. It does not reopen the page, the section, or the direction. The locked mock is what the build plan is written from, so the plan can be specific about what is being built and how long each part should take.

Questions at this step

What people ask us here

Yes, and you should. The mock is a real page at a real address, so open it on your phone before you open it on a laptop. Most of your visitors will meet the site that way, and a design that only works on a wide screen is not finished.

We draft them as part of this step, in your voice, from what you told us in discovery. You correct them. A mock full of placeholder text hides the real problem, which is usually that a section has nothing to say, so we write the words early and let them shape the layout.

The honest answer is that we go back to the moodboard. A different look is a different direction, and a direction is chosen in words before a design system is built from it. It costs more here than it would have there, which is why we ask so directly at the moodboard step.

Ready for step one?

No obligation, no jargon, no pressure

Tell us what you’re trying to do. We’ll tell you where to start.

Start a project

We plant trees with every client. Our forest grows on Ecologi.

Our ethos

Proud supporters of local WNNCC members.

Visit the Chamber

Free guide

What is a good website, really?

Last thing