Design problem

Information overload

Everything is on screen, nothing is emphasised, and people cannot tell what the page is for.

How you know you have it

New users ask what they are supposed to do on this screen.
Every element has been given a border, a background or a shadow, so none of them stand out.
The page serves four audiences and satisfies none of them.
Scanning fails: people read the whole thing or none of it.

1Write the one sentence that says what this screen is for, then rank everything against it.
2Take a greyscale screenshot. Whatever still stands out is your real hierarchy.
3Remove one level of container from every group and see what breaks.
4Move secondary content behind a disclosure or a second screen.

A screen that cannot name its single most important task will give everything equal weight by default.

When each new feature arrives with emphasis, the baseline rises until emphasis means nothing.

Dense is fine. Dense and ungrouped is not. Proximity and shared region do most of the work that borders are usually asked to do.

Overload is rarely about quantity. It is about rank, grouping and restraint in emphasis, so the entries here are the ones that establish those three.

The mechanism underneath the symptom. Read these when the fix needs justifying to somebody else.

Cognitive Load
Working memory is a narrow channel, and interfaces spend it on three kinds of work, only one of which is useful.
PsychologyEstablished research
Miller's Law
Working memory holds a small number of chunks, so the design lever is what counts as a chunk, not the raw item count.
LawEstablished research
Aesthetic and Minimalist Design
Every extra element competes with the ones that matter, so content should earn its place on the screen.
HeuristicExpert heuristic
Banner Blindness
People learn to ignore anything that looks like an advertisement, including your own content when it looks like one.
PsychologyEstablished research
Selective Attention
Focused attention makes people miss things in plain sight, including changes to the interface they are using.
PsychologyEstablished research

The visual and structural levers that produce or relieve this problem.

Visual Hierarchy
The order in which elements are noticed, controlled by size, weight, colour, position and space.
UI foundationCraft convention
Emphasis
Making one thing stand out, which only works if most things do not.
UI foundationCraft convention
Whitespace
Empty space is a design element that groups, emphasises and sets pace, not leftover area.
UI foundationCraft convention
Density
How much information occupies a given area, which should follow the user's expertise and task rather than a house style.
UI foundationCraft convention
Proximity
Things placed close together are read as belonging together, before anything is read.
UI foundationEstablished research
Common Region
A shared boundary or background binds elements together more strongly than proximity does.
UI foundationEstablished research
Scale
Relative size is the fastest signal of importance and the easiest one to overuse.
UI foundationCraft convention
Contrast
Difference is what makes anything perceivable, and it is measurable for text against its background.
UI foundationCraft convention

Recognised solutions, with the conditions under which each earns its place.

Progressive Disclosure
Show the common case first and reveal the rest on request, so complexity is available without being present.
PrincipleExpert heuristic
Filtering
Narrowing a large set by attributes, which is what makes large catalogues navigable at all.
PatternCraft convention
Empty States
The screen before there is anything to show, which is a teaching opportunity rather than a gap.
PatternCraft convention

States, behaviour and the accessibility contract you will need to specify.

Card
A container that groups content about one object, and the most over-applied component in modern UI.
ComponentCraft convention
Tabs
Parallel views in one space, which works only when users never need to compare across them.
ComponentCraft convention
Accordion
Collapsible sections that shorten a page, at the cost of hiding content from scanning and from search.
ComponentCraft convention

Where the words carry more of the fix than the layout does.

Content Design
Deciding what content a user needs and in what order, which is a design activity rather than a writing one.
UX writingCraft convention
Microcopy
The small pieces of text that do most of the work: labels, hints, empty states, errors and confirmations.
UX writingCraft convention

The requirements this problem raises, mapped to the decisions that produce them.

Heading Structure
Headings are the table of contents screen reader users navigate by, so levels must follow structure rather than appearance.
AccessibilityCraft convention
Reflow and Zoom
Content must work at 400 percent zoom without horizontal scrolling, which is the same as working at 320 pixels wide.
AccessibilityCraft convention
Text Spacing
Users must be able to increase spacing without content being clipped or lost.
AccessibilityCraft convention

Methods suited to confirming the cause before you commit to a fix.

Five-Second Test
Showing a design briefly and asking what people remember, which tests hierarchy and clarity of message.
Research methodCraft convention
Usability Testing
Watching people attempt real tasks, which is the most direct evidence available about whether a design works.
Research methodEstablished research

Interactive review passes, with progress saved in your browser.

UX Audit Checklist
A structured pass across the whole product, organised by the same categories as the audit tool.
ChecklistExpert heuristic
Dashboard UX Checklist
Whether a dashboard answers a question or just displays numbers.
ChecklistCraft convention

Worked cases, including the options that were rejected.

Choosing a Density for an Analytics Dashboard
A generous, modern-looking redesign made a dashboard slower for the people who used it all day.
Case studyCraft convention

The same material, organised around the surface you are building rather than the symptom you are fixing.