Why the first version looks grey.

Design · 5 min read

I had a client who expected the first design review to look like a finished app. Bright colours, his logo in the corner, polished buttons, the works. Instead he got grey boxes, placeholder text, and screens that looked like someone had sketched them with a ruler.

He was confused. He asked me if something had gone wrong. "Is this a draft?" he said. "Are we behind?"

No. That grey, boring, unfinished-looking version is the wireframe. And it might be the most important stage of the entire design process.

Pretty designs get polite feedback

Here's the problem with showing something that looks finished too early. When a design looks polished, people treat it like it's done. They focus on the colour of a button instead of whether the button should exist at all. They say "looks great" instead of "I'm confused about how to get from here to there."

Nielsen Norman Group's research on prototyping fidelity confirms this. Low-fidelity prototypes generate more honest, structural feedback because users feel less pressure to be polite about something that obviously isn't finished yet. When it looks rough, people feel permission to challenge it.

That honesty is exactly what you need in the early stages. I want clients to say "this flow doesn't make sense" or "I'd never tap that button." I can't get that feedback if the design is already wearing its Sunday best.

Structure first, decoration later

Steve Krug nailed it years ago. Users scan. They don't read. The structure of your app matters more than the decoration. Where things are placed, how screens connect, what happens when you tap a button. Those decisions have to be right before a single colour gets chosen.

Wireframes strip away the visual layer so you can focus on logic. Does the navigation make sense? Can someone find what they need in two taps? Is the information hierarchy clear? These are structural questions that get buried under polish if you start pretty.

I think of it like building a house. You don't choose the paint colours before the frame is up. The wireframe is the frame. It has to be solid before anything else goes on top.

The grey version is where the real decisions happen

Every major decision in the project gets made during the wireframe stage. Which features make the cut. How users move between screens. What the core flow looks like. Where the friction points are. All of that happens in grey.

By the time we move to high-fidelity design with colour, branding, and final typography, the structure is locked in. The pretty version goes fast because all the hard thinking already happened. The grey version is slow on purpose.

So when you see that first wireframe and it looks underwhelming, know this. That's the stage where your app is actually being built. The colour comes later. And it comes quickly because you did the hard work first.

Sources
UX Prototypes: Low Fidelity vs. High Fidelity (Nielsen Norman Group) - Low-fidelity prototypes generate more honest, structural feedback because users feel less pressure to be polite about a finished-looking design.
Don't Make Me Think (Steve Krug, 2000) - Users scan, they don't read. The structure matters more than the decoration.

Related blog posts:

A prototype is not an MVP →

Simplicity is harder to sell than complexity →

Colour isn't decoration →