A Case of the Fitts

Which of these two buttons could you hit the fastest?

That’s easy. The big one.

Not so fast.

There is one instance where hitting the smaller button is faster: You are already directly on top of it.

Fitting In

This is a prime illustration of the most basic principle in usability and interaction design known as Fitts’ Law.

The time it takes to point to an object is a function of the distance to the object and its size.

To be even simpler, “The closer and bigger it is, the easier it is to point at.” When you think about it, this is obvious. However, Paul Fitts managed to derive an actual formula to calculate the time rather accurately. Countless research papers have confirmed his mathematical formula to be about 95% accurate.

If the buttons are exactly the same size, the button closest to your pointer wins.

Here, the bigger button would usually be easier to hit simply by virtue of its size. However, if you happened to be positioned on top of the small button already, you won’t have to move at all. Just click.

Could I have the menu?

If it weren’t for the current trend of completely removing or obscuring the menu bar in modern web browsers, I would have led with a different example.

Quick: Open your Edit menu.

The problem is that some browsers in Windows force you to show menus by tapping the ALT key. In Mac OS X Lion, Apple has built-in a Full-Screen Mode into Safari that hides the menu bar unless you bring your pointer to the top of the screen. No matter. Let us soldier on.

In Windows, each main application window has a menu bar shown inside the window, underneath the title bar. To get to the Edit menu, you would likely shoot your mouse up towards the Edit menu, overshoot it, then reel back downwards slowly to finally hit it. It takes some precision.

The Windows 7 menu bar

On a Mac, the menu bar occupies the top edge of the screen, no matter what application you are in. To get to the Edit menu here, you’d shoot to the top of the screen, not caring about how far you go.

The Mac OS X menu bar

Can you see where Fitts’ Law comes in?

The Mac OS menu bar is easier to hit because it’s not just a strip of 18 pixels you have to aim for with the pointer. Because your pointer won’t go past the edge of the screen even if you try, the menu bar is infinitely big. You can keep moving your mouse and pointer will stay put, ready to open the menu right at the edge of the screen.

Where else can we see Fitts in play?

The Menu In Context

The engineers working on Windows 8 have graciously turned to blogging their experiences while working on the next version of Windows. Some changes are radical, while others may seem backwards.

Consider this graph from Microsoft’s examination of how people use normal file commands in the current version of Windows:

Graph of Windows 7 Explorer command entry points

To see the menu bar last is not surprising. In Windows 7 and Vista, it’s hidden unless you tap the ALT key. Even so, it’s tiny and not the easiest to use, as we’ve seen. But why is the context menu so much more popular than everything else?

Again, it’s Fitts. When you’re working with a file, it’s likely you are already pointing at it. To get to the context menu, you don’t even have to move your hand. Just right-click, and the menu appears right under your pointer. The commands in the context menu are nearly guaranteed to be easier to target than any of your other options, such as the keyboard-shortcuts, toolbar buttons, or menu bar items.

Bigger and Closer is Better

That’s the short of it. Always keep in mind how much effort it takes for the user to hit a particular control. Make the controls easy to find and hit. Think about where the user is likely to be at the moment they want to invoke a particular control.

Fitts’ Law has proved remarkably accurate in describing user interactions with controls in a vast number of scenarios. Remember it when designing controls, whether they be for mouse, trackpad, multi-touch, or even just the eyes.

Michał Sterzycki

Michał has spent over 10 years ensuring end-users and administrators alike have the best experience possible, in both consumer- and enterprise-level applications. He anticipates what they want, before they want it.

If you catch him in the hallway, he will likely wax prophetic on the nature of software and hardware design. He watches the software and mobile industries, closely monitoring trends. He also dabbles in film criticism, gaming, history, and religious study.

Michał graduated from Rensselaer Polytechnic Institute with a Bachelor's Degree in both Information Technology and Psychology, with a concentration in Software Usability. Figures.

Twitter - More Posts

Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>