08 · Seeing
Figure-Ground
People split what they see into a thing in front and the background behind it. When it's unclear which is which, the eye flips between them.
Evidence: Holds upWhat we do with it
- 01
Make it obvious what's in front. A dialog needs a dimmed page behind it; a border alone isn't enough.
- 02
Text has to stand out from what's behind it. WCAG asks for a contrast ratio of at least 4.5 to 1 for body text.
- 03
Busy photos behind text make the eye work. Put a solid panel or a dark wash between them.
Examples
Getting it wrong, getting it right.
Don't
A pop-up with no backdrop over a busy page. People can't tell it's on top, and click the page behind it.
Do
The page dims behind the pop-up, and clicking the dimmed area closes it.
The evidence
What the research says.
A cornerstone of perception research since Rubin. Later work found the eye uses many cues to decide what's in front: regions that are smaller, enclosed or familiar tend to become the figure, and so do regions lower in the scene, as Shaun Vecera, Edward Vogel and Geoffrey Woodman showed in 2002.
Sources
- Rubin, E. (1915). Synsoplevede Figurer: Studier i psykologisk Analyse. Copenhagen: Gyldendalske Boghandel.
- Vecera, S. P., Vogel, E. K., & Woodman, G. F. (2002). Lower region: A new cue for figure-ground assignment. Journal of Experimental Psychology: General, 131(2).
- Wagemans, J., Elder, J. H., Kubovy, M., Palmer, S. E., Peterson, M. A., Singh, M., & von der Heydt, R. (2012). A century of Gestalt psychology in visual perception: I. Perceptual grouping and figure-ground organization. Psychological Bulletin, 138(6).
Last reviewed November 7, 2026. How we keep this current