There are a number of ways we can think about helping users quickly and accurately select a target and execute a response in order to reach their intended goals. Let’s review three theories of response selection/execution and take a look at how they can be applied to graphical user interfaces (GUIs). This blog post will discuss Hick’s Law, Fitss’s Law, and the Simon Effect.
Hick’s Law
According to Hick’s Law, the more choices a user has to make, the longer it will take the user to make a decision. Conversely, with fewer options, the user will be able to make a decision quicker (Soegaard, 2020). While this may seem intuitive, or even obvious, many designers can probably recall a time when a client or product team was adamant about having ALL of their product’s cool new features or diverse set of options available to the user on a particular screen or device, regardless of their relevance to the user’s goal. Crowding an interface in this way can inhibit the user’s ability to make a decision quickly and also negatively affect the accuracy of that decision.
Mathematically, Hick’s Law can be represented by the formula RT = a + b log2 (n), where response time (RT) is a function of the number of stimuli present (n), and a and b are measurable constants that will change depending on the tasks to be completed (Soegarard, 2020).
Hick’s Law in Action
The use of Hick’s Law is present everywhere in the world of designed artifacts, from kitchen appliance settings to website navigation bars, and just about everything in between. For instance, modern microwaves offer a number of features, such as smart sensors, the ability to turn the sound on and off, power-saving modes and child-proofing. However, in most instances, a user will likely be looking to perform a relatively simple task common to many other users of the microwave. For instance, a common use case of the microwave interface might involve a user clicking a button labeled “popcorn” to use the microwave’s pre-programmed automatic sensor cooking feature to quickly and easily make a bag of popcorn (Figure 1). If the interface was crowded with buttons to represent less commonly used features, say, to activate the child lock and or change the time, it would take the user longer to find the useful “popcorn” button. Thus, the designers of a microwave interface might use Hick’s Law to limit the number of options readily available to the user and consolidate less common features by employing a deeper hierarchy.
This Frigidaire microwave has a one-touch, easily findable “Popcorn” button, but less common tasks require the user to select the settings or clock icons to see what other options are available.
Fitts’s Law
The premise of Fitts’s law is also intuitive and conceptually simple: the larger the target on the screen and the closer it is to the user’s pointer, the faster they’ll be able to select it. This applies to all “pointing” mechanisms: from mouses to touch screens and even joysticks (Johnson, 2014). Of course, users are able to move at different speeds, so the designer must also account for the user’s abilities in their application of Fitts’s Law.
Fitts’s Law in Action
Fitts’s Law is ubiquitous in GUIs. We’ll take a look at a well-designed website that employs Fitts’s Law, as well as a website that struggles to apply the theory.
In Figure 2, Al Jazeera makes good use of Fitts’s Law by making the photo for each feature story clickable in addition to the story headline, which uses a large, bold font to maximize the size of the target. The site also has a good amount of white space, so that a user doesn’t have to worry too much about over or undershooting their mark and hitting the wrong link.
Al Jazeera designers used Fitts’s Law to their advantage by incorporating large click-targets for feature articles.
The website for the government of Ann Arbor doesn’t showcase awareness of Fitts’s Law in its service center (Figure 3). While the icons for each service are adequately sized, the text links below each icon are much too close to the other icons. For instance, it would be much too easy for a user attempting to click the Trash and Recycling icon to accidentally select the “Permits” link.
The services page within the website has targets that are too close to one another, rendering them “small” targets.
The Simon Effect
The Simon Effect refers to the increased difficulty of responding (in measures of both accuracy and speed) when a stimulus is not naturally compatible with how the user has to respond to it (Stoet, 2019). For instance, imagine you were asked to press an orange buzzer each time the word “orange” appeared on a screen and a green buzzer each time the word green appeared on a screen. Now imagine that sometimes the word “orange” is displayed with the font color set to orange, and sometimes it’s displayed with the font color set to green. The Simon Effect says that you will more quickly hit the orange buzzer—and be more accurate with your selection—when the word “orange” uses the font color orange than when it uses the font color green.
To take a classic “Simon Test”, visit PyschToolKit.org.
Applying Theories of Response Selection/Execution
Hick’s Law, Fitts’s Law, and the Simon Effect are general theories that we’ve seen can be applied in a number of interaction design settings. However, designs don’t exist in a vacuum, so other design principles and theories of human psychology should be taken into account when designing a product, system, or interface. When contemplating whether or not to apply a specific law or principle, a designer should weigh trade-offs (for instance, is it more important that the user respond quickly or that they can see the full scope of their options) and consider the user group’s goals.
References
Stoet, G. (2019, March 13). Stimulus-Response Compatibility and the Simon Effect. PsyToolKit. https://www.psytoolkit.org/lessons/src.html
Soegaard, M. (2020). Hick’s Law: Making the choice easier for users. Interaction Design Foundation. Retrieved October 17, 2020, from https://www.interaction-design.org/literature/article/hick-s-law-making-the-choice-easier-for-users
Johnson, J. (2014). Our Hand-Eye Coordination Follows Laws. Designing with the mind in mind: simple guide to understanding user interface design guidelines, second edition. (pp 187-194). 2nd ed. Burlington, MA: Morgan Kaufmann. https://doi.org/10.1016/B978-0-12-407914-4.00013-0
