Addaly is in open beta. Things will change, and AI answers can be wrong — check anything that matters.

Design, Before Any Software

Hierarchy, type, colour and spacing — the part of design you can do with a pencil, before any software.

Lesson 55 of 748 min

Repetition, and the one that breaks it

Prediction is what makes a break loud

A grid of twelve identical cards sets up an expectation within about the third card. Once the eye has predicted the pattern, it stops examining each instance and starts sampling. That is efficient, and it is why a well-repeated structure is restful to look at.

It is also why a single deviation is so loud. The eye is no longer inspecting; it is checking predictions, and a violated prediction is the cheapest possible thing to notice. One double-width card in a grid of twelve is found instantly, from the periphery, in greyscale, at any size.

This makes repetition-plus-break one of the strongest emphasis devices available, and it is nearly free — you did not add anything, you only made one thing different.

The mechanism is the same one that finds typos

A typo stands out in a well-set paragraph and hides in a badly set one. The reason is identical: even typographic colour and consistent spacing establish a prediction, and the misspelling violates it.

This generalises usefully. The more consistent a design is, the more powerful each deviation becomes. A design with no consistency has nothing to break, which is why chaotic layouts cannot emphasise anything — there is no baseline against which a difference registers. Restraint is not the opposite of emphasis; it is what makes emphasis possible.

One break per pattern

The rule follows directly from the emphasis budget. A grid with one double-width card has a highlight. A grid with four double-width cards has a second pattern, and neither pattern emphasises anything.

The number is genuinely one, in most cases. Two can work when they are clearly different from each other as well as from the field — a large card and a card with an inverted colour scheme are two different kinds of break, so they do not merge into a rule. Two identical breaks always do.

Kinds of rhythm

Repetition does not have to be even.

  • Regular. Equal elements at equal intervals. Calm, and the easiest baseline to break.
  • Alternating. Two treatments taking turns — the striped table, the alternating image-left and image-right sections down a landing page. It establishes a prediction with a period of two, and breaking it is correspondingly louder.
  • Progressive. Intervals that grow or shrink — spacing that opens up as a page descends, type that steps down through a hierarchy. This is what a type scale is: a progressive rhythm in size.
  • Random. Not a rhythm. Deliberate randomness in a layout almost always reads as an absence of decisions rather than as a choice, because viewers have no way to distinguish the two.

Repetition across a whole piece

The version that matters most is not within one screen but across many: the same kind of thing always gets the same treatment.

Every section heading looks alike. Every card has the same corner radius. Every destructive action is the same colour. Every photograph is cropped to the same ratio.

This is the beginning of a design system, and the next block is about formalising it. What matters here is the perceptual reason it works, which is that consistency is what lets a reader stop examining. A user who has learned that this shape means a button does not have to work out whether each new one is clickable. Every inconsistency withdraws a little of that, and the cost is paid in attention on every screen, forever.

The failure at the other end

Repetition without any break is monotonous, and it is a real fault rather than a safe default. A page of forty identical rows has no entry point, no rest, and nothing for the eye to hold on to — which is why long lists get section headers, why long documents get pull quotes, and why a wall of identical cards benefits from one that is different.

The diagnostic question is whether the eye has anywhere to land. Blur the page. If the blurred version is a uniform texture with no features, you have repetition and no rhythm, and the repair is to break the pattern once, deliberately, at the place you most want somebody to look.

The one thing to keep

Repetition builds a prediction and a single deviation violates it cheaply, which makes consistency the thing that gives emphasis its force — so break a pattern once, at the place you want attention, and never twice in the same way.

Before you move on

A landing page alternates image-left and image-right sections down its length. The team adds a third variant, a centred full-width section, and uses it three times among nine sections. The page now feels disorganised. Why?

Pick the one you would defend. Nobody sees your answer.

No ads. No data sale. No public scores on people. Ever.

© 2026 Addaly