01 / The problem
Designs are drawn with perfect data
Every mockup has three products, a short name, a good photograph and a logged-in user. Real sites have none of that reliably. The gap between the design and the day it launches is where most of the ugliness lives.
Five states account for nearly all of it. Draw them and the build stops producing surprises.
02 / Empty
Before there is anything
No orders yet. No saved items. No results. A brand new account looking at a dashboard designed for someone six months in.
An empty state is not a failure, it is an opportunity: say what will appear here, and offer the action that fills it. Most sites show a blank panel, and the new user concludes it is broken.
03 / Loading
While the answer is on its way
Something takes a second, or on bad signal, five. Without a designed state you get a blank area, then a sudden jolt as everything appears and pushes the page around.
Reserve the space. Show the shape of what is coming. The perceived speed of a site is decided here more than in the actual timing.
04 / Error
When it goes wrong, which it will
The payment declines. The upload fails. The postcode is not recognised. Three rules: say what happened in words a person understands, say what to do next, and never lose what they typed.
“Something went wrong” satisfies none of these and is the default when nobody designed the state.
05 / Too much
The long name, the huge number, the fortieth item
The design has “Blue Chair”. The catalogue has “Blue Reclining Occasional Chair with Removable Cushions (Set of Two)”. The mockup shows four testimonials; the client adds thirty.
Every container needs an answer for overflow (wrap, truncate, scroll), decided by a designer rather than by whatever the browser does when nobody chose.
06 / Different person
Signed in, signed out, and the one with no photo
The same page for a returning customer and a stranger. The team member with no profile picture. The product with no image, which will happen the week after launch.
Decide these once and they are handled forever. Leave them and each one becomes a small emergency.
07 / Why it is worth the time
It is cheaper here than anywhere else
Drawing five extra frames costs an hour. Discovering them during the build costs a conversation and a change. Discovering them after launch costs a customer who could not complete something.
This is also, bluntly, how you tell a considered design from a good-looking one. Ask to see the empty state. The answer tells you a great deal about what you are buying.
Send us a design you are about to build and we will tell you which states are missing.