LLOS.ai
How Things Work
● How Things Work · Module 2 · Mapping

Mapping

Four knobs, four burners. You’ve burned dinner because someone lined them up wrong.

You know a thing is a control — that’s Module 1. Now the next question: which one? Every stove has this problem. The burners sit in a square; the knobs sit in a row; and the wiring between them is somebody’s afternoon decision. Get it wrong and millions of people spend years turning the wrong ring, catching it late, and quietly blaming themselves.

Mapping is the relationship between a control and its effect. When the layout of the controls mirrors the layout of the world, you never have to think — the arrangement is the instruction. When it doesn’t, you’re guessing. You’ll feel that gap on a stove, then put a number on it with Fitts’s Law.

~9 min2 felt labs + a simulatora repair diagnostic10-question bankglossary · FAQ
The journey — how things work
signalsaffordance
mappingmatch the world
feedbackdid it work?
modelsthe story
constraintsno wrong moves
errorforgive
Same promise, step two: when a design confuses you, it’s the design’s fault — not yours.
What you’ll be able to do
01 · Match the world

The scrambled stove

Here is the most famous usability problem on earth, in your kitchen. Four burners in a square; four knobs. If the knobs are just a straight row, nothing tells you which one is the back-left ring — so you learn by burning things. If instead the knobs are arranged in the same square as the burners, “back-left burner” simply means “back-left knob.” The layout answers the question for you.

Try both. A burner catches fire; turn it off, fast. Feel how one version makes you guess and the other makes you know.

The Scrambled Stove
A burner’s on fire. Click the knob that controls it — before it scorches.
▶ Start on Scrambled and feel yourself guess. Then switch to Natural — the knobs move into the burners’ square and the guessing vanishes.
heat
02 · Match the world

Which switch controls which light?

The stove lesson, now on a wall. Four lamps around a room, four switches to run them. If the switches are just a row, nothing tells you which one is the far-corner lamp — so you flick all four, every time. Put the switches in the same layout as the lamps, and “far-corner lamp” simply means “far-corner switch.”

One lamp is dark. Turn it on. Feel how a row makes you guess, and a matching layout makes you know.

Which switch, which light?
One lamp is off. Click the switch you think controls it — the line shows which lamp it really runs.
▶ Start on A row and feel yourself guess. Then switch to Room layout — the switches move under their lamps and the guessing vanishes.
03 · The mapping you already know

Which way is “more”?

Some mappings you don’t design — your users arrive carrying them. Up is on. Clockwise is more. Left is hot. These conventions are mappings burned in by a lifetime of dials and switches, and breaking one feels wrong in a way people can’t always name. Honour them and you get correct guesses for free; fight them and you get support tickets.

Call each one before you reveal it — and notice how sure you are.

Which Way?
Predict the common convention, then reveal it — and the surprising exceptions.
The craft, beyond the stove

The control should be where the thing is

Mapping sounds like a small detail until you feel a scrambled one. Named clearly, it’s one of the quiet forces that decides whether a product feels effortless or exhausting.

Good mapping means you never have to think.

The best mapping is spatial: the arrangement of the controls copies the arrangement of the things they control. Knobs in the burners’ square. A seat-adjust panel shaped like the seat. A row of light switches in the same order as the lights down the hall. When the layout carries the answer, there’s nothing to learn, nothing to remember, and almost nothing to get wrong — the control is simply where the thing is.

When you can’t map spatially, lean on the two backups. First, convention — the mappings people already carry (up for on, clockwise for more, right for forward). Borrowing one gives you correct behaviour for free; breaking one costs you every user who trusted it. Second, Fitts’s Law — once the mapping is right, make the important target big and close, and let the dangerous one be small and far. A ‘send’ button should fall under the thumb; ‘delete forever’ should make you reach.

So the working test is physical, not visual: could someone operate this in the dark, by position alone? The closer you get to yes, the more the design disappears — and a design that disappears is a design that works.

Cast your vote

Which mapping is clearer?

Five face-offs. Same controls, two arrangements — one tells your hand what to do, one makes you read a label. Pick the clearer, then see why.

Round 1 of 5 · The stove Score 0
Seen in the wild

Mapping done right

Good mapping is invisible — you only notice it when it’s missing. Here are two you use without a thought.

up = louder
Volume slider
Up is more

The slider rises as the sound does. It matches a mapping your body already trusts — higher means more — so you never read a label.

seat
Seat controls
Shaped like the seat

Premium cars put the seat-adjust buttons in the shape of the seat: push the ‘headrest’ up, the headrest rises. The control is the thing.

Where mapping leads next

Signals told you a control exists; mapping told you which one and where. But you still don’t know if pressing it worked — and until you do, you’ll press again. That’s the next bridge across the gap: feedback, the system saying back to you, clearly and quickly, “yes, I heard you, and here’s what happened.”

Take it further

The real references

The mapping ideas here — natural mapping, stimulus-response compatibility, Fitts’s Law — are the field’s, not ours. Four worth your time. (Opens in a new tab.)

The vocabulary

The Mapping glossary

Six words that turn “this feels awkward” into a precise fix. Tap a card to flip it.

The nuance

Questions you actually ask

Busting the myths

What people get wrong

Myth
“A label fixes a bad mapping.”
A label is a patch you have to read every time. Natural mapping needs no reading at all — fix the arrangement first, and the label becomes a nicety, not a crutch.
Myth
“Make every button big and central.”
Fitts cuts both ways. The safe action should be easy to hit; the dangerous one (delete, send-to-all) should be small and far, so a stray thumb can’t reach it.
Myth
“Conventions are boring — be original.”
Breaking a mapping people already know (up for on, clockwise for more) isn’t bold, it’s expensive. Save your originality for things users haven’t already learned.
Myth
“Mapping is only for physical products.”
It’s everywhere on screen: a settings list whose order matches the page, a chart whose legend sits beside its line, controls that appear where their effect happens.
Train the eye

Read the mapping

Ten questions in seven formats, tagged by thinking level — each with layered hints: a nudge, the reasoning, then a deeper connection. A wrong answer opens a door, never a dead end. Served from the question bank, never hardcoded.

Loading the question bank…
Question 1 of 10
Multiple choice
Keep going

Where this connects

▶ Play the labs