❤️ 15/15

Gestalt: the brain automatically reads scattered elements as 'wholes' — proximity and similarity

Gestalt psychology (Wertheimer 1923 and others, in the first half of the 20th century) discovered that people don't look at a scene pixel by pixel — they subconsciously organize the parts into a structured whole: 'the perception of the whole is not the sum of its parts.'

These 'grouping principles' directly determine, in an interface, 'what looks like a group and what looks separate.' The original set includes proximity, similarity, closure, and continuation; late in the 20th century common region (Palmer, 1992) was added, among others.

What it means for designers: you don't need a label saying 'these belong together' — place and style elements using Gestalt cues, and users naturally read them as a group.

Proximity: sits close = one group. This is the most effective grouping cue and the one to reach for first. Elements near each other are perceived as belonging to the same group; distant elements are read as playing different roles.

How strong is it? Often a simple spacing adjustment beats adding divider lines or boxes.

In practice: pull each form label close to its own input field, and leave larger gaps between groups — users instantly read the structure. The anti-pattern is a label sitting closer to the previous input than to its own — users then type into the wrong row. Group with spacing first; bring in other means only if that's not enough.

💡Similarity: looks alike = works alike. Elements sharing a visual trait (color / shape / size / style) are seen as the same kind, belonging to one group, with similar functions — so the same kind of action should look consistent: all primary buttons the same color and shape, all links the same blue with an underline.

Conversely, similarity is an implicit promise: if two things look the same, users expect them to behave the same. Putting an element that 'looks like a button but isn't clickable' into an interface breaks the expectation similarity created (echoing the usability principle of consistency).
Two ways the same elements get grouped: by spacing (proximity) and by shared color and shape (similarity) — not a word of explanation, yet users read the groups