What the heck is Fitts' Law?

Ok, so somebody asked me this question, which seems to remain unanswered in my blog, “what the heck is Fitts’ law?”

Fitts’ (pronounced fitz-ez) Law is pretty simple.  The ability to reach or hit a target is a function of the distance to the target and the size of the target.  Let’s use an analogy, suppose I put a bow and arrow in your hand and ask you to hit a target.  Regardless of your skill, I can make this task very easy for you by putting the target at “point blank” range and you won’t miss.  The short distance will make it very easy.  The other thing I could do is make the target as large as a skyscraper and place you 25 feet away.  I’m pretty sure you’d still be able to hit it even though you are further away (it’s as big as a building!).

This relates to design as well; especially software design.  Most actions that a person executes on a piece of software is achieve by the physical motion of the person.  This is typically achieved either by mouse or keyboard.  With mouse and keyboard, the virtual action is a translation of a physical action. 

For example, when you move your mouse up to the “Favorites” or “Bookmarks” menu to bookmark this blog, you are translating the physical action of moving the mouse into a virtual action of motion on the screen.  There is a physical spot on your mousepad or desktop that corresponds to the location of the “Bookmarks” menu item.  Some people are more dexterous than others in reaching that point.  But in any case, it requires the dexterity of “acquiring” the target.  If you overshoot the target, you must make corrections in order to land the mouse cursor in the right space to manipulate the action associated with that space. 

The smaller it is, the more corrections you will need to make in “acquiring” the target.  The further that target is from your current mouse cursor position, the longer it will take, and the more dexterity it will take to reach that target.  For software design, this means that any action that is important for the user’s current task should be close to the user’s current position and large enough to “acquire.”  Other actions that are less important should be further away and smaller.

Back to our bookmarks example.  Let’s pretend that bookmarking a site is the most important action.  We could make the bookmarks menu a larger button and put it right next to the page that you are visiting so that it is a quick shot of the mouse to reach it.

There is another aspect of virtual size and distance that doesn’t translate directly into physcial space.  Most desktop operating systems are designed with screen edges that do not allow the mouse to move beyond the edge of the screen.  This is a huge, nearby target. 

Go ahead and push your mouse to the top of the screen; pretty easy right?  You could probably do it with your feet instead of your hands, it is so easy.  If a menu bar is “pinned” to the top edge of the screen (like the MacOS X menu) it is far easier for users to reach the menu and thus the items on the menu.  This is one of the reasons that I have long disliked the “title bar” of Microsoft Windows.  It occupies important space with little-to-no benefit to the user.

In my posts about the ribbon pattern, I mentioned that it is an improvement over older patterns, but that it has problems in regards to Fitts’ Law.  Namely, that it leaves “a small strip of dead space above the quick toolbar [that] breaks Fitts’ law.”  Hopefully, now this comment makes more sense to you, dear reader.  The 2-pixel strip of dead space above the quick access toolbar shrinks the targets of the bar and places is it much further away in virtual space.

Do you have any additional questions about Fitts’ Law?  Leave questions and comments at the end of this post.  I’ve been pretty good about responding to commenters, give it a try.