Skip to content
UX Atlas
PrincipleExpert heuristicIntermediate

Natural Mapping

Controls should be arranged to match the thing they control, so the relationship needs no explanation.

Definition

Norman's principle that the relationship between controls and their effects should be as direct as possible, exploiting spatial analogies and cultural conventions so that the mapping is understood without a label or instruction.

Expert heuristic. A review criterion developed by practitioners. Useful and widely taught, but evaluated by judgement rather than measurement.

On this page
  1. Definition
  2. The stove-top example, in software
  3. Mappings that work
  4. In practice
  5. Sources
  6. Continue from here

The stove-top example, in software

Norman's canonical example is a cooker where four controls in a row map to four burners in a square, so every user has to read the labels every time. The software equivalents are everywhere: a settings panel whose order does not match the layout it configures, a legend whose order does not match the stacking order of the chart, arrow keys that move something in an unrelated direction.

Where a spatial mapping is available, it removes an entire layer of interpretation.

Mappings that work

  • Sliders that increase to the right, in left-to-right locales, and are mirrored in right-to-left ones.
  • Chart legends ordered to match the visual order of the series, not alphabetically.
  • Panel controls positioned adjacent to the region they affect.
  • Drag handles located where the movement will start.
  • Progress that fills in the direction of reading.
  • Toggle position matching the state: on to the right, off to the left, plus a text label.

In practice

Legend order matching series order

Data visualisation

Ordering a stacked area chart legend to match the stacking order removes the constant back-and-forth of matching a colour to a name.

Controls next to what they change

Editors

Formatting controls placed adjacent to the selected content, rather than in a distant panel, halve the eye travel and make the connection self-evident.

Sources

Where a source establishes something narrower than the popular reading of it, the note says so.

  • The Design of Everyday Things

    D. A. Norman, Basic Books, 1988, revised 2013

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applied through

Where this shows up as a concrete interface decision.

Commonly confused with

Close enough to be mixed up, different enough to matter.

  • Affordances and SignifiersPrinciple

    An affordance is what is possible. A signifier says so. Mapping is whether the control resembles the thing it changes.

Related concept

Connected closely enough to change how you apply this.