Size and selection times: Fitts’s Law

Oo Oo – Just when I thought I was settling down to do some of the work i’m actually paid to do, I discovered a bit of psychology that is relevant to interaction design:-
Did you know that the time it takes you to point your mouse, or your finger, at something is predictable from the size and distance of the object using an equation known as Fitts’s Law?

Nope, neither did I till today. But if you apply it right it shows how you can get a big gain in how quick and easy it is to select something with just a small change in the selection interface.

First, the maths. Quoting, Fitts’s Law at a glance (lecture notes):

Fitts discovered that movement time was a logarithmic function of distance when target size was held constant, and that movement time was also a logarithmic function of target size when distance was held constant. Mathematically, Fitts’ law is stated as follows:

MT = a + b log2(2A/W)

where

  • MT = time to complete the movement
  • a,b = parameters which vary with the situation (‘regression coefficients’)
  • A = distance of movement from start to target center
  • W = width of the target along the axis of movement (also equivalent to the degree of permissible error in movement target)

  • Fitts’s Law is an example of a principle in psychology which was developed from information theory (you can read more about this here [1]). Although the basic message is obvious (big things are easier to select) it is the precise mathematical characterisation that is exciting, and that this characterisation includes a logorithmic function – which means that the shape of relationship between size and reaction time is curved so that small increases in size for small objects result make it much easier to select them (whereas small increases in size for big objects don’t make that much difference). And the same applies for changes in target distance.

    AskTog.com defines Fitts’s Law as “The time to acquire a target is a function of the distance to and size of the target” and has some pleasingly opinionated notes on the application of Fitts’s Law to interaction design:

    While at first glance, this law might seem patently obvious, it is one of the most ignored principles in design. Fitts’s law dictates the Macintosh pull-down menu acquisition should be approximately five times faster than Windows menu acquisition, and this is proven out. Fitt’s law dictates that the windows task bar will constantly and unnecessarily get in people’s way, and this is proven out. Fitt’s law indicates that the most quickly accessed targets on any computer display are the four corners of the screen, because of their pinning action, and yet they seem to be avoided at all costs by designers.

    Use large objects for important functions (Big buttons are faster).

    Use the pinning actions of the sides, bottom, top, and corners of your display: A single-row toolbar with tool icons that “bleed” into the edges of the display will be many times faster than a double row of icons with a carefully-applied one-pixel non-clickable edge along the side of the display.

    AskTog also has this quiz for interaction designers, all of the answers to which are based on some application of Fitts’s Law.

    Now for a typical GUI interaction lets suppose that the width of the thing you want to click on is about a ten times smaller than the distance you need to move to click on it. What is the effect of making the object closer, compared to making it bigger (and vice versa)?

    Well for a range of distances (1 to 10) and a range of widths (0.1 to 1.0) the surface of the time-taken-to-move space looks like this:

    fitts_flat.jpg

    If the 3D version is a little hard to understand, here’s a flat version, with the same colour coding (red = longer time, blue = shorter time)

    fitts_flat.jpg

    From this, I suggest that these things are true:

  • Decreasing the size/width of your target, if compensated for by an equivalent decrease in the distance of the target, won’t have any effect on ease of selection. This is just moving along the leading diagonal space shown above.
  • but this is only true as long as the changes are equivalent percentages. The same absolute change to both target size and target distance could have a big effect on ease of selection
  • If selection is very slow, the most gains in ease of selection will first be made by making the target nearer (ie you start at the highest point of the movement time surface, the gradient is steepest along the ‘distance’ axis)
  • Then you will enter a region of the parameter space where equivalent (percentage) changes in distance and size will have comparable effects (ie the middle bit).
  • The final increases in ease of selection (ie decreases in movement time) will only be got by increasing target size.

  • Obviously, for any particular design problem you are working on the maths won’t tell you which part of the parameter space you are operating in – but Fitts’s Law does give you a model to start thinking about it

    Refs

    1. MacKenzie, I. S. (1989). A note on the information-theoretic basis for Fitts’ law. Journal of Motor Behavior, 21, 323-330. (Online here)

    2. Wikipedia article on Fitts’s Law

    4 Comments

    1. apb
      Posted January 20, 2005 at 6:39 pm | Permalink

      If you’re so excited about Fitt’s law, you will love Hick’s Law:
      ( http://www.usabilityfirst.com/glossary/main.cgi?function=display_term&term_id=266 )
      which allow to predict how long a user people will take to make any computer task, from typing a word in a keyboard (it depends on the number of keys!) or selecting an entry in a cascaded menu.

    2. Posted January 20, 2005 at 9:51 pm | Permalink

      Here’s a page with other links to Fitts Law stuff:

      http://www.iawiki.net/FittsLaw

    3. Posted January 21, 2005 at 11:16 pm | Permalink

      links for 2005-01-21

      Ideal Boy via http://www.cynical-c.com (categories: misc) Handmade Knives by Daniel Fronefield via http://www.cynical-c.com (categories: things) Tortilla-Board: A New Breadboard Technique via http://www.cynical-c.com (categories: projects) Siemens Dom…

    4. Posted January 21, 2005 at 11:18 pm | Permalink

      links for 2005-01-21

      Ideal Boy via http://www.cynical-c.com (categories: misc) Handmade Knives by Daniel Fronefield via http://www.cynical-c.com (categories: things) Tortilla-Board: A New Breadboard Technique via http://www.cynical-c.com (categories: projects) Siemens Dom…


    Post a Comment

    Required fields are marked *
    *
    *

    Follow

    Get every new post delivered to your Inbox.

    Join 23,471 other followers