LLOS.ai
App Layout
📱 App Layout · Module 3 of 6

Zones & Reach

Every extra centimetre becomes thousands of taps a year. Great apps never make your thumb travel farther than it must.

1 Stage2 Stability3 Zones4 Glance5 Density6 Contract
Thumb zone · the easy arcEdges · infinite targetsCorners · need contracts

The first two modules fixed the frame and kept it still. Now the question is where the controls go — and the answer has almost nothing to do with how they look. It has to do with a thumb: its reach, its resting place, and the thousands of times a day it makes the same small journey.

A control in the wrong place is not a cosmetic flaw. It is a tax the hand pays on every use. This module makes that tax felt — you will play a reach game, run a fifteen-second edge drill, survive a checkout designed to steal your tap, and fix a hostile screen with your own hands.

First · prove it to yourself

Thumb Olympics

Before a single claim, a test. Eight dots. Tap them all as fast as you can — then look at what the screen reveals about your own hand.

time 0.0stapped 0/8
01 · The clause

Reach decides the home

Here is the whole principle: a control’s home is decided by how the hand reaches it, not by where the content happens to sit. On a phone held one-handed, the thumb sweeps a fixed arc — roughly the bottom two-thirds on the holding side. Inside that arc, taps are free. Outside it, every tap costs a stretch, a grip-shift, or a second hand.

The busiest verbs of your app — send, next, like, pay, back — are pressed hundreds of times a session. Put them where the thumb rests and the app feels effortless. Put them in the far corner and it feels, in a way users can never quite name, tiring.

The law

Frequency decides reach priority: the more often it is tapped, the closer to rest it lives.

02 · The map of the hand

The Reach Lab

Reach is not one map — it changes with the device, the hand, and the grip. Pick a phone, a hand, and a spot for the main button, and watch the real numbers move: how far the thumb travels, how far it travels in a year, the fatigue, the predicted misses.

Device
Hand
Button position
reachstretchout of range
Thumb travel
Travel per day
Fatigue
Predicted misses

You have felt where the thumb can reach. Now feel why the screen’s edges are the cheapest targets you own.

03 · The infinite target

Edge Arena

A target floating in open screen can be missed on every side. A target flush to the edge can be missed on only three — the boundary stops your finger for free. Feel the difference as a game: fifteen seconds, hit as many as you can. Play both modes, then read your own accuracy.

hits 0accuracy 100%time 15.0s
The law

An edge is an infinite target — the boundary removes an entire direction of error.

Reach and edges were about a single control. The next one is about what happens when many controls fight for the same corner — while a clock is running.

04 · The collision

The Checkout From Hell

One button matters: Accept & Pay. But a cookie bar, a chat bubble and a newsletter all want the same bottom corner, and they arrive late — right as your thumb commits. A ten-second timer runs. Try to pay. Then try the zoned version, where every overlay has an assigned seat.

wrong taps 0
The law

Corners need contracts, not accumulation — every persistent overlay gets one assigned seat.

of the screen the thumb reaches easily
1
assigned seat per persistent overlay
10%
of users hold the phone left-handed
05 · Now you fix one

Fix This App

Everything you have felt, in one screen. The layout is tidy — nothing messy — but the main action sits where the thumb cannot easily go. Drag it into the thumb zone (everything snaps to a clean grid, so the only thing you ever change is the reach, never the neatness), then grade it: the reach zones appear over your layout and score it.

The law

You just moved five controls and the screen felt kinder. That is layout — not decoration, but where things live.

Users never say “nice thumb zones.” They say one app feels effortless and another feels exhausting — and the difference is almost always measured in centimetres.

What people get wrong

Where reach dies

“Bigger buttons fix reach”Size helps you hit a target once you get there; it does nothing for the journey. A giant button in the top corner is still a stretch.FixPosition first, then size. Reach enables; size refines.
“Top navigation is always best”True on desktop, where a mouse reaches every edge equally. On a tall phone the top is the hardest place a thumb can go.FixPut persistent navigation at the bottom, where the thumb rests.
“Floating widgets can go anywhere”Each one seems fine alone. Stacked in the same corner, they collide over the exact spot the thumb commits.FixGive every overlay an assigned seat and cap how many show at once.
“Reach doesn’t matter, there’s search”Search finds nouns. The verbs you press hundreds of times — send, next, pay — are never searched for; they are reached for.FixOptimise the repeated verbs for reach; let search handle the rare nouns.
“One layout fits both hands”The thumb zone mirrors. A right-tuned layout quietly taxes the one user in ten who holds it left-handed.FixCentre or full-width the primary action along the bottom — both hands reach it.
“Desktop rules carry over”Desktop has a precise pointer, hover, and equal reach. A phone has a coarse thumb, no hover, a fixed arc, and hardware cut-outs.FixRe-decide placement for the hand, not the mouse. Translate, never copy.
“Bottom sheets always improve UX”A sheet in the thumb zone is great — until it hides the very content the user came for, or buries the action two swipes deep.FixUse a sheet when the action is frequent and the content survives being partly covered; not as a drawer for everything.
“More buttons at the bottom is better”The thumb zone is prime real estate, not infinite. Cram six actions into it and none is easy; the important one drowns.FixReserve the bottom for the one or two verbs used most; everything else steps back.
Where the rule bends

Bottom isn’t always right

Reach is a strong default, not a law. The skill is knowing where it flips — and why.

Rare, dangerous actions on purpose out
Delete, Sign out, Send money — you want these a little hard to reach, so a stray thumb can’t fire them. Reach rewards the frequent and safe; it is a trap for the rare and destructive.
Bottom sheets not for everything
A sheet in the thumb zone is great — until it hides the content you came for or buries the action two swipes deep. Use it for a frequent action over survivable content, not as a drawer for all of it.
Landscape & tablets two hands
The thumb arc is a one-handed, portrait model. Held in two hands, both thumbs own the bottom corners and the hard zone moves to the centre. Re-map for the grip, not the device name.
Foldables two maps
Open, a fold is a small tablet — two-handed, so the reachable zone flips. Closed, it is a narrow phone. The same app needs two reach maps, one per posture.
Accessibility design the floor
Reach assumes a typical hand and grip. Limited dexterity, tremor, or a single working hand lean on larger targets, generous spacing, and the OS reachability gesture more than zone placement. Design the floor, not just the ideal.
Terminals & the car rules change
A payment terminal is used standing, two hands free, eyes down; a car UI is glanced at with a legal duty not to distract. “Thumb zone” dissolves — target size, glance time, and safety take over.
Watch one get fixed

Same app, moved

Nothing here is redesigned — no new colours, no new content. One control moves from the top corner to the thumb zone, and the nav follows. Flip between them and watch the reach map turn from red to green, and the numbers with it.

FreshCart — the identical screen, two layouts
BeforeAfter
Thumb travel9.2 cm3.1 cm
FatigueSevereLow
Misses / 100 taps243
Same screen, same content — −66% thumb travel and a third of the misses. Only the reach changed.
Where you feel this every day

Apps built for the thumb — and one that forgot

Recreated in motion, no screenshots — watch where each one puts the thing you tap most.

Instagram
bottom nav
Amazon
sticky buy bar
YouTube
bottom controls
Maps
bottom sheet
The pileup
corner collision
How to actually work

The five-step reach pass

Feeling the tax is half of it. Here is the loop a designer runs to place controls on purpose — five steps, in order, on every screen.

1
Find the frequent actionslist
Watch a real session and count taps. The three or four verbs pressed most — send, next, pay, back — are the ones that earn the thumb zone. Everything else can step back.
2
Measure the reachmap
For the target device and grip, mark the arc the thumb sweeps freely. It shifts with screen size and hand — a Pro Max is not a Mini, and one in ten users holds it left-handed.
3
Assign homesplace
Drop the frequent verbs into the green zone, give every persistent overlay one assigned seat, and keep the bottom-centre clear for the single most important action. Reach first, then size.
4
Test with the thumb, not the eyecheck
Hold the phone one-handed and actually use it. If a common action needs a grip-shift or a second hand, it is in the wrong home — move it and try again.
5
Observe real userswatch
Ship it and watch. Over-taps, mis-taps, and hesitation near a control are the layout telling on itself. Reach is never done — it is a loop you re-run as the app grows.
Cast your vote

Which is easier to reach?

Five face-offs. The same screen, two placements — one taxes the thumb, one sits where it rests. Pick the kinder one, then see why.

Round 1 of 5Score 0
The vocabulary

The Reach glossary

Six words for placing controls by the hand. Tap a card to flip it.

The nuance

Questions you actually ask

Train the hand

Place the control

Ten questions in seven formats — multiple choice, multi-correct, fill-in, match, order, read-think-connect and write-your-own — each with layered hints: a nudge, the reasoning, then a deeper connection. Served from the question bank, never hardcoded.

Loading the question bank…
Question 1 of 10
Multiple choice
Before you go

The five-app test

Don’t take my word for it — take your own. Think of the five apps you open most. For each, picture the button you tap again and again: is it down by your thumb, or up in the far corner? These five start in the thumb zone — tap any whose main action really lives up top on your phone.

5of five keep their main action in the thumb zone
Tap a phone to flip its button between the thumb zone and the top.

Whatever your count — you just did the one thing you can never undo. You looked. From today, every app you open, you will see exactly where its thumb lives — and you will never unsee it.

Keep going

Where this connects