Universal Design principles on digital product experience design

At some point in life, we all find obstacles, be it when handling a product, navigating a space or even when interacting with a computer program. But don’t worry, these situations are more common than you think, and disabilities are even more frequent and accounted for. It is almost certain that we’ll go through some of these situations at some point in our lives, whether for natural reasons, such as aging, or for external meddling, such as injuries and accidents. There is still a huge stigma surrounding the word “disability”, and having one is as common as the denial about it.

The expression "Universal Design" was coined by Ronald Mace and a team of architects, product designers and engineers in the 1990s, and it reminds us that age and abilities (physical and cognitive) impact experiences. One of its goals is to push the boundaries of services, products and environments we design to include as many people as possible without compromising the integrity or quality of the product, minimizing the difficulties of adaptation to particular users. It also describes a set of considerations/principles made to ensure that these products, services, and environments are usable by everyone, to the greatest extent possible, without the need for adaptation or specialized design.

When it comes to conceptualization, both 'accessibility' and 'universal design' are quite similar, so to speak. The first refers to the time when social movements and struggles for the rights of people with disabilities came to light and it’s mainly associated with technical standards, such as ABNT 9050 and W3C for the internet, having the law in its favor to guarantee its implementations. The second one refers to more theoretical and philosophical principles of the process and design intent. There is no standardization of these principles, which does not make them less valid or important for applications in projects, just the opposite.

The Universal Design Principles

Universal principles are approaches the designer uses to analyze and predict failures in systems and processes and correct them so it has maximum optimization. These improvements can happen at micro levels, when they are at a simple product or functionality level, and macro: when the object, environment or service is the designer's focus of study. The change is in the approach, which goes from a single resource to the work devoted to the whole, providing more complex and complete improvements.

Within each principle I gave some examples and suggestions of how to bring those to life on your digital product experience design. Check it out:

1. Equitable Use

The design is useful and marketable to people with diverse abilities. Provide an equal way for the users to access features and information. Avoid segregating any group of people because of personal restrictions and/or device capabilities. Must considerate all users, instead of only the target users. When designing for everyone, the experience will be improved seamlessly for the target audience.

How to:

• Provide the same means and quantity of information for all users: identical whenever possible, equivalent when not. (e.g.: use alt texts, captioned images and graphs)
• Avoid segregating or stigmatizing any users (e.g.: do not use mouse-only interactions or hide elements behind mouse hovers or specific interactions)
• Provisions for privacy, security, and safety should be equally available
• Make the design appealing to all users (e.g.: you can use high contrast so that sight limited users can have the equivalent product experience)

2. Flexibility in Use

The design accommodates a wide range of individual preferences and abilities. This is about giving users a choice on how and when they access features, rather than forcing them into places they don’t necessarily want or need to be. Use flexible, adaptable and/or customizable design. It is important to take into account possible individual preferences and let the users choose how they will use a product or space. When choices are provided, the users will feel more free and more in control of their own experience.

How to:

• Provide choice in methods of use and accommodate right- or left-handed access and use (e.g.: allow customization / ask for user preference to position particular elements of the application / for mobile, optimize for the thumb zone)
• Provide choices in features and ways that tasks can be accomplished to facilitate the user's accuracy and precision
• Provide adaptability to the user's pace. (e.g.: do not take away the user’s ability to navigate at their own speed)

3. Simple and Intuitive Use

The use of the design is easy to understand, regardless of the user's experience, knowledge, language skills, or current concentration level. This aims to reduce complexity and cognitive loads. According to the cognitive load theory, humans can handle only 5-9 items in a short amount of time when processing information, and to hold between 2-3 items front of mind in our working memory. The greater the complexity, the smaller the capacity. So as to reduce cognitive loads, present information between 2-5 items, ideally, or fragment it into smaller groups.

In addition, the Hick–Hyman law says that increasing the number of options to choose, the time and the effort it takes to make a decision increases, but remember that this law is valid for small amounts of information and make simple quick decisions, not complex actions involving extensive reading, researching, or extended deliberation.

How to:

• Eliminate unnecessary complexity by reducing cognitive loads, keeping it short and simple and always testing with real users before adding new features to the design
• Be consistent with user expectations and intuition, allowing the user to identify an element's functionality intuitively without prior explanation
• Use words and expressions that are easy to understand, giving preference to explanations instead of technical terms
• Arrange information to be consistent with its importance
• Provide effective prompting and feedback during and after task completion using progress statuses, breadcrumbing and wayfinding tips and landmarks

4. Perceptible Information

The design communicates necessary information effectively to the user, regardless of ambient conditions or the user's sensory abilities. Via text, pictures, audios or videos, make sure the information is easy to access and diggest by everyone. This is about finding the best way to present information considering users with disabilities, such as vision or hearing impairments.

How to:

• Use different modes (pictorial, verbal, tactile) for redundant presentation of essential information. This can be done by supplying both graph and table views of data, allowing to users not only the flexibility to choose how to get information like suggested in '2. Flexibility in Use', but also the help to make patterns in the data more understandable
• Provide adequate contrast between essential information and its surroundings
• Maximize "legibility" of essential information breaking your information down into easily digestible pieces
• Differentiate elements in ways that can be described (e.g.: make it easy to give instructions or directions)
• Provide compatibility with a variety of techniques or devices that people with sensory limitations use

5. Tolerance for Error

The design minimizes hazards and the adverse consequences of accidental or unintended actions. Anticipate different situations and users’ actions designing for an error-friendly environment. Ensure they can’t trap themselves in a corner, or accidentally cause irreversible damage to their information or navigation.

How to:

• Arrange elements so as to minimize hazards and errors: most used elements > most accessible. Isolate, shield or eliminate hazardous elements (e.g.: put permanent or destructive functions inside menus and/or behind confirmation prompts)
• Provide warnings about hazards and errors
• Provide fail-safe features (e.g.: undo)
• Discourage unconscious action in tasks that require vigilance

6. Low Physical Effort

The design can be used efficiently and comfortably and with a minimum of fatigue. Those with temporary or permanent mobility issues may have a hard time moving the mouse to the desired target. This is why designing for low physical efforts is vital. Don’t require users to go back and forth across the screen to complete a single workflow.

How to:

• Group actions together in specific areas of the screen. This minimizes the amount of mouse dragging or thumb stretching needed
• Minimize repetitive actions and sustained physical effort (e.g.: reduce mouse use by providing keyboard shortcuts)
• Allow user to maintain a neutral body position.

7. Size and Space for Approach and Use

The appropriate size and space is provided for approach, reach, manipulation, and use regardless of user's body size, posture, or mobility.

How to:

• Provide a clear line of sight to important elements and make reach to all components comfortable in different postures (e.g.: seated, standing, walking down the street, laying in bed user)
• Accommodate variations in hand, finger and grip size (e.g.: the average size of an adult index fingerprint is 1.6-2 cm → approximately 60-76px)
• Provide proper dynamic space for the use of assistive tech, personal assistance or other accessibility and input tools (e.g.: special spaces for virtual keyboards, dropdown and context menus, etc)

Besides that, it is important to keep in mind that the "product is not the keyword here—consumers are", as well said by Paula Becchetti on her Product Expecience article at the Chameleon blog. She also pin points that "User love is the answer to today’s question around business success." and offers guidance on how you can improve your product experience. Don't forget to check it out!

The accessibility metrics provide a backbone for universal design: this practice requires an overall belief in including all of our users in our designs. By practicing empathy and taking actionable steps towards inclusivity, we build better, stronger products and become more thoughtful, considerate designers.

Here at Labcodes we are currently working on our design system, and as part of this journey, we set one of our design principles to be universal and accessible. In this process we are learning a lot and it feels great to think beyond and design better. There are a lot of ways the principles can be interpreted and applied: the possibilities are really huge. Have you ever worked on a inclusive design project? Feel free to start a discussion on our comments section and tell us what your think.

References

• Principles of Accessible and Universal Design
• Embrace 7 Principles of Universal Design
• Interaction Design Foundation
• Cognitive Load - Wikipedia
• Do You Need to Lighten Your Cognitive Load?
• Centre for Excellence in Universal Design
• How Do Users Really Hold Mobile Devices?
• Hick’s Law — quick decision making
• KISS the Feature creep
• About Affordances - Mergo - in Brazilian Portuguese