The principle of consistency enables people to learn new systems faster and efficiently deliver knowledge to new frameworks. The systems are more usable and learnable when they are presented in similar ways. Consistency helps people focus their attention on the task at hand. There are four categories of consistency: aesthetic, functional, internal, and external.
Aesthetic consistency means consistency in style. Aesthetic consistency helps things easily identifiable for people. As an example, a company logo is great identifier of who the company is and what the company does. When the logo is used consistently (same font, color, graphic, and tagline), then a brand is born. Aesthetic consistency enhances recognition and communicates emotional connection between brand and people.
Functional consistency improves usability by formulating existing knowledge of how designs functions. When similar controls function the same way, it is called functional consistency. The consistent use of symbols on a new device increases predictability of the product, which makes the new device easier to use and learn.
Internal consistency relates to correlation of elements in the system. This is a blend of both visual and functional consistency. As an example, if updating a webpage with new elements, you should also update other older webpages in the website with same elements.
External consistency refers to consistency across multiple independent systems. Adobe products are good examples of external consistency. Adobe Photoshop and Adobe Illustrator have similar tools and features that is recognizable to the users. Therefore, if you know Photoshop you can apply that knowledge to learn Adobe Illustrator.
Visual depiction from Universal Principles of Design
“Bob Evans uses the same logo, typefaces, color, schemes, menus, staff uniforms, interior design, and architecture across its restaurants. The consistency improves brand recognition, reduces costs, and establishes a relationship with customers that extends beyond any single restaurant.” (Lidwell, Holden, Butler 2010, p.57)
Online visual depiction
Elements of website designs to include Aesthetic consistency, Functional consistency, Internal consistency, (https://gofishdigital.com/guide-design-consistency/) and External consistency. (https://uxdesign.cc/design-principle-consistency-6b0cf7e7339f)
Real life visual depiction
Aesthetic consistency: Apple logo on MackBook Pro, iMac, Magic Mouse in Silver and in Space Gray
Functional consistency: Roku remote control, Samsung LED remote control, Samsung Blue-ray remote control (play, pause, fast-forward and rewind buttons)
Internal consistency: In the city of Irvine, street signs are brown with white letters
External consistency: Ubiquitous and recognizable restroom signs
References:
William Lidwell, Kritina Holden, Jill Butler (2010), Universal Principles of Design, Beverly, MA: Rockport, 2010
Matt Burt (2017) A Beginner’s Guide to Achieving Web Design Consistency, Go Fish Digital, https://gofishdigital.com/guide-design-consistency/
Anton Nikolov (2017) Design principle: Consistency, The most known and the most fragile design principle., UX Collective, https://uxdesign.cc/design-principle-consistency-6b0cf7e7339f
Great post Robin. Providing examples with products we use in daily basis was really insightful . Often times we do not notice how consistency help us work with similar products. We just expects similar devices to work in a same fashion. I never came across anyone who had difficulty working with their tv remote, since companies try to build their TV remotes consistent to that of other companies. Having consistency in mind when designing a product enhances learnability. In other words, people can use their existing knowledge to work with new products. This can increase the user’s satisfaction and reduce their frustrations when using a new product.
I’ll share a link bellow which explains more about this principle and provides more examples.
https://www.interaction-design.org/literature/article/principle-of-consistency-and-standards-in-user-interface-design
Team 6- This is one of my favorite design principles because
I believe its one of those principles that should be hard to implement and fundamental in design and UX. The lack of consistency is definitely one of the most important design principles that can often be attributed to users not being able to quickly learn or understand a system. When there is consistency throughout a system, the likelihood of a user being able to learn and adapt to a system as well as repeatedly use the system increases substantially.
The bathroom signs example you provided are good however, I would submit that more than ever bathroom sign designs are becoming more ambiguous and more inconsistent. Signs like the one you have provided have been replaced with icons or just specific words like “The Loo” that do not resemble the example you provided. I’ve almost walked into a men’s bathroom numerous times because of the signage not being clear and at a first glance looked like the women’s restroom. More and more, the text/copy to identify restrooms are absent from the doors/walls and therefore the consistency of bathroom signage has depleted substantially.
I really appreciate Google’s Material Design approach. By creating an open source design system the likely hood of designers using the same iconography and designs principles increases. This unified system, therefore, assists with users being able to experience systems across technologies, platforms, and products in a consistent manner which in turns help create delight and reduce some cognitive load.
Google Material Design https://material.io/design/introduction/#principles
Consistency does seem hard to implement, since much of the time, things that should be consistent across industries are designed by different organizations–just like with the bathroom signs. My impression is that as time goes on, one design just kind of wins out and people just use it because everyone else does. Hopefully this means that somewhere down the line, we’ll have a consistent set of inclusive bathroom symbols.
Hi Team #6,
Great examples of consistency. As we see this design principle in so many products we encounter in our day-to-day life. Even the mightiest of problems will fall if you keep hacking it every day! Unfortunately, Consistency is also one of the design principles that we like to violate frequently. Here is an example of a violation of consistency:
The missing function of locking Cap in Google’s Chromebook has violated so many areas in the principles of the basic design and user interactions. It takes away the consistency in the typing experience of the users and violates the fundamentals of the typing rules the users have adopted for years, which in my opinion makes the product unusable.
https://browsernative.com/delete-key-chromebook-82/
Here is the image for my example of a violation of consistency:
This missing function of locking Cap in Google’s Chromebook has violated so many areas in the principles of the basic design and user interactions. It takes away the consistency in the typing experience of the users and violates the fundamentals of the typing rules the users have adopted for years, which in my opinion makes the product unusable.
https://www.google.com/search?q=chromebook+miss+cap+key&safe=active&client=safari&rls=en&source=lnms&tbm=isch&sa=X&ved=0ahUKEwjDs_W-9pfeAhXJhVQKHRSQAFAQ_AUIDygC&biw=1581&bih=1049#imgrc=MiO8ng3zE3CRPM:
The examples that your team uses for consistency are really spot on. With large brands, we forget how simple yet effective the use of a singular logo is (such as with Apple). Another example I can think of for aesthetic and internal consistency would be In-N-Out. They have two crossed palm trees in the front of each location, and the interior of the restaurant is consistent across all of them: white uniforms with red aprons, white subway times, and white/red booths for diners to sit at.
https://images.mentalfloss.com/sites/default/files/6830708665_c811a340ea_z.jpg
https://www.uchscommander.com/wp-content/uploads/2017/04/FEATURESinnout-1.jpg
https://www.reviewjournal.com/wp-content/uploads/2016/04/web1_innout_2.jpg