Logo of The Bit Bang Theory blog

Laws of UX: Fitts’ Law

  ·  15 minutes read

Illustration of User Interface Design

What is Fitts’ Law?

Fitts' law is a predictive and measuring model of human movement, developed by psychologist Paul Fitts back in 1954, mainly used in human–computer interaction and ergonomics. For predicting, Fitts' law predicts that the amount of time needed for a person to move a pointer (e.g., mouse cursor) to a target area is a function of the ratio between the distance to the target in question divided by the size of the target itself[1]. Hence, the longer the distance and the smaller the target’s size, the longer it takes. For measuring, on the other hand, Fitts' law presents a method to quantify human performance in a single measure, throughput.

Fitts’ law—at its simplest form—is common sense. The bigger an object and the closer it is to us, the easier it is to move to.

Scientific Background

Like many psychologists in the 1950s, Fitts was motivated to study whether human performance could be quantified using a metaphor from the new and exciting field of Information Theory. This field emerged from the work of Shannon, Wiener, and other mathematicians in the 1940s. The terms probability, redundancy, bits, noise, and channels entered the vocabulary of experimental psychologists as they explored the latest technique of measuring and modeling human behavior. Two well-known models in this vein are the Hick-Hyman law for choice reaction time (Hick, 1952; Hyman, 1953) and Fitts' law for the information capacity of the human motor system (Fitts, 1954).

Fitts' particular interest was rapid-aimed movements, where a human operator acquires or selects targets of a certain size over a certain distance. Fitts proposed a model–now "law"—that is widely used in fields such as ergonomics, engineering, psychology, and human-computer interaction. The starting point for Fitts' law is an equation known as Shannon's Theorem 17, which gives the information capacity C (in bits/s) of a communications channel of bandwidth B (in s-1 or Hz) as

Fitts's law equation for capacity

where S is the signal power and N is the noise power (Shannon & Weaver, 1949). Fitts reasoned that a human operator that performs a movement over a certain amplitude to acquire a target of a certain width is demonstrating a "rate of information transfer" (Fitts, 1954). In Fitts' analogy, movement amplitudes are like signals and target tolerances or widths are like noise.

Fitts proposed an index of difficulty (ID) for a target acquisition task using a log-term slightly rearranged from the equation above. Signal power (S) and noise power (N) are replaced by movement amplitude (A) and target width (W), respectively:

Fitts's law equation for index of difficulty

Fitts referred to the target width as the "permissible variability" or the "movement tolerance" (Fitts, 1954). This is the region within which a movement is terminated. As with the log-term in the first equation, the units for ID are bits because the ratio within the parentheses is unitless and the log is taken to base 2.

Fitts' idea was novel for two reasons: First, it suggested that the difficulty of a target selection task could be quantified using the information metric bits. Second, it introduced the idea that the act of performing a target selection task is akin to transmitting information through a channel – a human channel. Fitts called the rate of transmission the index of performance, although today the term throughput (TP) is more common.

Throughput is calculated over a sequence of trials as a simple quotient. The index of difficulty (ID) of the task is the numerator and the mean movement time (MT) is the denominator:

Fitts's Law equation for throughput

With ID in bits and MT in seconds, TP has units bits per second or bits/s. A central thesis in Fitts' work is that throughput is independent of movement amplitude and target width, as embedded in ID. In other words, as ID changes (due to changes in A or W), MT changes in an opposing manner and TP remains more or less constant.

Of course, throughput is expected to be influenced by other factors, such as device, interaction property, or environment. Two devices were compared in Fitts' original experiment (see next section). In HCI, a myriad of factors, or independent variables, can be explored using Fitts' throughput as a dependent variable. Examples include "device" (mouse vs. stylus vs. trackball – see MacKenzie, Sellen, & Buxton, 1991), "dwell interval" with an eye tracker (700 ms vs. 500 ms – see Zhang & MacKenzie, 2007), or "device position" (supported vs. mobile – see MacKenzie, 2015). Throughput is particularly appealing as a dependent variable because it combines speed and accuracy in a single measure (using a technique described shortly).

Of the two uses of Fitts' law noted above–predicting and measuring–throughput exemplifies the use of Fitts' law for measuring.[2]

Influence and application in UI/UX Design

As previously stated, Fitts's Law provides a model of human movement, established in 1954 by Paul Fitts, which can accurately predict the amount of time taken to move to and select a target. Although originally developed according to movement in the physical world, in human-computer interaction Fitts's Law is typically applied to movement through the graphical user interface using a cursor or other type of pointer. Fitts's Law has been formulated mathematically in a number of ways; however, its predictions are consistent across the many different mathematical representations.

Put simply, Fitts' Law states: "...the time to acquire a target is a function of the distance to and size of the target". As the distance increases, movement takes longer and as the size decreases selection again takes longer. Whilst Paul Fitts established his law of movement before the advent of graphical user interfaces, the law is no less robust when applied to navigation through the virtual world.[3]

Fitts’ law is extensively implemented in user experience (UX) and user interface (UI) design. For instance, this law influenced the principle of making interactive buttons large (especially on touchscreen devices)—smaller buttons are more challenging (and time-consuming) to click.

The size of a target and its distance from the user’s current position within the user interface affect user experience in a variety of ways. Some of the major implications for user interface design and user experience in turn are considered below:

CTA Buttons and Clickable Areas

As per Fitts' law, larger targets are easier to click on, so clickable areas should be as large as possible. However, while a larger button is clearly easier to click on, it isn’t necessarily the most optimal, which means it is important to find a balance between extending clickable areas (so the most pixels out of the interface are usable) and building clean interfaces.

Fitts’ law is a binary logarithm. This means that the predicted results of the usability of an object runs along a curve, not a straight line. In web design, this means that a very small object will become significantly easier to click when given a 20% size increase, whilst a very large object will not receive the same boost in usability when given the same 20% boost in size.

Chart of Fitts' law usability index vs object size

Graph of Usability Index versus Object Size in Fitts' law

So, here are a few examples portraying the idea of larger targets being easier to click on while keeping an eye on aesthetics, thus keeping the design balanced and clean.

DuckDuckGo's Landing Page

duckduckgo.com — Big input for the search engine.

Air Help's Landing Page

airhelp.com — Big CTA button right next to the big input fields.

Facebook's Landing Page

facebook.com — Big Log In button right under the form.

Corners and outer edges

The outer edges and corners of a graphical user interface can be reached with much higher speed than any other section/space. This due to the pinning action of the screen. As the user is restricted in their movements, the cursor automatically stops at the edges of the screen; fixing the cursor at a point on the boundary of the display. Consequently, placing UI elements in the corners of the screen makes such elements easier to click on.

macOS Graphical User Interface

Top menu in macOS in the left corner and other icons in the right corner.

Windows Graphical User Interface

Windows 10 Home (update 2020) — menu and app icons in the bottom left corner, other icons in the bottom right corner. Moreover, the Windows menu is square to shorten the time to reach menu items.

Snapshot of Behance's layout

behance.net — Logo and home hyperlink in the top left corner. Profile, search, notifications — in the top right corner.

Movements and Distances

Another fundamental factor in Fitts’ law is the distance between the mouse pointer's current position and where it needs to be.

Arranging essential UI elements far apart will increase the amount of time needed to navigate those elements. On the other hand, since the cursor often remains close to the last clicked element, it will take less time to click on another icon or button if they’re positioned nearby.

MS Office's User Interface

MS Office — Ribbon menu — icons are grouped by actions, and the most used icons are bigger.

asos.com's menu

asos.com — The website menu is rectangular to reduce the distance to the main options, and the elements are of a different size.

In Summary

Fitts’ law is a model that should be known and applied by every designer. A designer who takes advantage of Fitts’ law in usability testing or research will find valuable information that can directly impact the success of a website.

The model proposed by Fitts' law can improve your decision-making skills, thus strengthening your design sense. You may use Fitts’ law to justify design decisions or present a suggestion to relocate some user interface elements when planning a site redesign or working on a brand new design.

References

  1. Fitts, Paul M. (1954). "The information capacity of the human motor system in controlling the amplitude of movement". Journal of Experimental Psychology.

  2. MacKenzie, I. S. (2018). Fitts' law. In K. L. Norman & J. Kirakowski (Eds.), Handbook of human-computer interaction.

Back to Home