Mobile UI ergonomics: How hard is it really to tap different areas of your phone interface?

Mikkel Bo Schmidt
Oct 17, 2014 · 5 min read

I have seen many diagrams explaining easy/hard tap zones on mobile interfaces. While I do believe these diagrams, they are mostly without any explanation of the analysis behind. Because of this I decided to do an experiment myself, measuring the time it actually takes to tap different parts of a phone’s screen. I expect there’ll be some correlation between the time it takes to tap an area and the experienced difficulty of tapping. More on this later.

Image for post
Image for post

As observed by more UX practitioners, it’s normal for users to adapt the way they hold their devices to the interface of the app they’re currently using. But for this first experiment, so far, I’ve only tested single, right-hand use on an iPhone 5S. (yes, I know that’s an old phone now, but the reality is sometimes faster than I am).


As Steven Hoober notes in his study from 2013, How Do Users Really Hold Mobile Devices, users who interact with their phones hold them predominantly in three different ways, listed with the statistics from his research:

  • one handed (49%)

Limiting the research needed for this experiment, I’ve focused on the dominant – one handed – hold.


The Experiment

For the test, I built a small web application with 7x12 tiles (=84). Each tile turns red once, in random order. When the test person taps a red tile, it instantly turns yellow for a moment and then back to white. The respondents’ reaction times – defined as red-to-tap – is stored per tile. The average tap-time for everyone who participated in the test is calculated and then visualised for easier analysis and digestion.

Red highlighting was chosen as it’s the colour which is most efficiently captures attention of humans. The tile size for iPhone 5S form factor gives a good approximation to the minimum tap area size as suggested in Apple’s iOS design guidelines (44x44 points).

Image for post
Image for post
Single, right-hand experiment. Testing the agility and speed of the thumb reaching different areas of the screen.

Each test person was approached in a similar way, and asked to sit comfortably, holding the phone in their preferred hand while not resting it on any surface. The test persons were also asked not to use their other hand for any interactions with the phone during the experiment. It was stressed that the goal was to tap the flashing tiles as quickly as possible and focus on the task of tapping all tiles in the shortest amount of time.

To increase participation and by invoking a sense of competition from the testers, I told them they will be informed how they performed compared to other testers, prior to the test. This seemed to help focus them and it increased their attention.

The Results

Single-hand use (right-hand hold)

Image for post
Image for post
iPhone 5S, right hand experiment with 7x12 tiles. Numbers are milliseconds from tile highlight to user tap event.

The diagram shows the average tap-time for 20 people, holding an iPhone 5S in one hand: their preferred, right hand.

It’s immediately clear that center and just below the center are the fastest to reach areas, and it takes almost 50% more time, to reach the upper and lower edges of the screen.

The vertical edge furthest away from the thumb is slightly faster to reach, than the closest edge.

Contrary to some claims, all corners actually cause significant delays in tap-time.

While this pattern is probably not super-surprising to anyone, it does confirm that there’s a sweet spot in the most natural resting position of the thumb. More surprising is maybe that there’s a slightly slower vertical zone before the last column of tiles on the far left. I.e. it’s actually faster to tap a tile further away, when it’s bordering the phone’s edge. The reason for this could be, that there’re less neighbouring fields which the user risks tapping and further, plus the condition that the edge can be used for aligning the thumb.

Limitations and Sources of Error?

  • Small set of respondents (20). I hoped to have many more respondents, but figured out I’d never get to finish this post. So instead of never publishing these findings, I went for the 2nd best solution I could think of. This also means that some tiles next to each other have very different reaction times, as outlier data isn’t “ironed out” as it would with more tests.

Next steps

This study was a small experiment I did to confirm some assumptions I had. When time allows I’ll dig into further analysis of some areas:

  • Correlate with thumb-length: Is there an optimum thumb-length for phone-UI single hand use?

Further reading and references


Hope you liked this post. If you did, I’d love a recommendation or share.
I’m also on Twitter where I tweet about these things:
@mibosc

Thanks to Mihir Nanavati

Mikkel Bo Schmidt

Written by

UX consultant, UI dev. Ex-Designit, Made by Makers, 6 years at Tradeshift. Currently helping a handful of early stage startups becoming successful.

Mikkel Bo Schmidt

Written by

UX consultant, UI dev. Ex-Designit, Made by Makers, 6 years at Tradeshift. Currently helping a handful of early stage startups becoming successful.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch

Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore

Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store