The eye resolves complex arrangements into the simplest, most stable interpretation available.
LAW·017Law · Perception
Tag28 entries across 6 sections
layout
Entries tagged layout, drawn from across the library. Tags cut through the section structure, which is where most of the useful connections are.
Type
Category
Level
28 entries
Show the common case first and reveal the rest on request, so complexity is available without being present.
PRIN·003Principle · Complexity
Controls should be arranged to match the thing they control, so the relationship needs no explanation.
PRIN·008Principle · Interaction
People learn to ignore anything that looks like an advertisement, including your own content when it looks like one.
PSY·003Psychology · Attention
The order in which elements are noticed, controlled by size, weight, colour, position and space.
FND·001UI foundation · Visual design
Shared edges create invisible lines that organise a layout and make it feel deliberate.
FND·003UI foundation · Visual design
Things placed close together are read as belonging together, before anything is read.
FND·004UI foundation · Gestalt principles
A shared boundary or background binds elements together more strongly than proximity does.
FND·006UI foundation · Gestalt principles
Distributing visual weight so a composition feels stable, whether or not it is symmetrical.
FND·011UI foundation · Visual design
How the parts are arranged on the whole surface, which determines where the eye goes and in what order.
FND·014UI foundation · Visual design
Empty space is a design element that groups, emphasises and sets pace, not leftover area.
FND·015UI foundation · Visual design
Repeating spacing intervals create a pulse that makes long pages feel ordered.
FND·017UI foundation · Visual design
How easily continuous text can be read, governed mostly by size, line length, leading and contrast.
FND·036UI foundation · Typography
A shared structure that makes alignment automatic and layout decisions repeatable.
FND·039UI foundation · Layout
How many vertical divisions the content occupies, which affects scanning as much as it affects fit.
FND·040UI foundation · Layout
The constraint that stops content spreading to unusable widths, and increasingly the unit that components respond to.
FND·041UI foundation · Layout
A fixed set of spacing values, so every gap in the product comes from the same vocabulary.
FND·042UI foundation · Layout
One layout that reflows across sizes, ideally driven by content limits rather than by device categories.
FND·043UI foundation · Layout
Distinct layouts for distinct contexts, justified when the task genuinely differs rather than merely the screen size.
FND·044UI foundation · Layout
The widths at which the layout changes, chosen from where the content breaks rather than from a device list.
FND·045UI foundation · Layout
Lines that separate, which should be the second choice after space rather than the first.
FND·047UI foundation · Form and depth
Parallel views in one space, which works only when users never need to compare across them.
CMP·016Component · Navigation
A container that groups content about one object, and the most over-applied component in modern UI.
CMP·022Component · Containers
Measuring where people look, which is expensive, frequently over-interpreted, and occasionally irreplaceable.
RES·017Research method · Evaluative
Content must work at 400 percent zoom without horizontal scrolling, which is the same as working at 320 pixels wide.
A11Y·013Accessibility · Perceivable
Users must be able to increase spacing without content being clipped or lost.
A11Y·015Accessibility · Perceivable
Work out structure and priority while changes are still cheap, and stop before the fidelity starts answering questions you have not asked.
FLOW·010Workflow · Process
Generating structural options early, which is useful for breadth and unreliable for quality.
AI·008AI workflow · Exploration