The Best User Experience is Consistent – Part 2: Some Theory
Our brain is constantly trying to predict what will happen next. It simulates different courses of action and recommends the best option to protect us from potential harm. If the prediction is consistent with the actual outcome we feel save and in control. If there is no consistency we feel helpless. This creates cognitive dissonance and mental harm. Consistency obviously is not only a design challenge but one of the fundamentals of our human mind. This might be enough of a reason to have a deeper look at the theory behind consistency in human-computer interaction.
In the first part of this series, I wrote about the basic pillars of consistency and why consistency is perhaps one of the most important design principles (Norman, 1988). My claim was that designing a consistent experience means that you truly understand your users and their expectations. By definition, a consistent design meets user expectations at three key levels: it mirrors their understanding of the business domain, follows the conventions for the platform they use, and maps to the product they are interacting with.
What Is Consistency?
Many people still think consistency is something that kills creativity and leads to a uniform and boring experience. This belief is grounded in a fundamental misunderstanding of the underlying mechanisms that make consistency such an important aspect of design.
Let me first reiterate some of the definitions of consistency in design. According to Merriam Webster, consistency is the “agreement or harmony of parts or features to one another or a whole”. In other words, consistency doesn’t necessarily mean uniformity but allows diversity if the design is in “harmony” with the user’s expectations. It is part of the designer’s task to utilize the design space accordingly, extending it where possible. This seems obvious, but reminds us that designs are sometimes driven by the interests of the designer or product manager, rather than the interests of the user.
Consistency is the alignment of your design with the user’s expectations. It is the implementation of your understanding of the users’ basic needs when they interact with your software.
How Does Consistency Affect Usability?
Consistency is assumed to enhance the user’s ability to transfer a skill from one system to another. By doing so, consistency leads to ease of learning and ease of use (Nielsen, 1989). If learning is defined as the acquisition of knowledge or skills through study, experience, or being taught (Wikipedia), it is evident that a design that can utilize prior knowledge doesn’t require the user to learn new things.
If the complexity of a task requires the user to acquire new knowledge, make sure that this new knowledge can be applied as widely as possible across your product portfolio. The best way to do this is to apply design guidelines consistently across similar tasks. Users only need to learn something once, and can make use of the same knowledge everywhere. This generates a rewarding feeling of mastery and creates loyalty towards your products: “I know how to do it here, and I don’t want to learn how to do it another way.”
Consistency helps users apply their expertise.
We usually integrate our knowledge into so-called mental models. These are representations of reality that are formed in our heads and allow us to simulate possible actions and their outcome, and to plan future interactions upfront. Maintaining mental models is easy if everything fits together and new facts can be readily integrated (in other words, when new facts are consistent with the mental model). If new facts don’t fit to the existing model, they cause dissonance and tension, and we need to decide whether our model is still valid or has to be modified. This adds to the cognitive load and eventually generates stress that we want to avoid.
Consistency helps users generalize their expertise.
Of course, if similar things work in a similar way, operating them requires less effort and becomes automated. Salient and highly-trained processes are stored in our procedural memory and we can trigger these programs just like macros without any further thinking. These automated processes work fast and require little cognitive effort. They are established unconsciously as an effect of repetition.
However, this automation requires things to work reliably in a similar fashion. If things work inconsistently, the same mechanism can be dangerous. Evolution has trained us to be efficient, so we will always try to use automated procedures if the circumstances allow. These automated procedures are triggered in a split second and sometimes before we even think about them. Many interaction issues are caused by unintended automated responses, and it must be a design goal to minimize these “oops, I didn’t want to do that!” moments.
Consistency helps reduce automation errors.
We all know how hard it is to change habits and how good it sometimes is to be able to rely on routines; it feels easy and smooth and allows us to save our energy for more important things. However, this is not always the main goal of a design. There can be good reasons to break with a routine. Consistency is a trade-off against other goals: at times, it is not the best design strategy (Grudin, 1989). Inconsistencies can be used to interrupt routines and force conscious processing instead. But in these cases, the inconsistency has to be obvious and recognizable before any action can be taken. If it is inconsistent and different, it also has to look different.
Inconsistency can be used to prevent automation and enforce conscious processing for critical tasks.
The Role of the Mental Representation
As I already mentioned above, one of the huge evolutionary advantages of the human species is the ability to generate a mental representation of reality and run simulations on possible actions and their outcomes before doing anything. This helps us to plan our actions, evaluate options, avoid risks and ultimately gain experience by refining this mental representation. Psychology refers to this representation as the mental model.
The above figures show stimuli of the seminal research Shepard and Metzler did in 1971. They discovered how tangible and realistic our mental models are, and how our mind can manipulate them just like we do objects in the real world.
Shepard and Metzler discovered the mental rotation effect by asking test participants to decide whether two stimuli were identical or mirrored. The comparison stimulus was rotated by a certain angle compared to the original stimulus. The striking observation they made was that the time people needed to give an answer was proportional to the rotation angle: the more the comparison stimulus was rotated, the longer it took people to reply. Apparently, people used their mental representation of the stimulus to rotate it to the same angle as the comparison stimulus to give an answer.
It seems as if there is a little copy of the world in our heads, which we use to understand what is going on, predict what will happen, and identify things that are strange because they don’t fit to our model.
Some even argue that this mental model and the concepts that form it can be even stronger than reality itself. This can result in effects where people can’t see things because they don’t expect them. Or it can work the other way round: we fill in information because we expect it to be there. In most cases, these processes are unconscious, so we are not even aware of the difference between our version of reality and the physical world around us.
For consistency, this means that we must really be aware of the users’ mental representations as they interact with our systems. Mismatches can lead to either confusion and cognitive load, resulting in frustration, or errors that might not even be discovered by the user.
Layers of Consistency
The design of interactive systems involves different layers: In the conceptual layer, we design the task flows and their semantics. The communication layer defines the interactions and syntax. And in the physical (or visual) layer, we define the part that most people commonly perceive as the actual design, such as colors, animations, typography, and graphics.
According to Moran (1981), and later Kellogg (1987, 1989), consistency can be implemented in each of these layers. Although their model was developed for command line systems, it still holds for today’s multimodal interactions.
|Conceptual||Task Level||Identify similar tasks and ensure they are designed in a similar way.|
|Semantic Level||Make sure that the tasks designed in your system match the expectation based on the tasks described in the real world.|
|Communication||Syntactic Level||Make sure that you use the terminology and metaphors that are expected based on the language and metaphors used in the real world.|
|Interaction Level||Make sure that your system is organized in processes and flows that match the expectations based on the processes and procedures operated in the real world. Make sure you use the interaction means and metaphors that are expected.|
|Physical||Spatial Level||Make sure that the arrangement and graphical design of your system matches the expectation based on the processes and codes used in the real world.|
|Device Level||Make sure that your system integrates well into the interactions specific to the environment, device or platform.|
This shows that consistency can’t be limited to only a single aspect, but must be propagated through all the different layers of interaction design – from the task model right through to the visual design.
At SAP, we have decided to make use of a slightly simplified version of this model that also reflects the building blocks of our design system:
- Look and Feel– On this layer, we address all aspects that are related to the final appearance and behavior of the design. This is similar to the physical layer in the model above.
- Controls– On this layer, we focus on the building blocks of the UI and the interaction metaphors used. This can best be related to the communication layer above.
- Page Types (Floorplans)– Here, we focus on the arrangement and flow of screens or pages that are designed to support certain tasks. By standardizing common page types for specific tasks, we address consistency at the conceptual level.
- Common Functions– In a browser-based environment, many of the framing features like search, navigation, or notifications must be implemented independently of the device or operating system. We define common functions as all interactions that enable functionality that is available across all applications. Common functions span all three interaction layers.
An important lesson these layers can teach us about consistency is that the final design is not the only aspect we need to consider. Depending on the circumstances, we might even offer different solutions for the same task if the determining factor is obvious and the mapping between those solutions is clear. In other words, we don’t have to offer the same design for a certain task on a desktop and mobile phone. If the mapping between the two platforms is consistent, users will not perceive the different designs as inconsistent.
In research I did years ago as part of my PhD, I was able to show that there is a transformational consistency effect similar to the mental rotation effect mentioned above: the complexity of the mapping between two versions of the same UI (based on given transformation rules) is proportional to the task completion times. This gave at least an indication that people try to map two versions of the same UI, and that we can make their lives easier if we stick to consistent rules.
We also seem to employ mental models in our interaction with interactive systems and these models seem to encode and operate on the user interface. Assuming that this process is always running in the background like our interactions with the real world, integrating what we do with what we expect to happen, it becomes clear how important consistency is on every layer of design.
I hope that this article helped you to gain a better understanding of the underlying theories behind consistency. I don’t think that consistency should be treated separately, but as an integral part of design, just like aesthetics. However, we are often not aware that it plays such a crucial role, since it’s not as obvious as an ugly color.
Also, I think that consistency deficits reveal a conflict between what we as designers think and what the user expects. We refer to that as the conceptual vs. the mental model. While we might understand the logic, based on our design rationale, users might see it differently based on their experience and expectations. As designers, we need to be aware of this potential conflict and assess user expectations to inform our designs very early in the process.
If you want to learn more about the fascinating psychological processes underlying consistency, I can strongly recommend reading the work of Johnson-Laird (for example, Johnson-Laird “Cognitive Science Series. Vol 6: Mental Models”, Cambridge, Mass, Harvard University Press, 1983) and of course the famous book on consistency edited by Nielsen (NIELSEN, Jakob: Coordinating User Interfaces for Consistency. New Issue 2002. San Francisco, CA, USA: Morgan Kaufmann Publishers, 1989). It is fascinating how much psychology can teach us about good design.
In the next part of this series I am writing about the impact of visual versus functional consistency and how to manage consistency in a corporate environment.