Three Taps or Fewer
Testing a simplified kiosk flow
"I built a paper prototype of the three-tap flow. Home screen, destination, confirm and pay. I want to test it before we go digital — would you two run through it?"
"Paper prototype. How quaint. Fine — give me the scenario."
"You're a tourist. You've just landed. You need a ticket to Central station. Go."
Sable watched Declan's fingers move across the paper screens. He tapped "Buy a Ticket" immediately — no hesitation. Good. Then the destination screen. His hand hovered.
"The destination field is fine. But your two fare options — 'Standard' and 'Peak' — are the same visual weight, same size, same color. There's nothing telling me which one to pick. You've reduced the choices but made the remaining ones equally invisible. That's not simplicity. That's a different kind of confusion."
"He's right about the ambiguity. In the rider sessions, 6 of 12 participants paused at exactly this kind of equal-weight choice. When nothing stands out, people freeze — they're afraid of picking the wrong one."
"So I reduced the number of options but forgot to make the right one obvious? The visual hierarchy is flat — nothing tells the rider's eye where to go first."
Sable has identified two perceptual problems. First, the fare cards lack figure-ground separation — neither option stands out as the primary choice against the background. Second, the identical sizing violates visual hierarchy by treating unequal options as equal.
"Make the recommended fare larger. Push the alternative smaller and to the side. One figure, one ground. The rider's eye should land on the answer, not on a question."
Sable grabbed her pen and redrew the fare screen — the recommended option twice the size, centered, with the alternative tucked below in lighter text. It was the same information. But now her eye knew where to land.
The perceptual tendency to separate visual elements into a foreground subject (the figure) and a background field (the ground). The figure is what we focus on; the ground is what recedes. When a design fails to establish this separation, elements compete and nothing feels primary.
- The figure appears closer, more defined, and more important than its surroundings
- Contrast, color, size, and sharpness all help separate figure from ground
- Ambiguous figure-ground relationships create visual tension — sometimes intentional in art, almost never desirable in interfaces
In the studio: Sable's original fare screen gave both options the same size and color — no figure, no ground. Declan's fix was pure figure-ground: make the recommended fare larger and centered (the figure) while the alternative recedes (the ground).
The principle that elements placed near each other are perceived as related — as belonging to the same group or category. Proximity is one of the most powerful and instinctive ways the brain organizes visual information, and it works even when the elements themselves look different.
- Close spacing signals "these belong together" — a label near a field, a price near a product
- Increased spacing signals "these are separate" — a gap between sections, a divider between groups
- Proximity overrides similarity: two different-looking items placed close together feel more related than two identical items placed far apart
In the studio: On the kiosk's confirm screen, the route summary and fare sit close together — proximity tells the rider they describe the same trip. The "Change details" link sits below a gap, signaling it belongs to a different action group.
The studio's shared calendar app displayed every team member's schedule simultaneously — five color-coded layers stacked on top of each other. Sable spent three minutes trying to find Priya's availability before giving up and walking to her desk.
Five overlapping schedules exceeded what working memory could parse at once. Like the twelve-button kiosk, the calendar showed everything instead of just what was needed for the current task.
A Meridian station had three signs near the exit: "Taxi Rank" in large bold letters, "Bus Connections" in the same large bold letters, and "Bike Storage" also in the same large bold letters. Riders exiting in a hurry couldn't tell at a glance which direction mattered most to them.
When every sign has the same visual weight, none of them function as a focal point. A clear hierarchy — largest for the most-used exit, smaller for secondary options — would let riders scan instead of reading.
Sable designed a poster for the studio's Friday talk series. She showed it to Tomoko, who said: "I can see the date, the speaker, and the topic — but they're all the same size. What do you want me to see first?"
Without a dominant focal point, the viewer's eye wanders rather than entering the design at a specific place. Tomoko's question is the test: if you can't answer "look here first," the hierarchy isn't working.