When developing an app, functions, colors, flowcharts and so on can be considered. But something that must always be taken into account is accessibility in UX.
User experience design is the way people interact with a system or service. In a way, we design the way the user will scroll through our app and our interface.
If you’d asked anyone how they’d like an app to be, most people would want an easy, pretty and no advertised app. But there is much more to it apart from these characteristics, like having an intuitive app or being as accessible as possible.
What is accessibility for mobile phones
Currently, most of the traffic generated on the Internet comes from mobile devices. In them we have a very powerful tool to connect with the world around us and to inform ourselves. But this is often a problem for people with disabilities.
But where is Disability found? Disability arises in the interaction with a product or person. This is the approach that society gives us about disability. In a simpler way, the interaction with the environment can develop different barriers. Let’s call disability to that barrier that occurs with the interaction and therefore depends on the context.
“Accessibility allows us to tap into the potential of everyone”. – Debra Ruh
These barriers may be permanent (paralysis or blindness) or temporary (an arm in a cast), congenital (autism) or acquired (eyestrain or deafness).
Nielsen’s 10 heuristic rules or how to test without users
For us, Chubby Apps, as a small company, it has always been problematic for us to test with users. We program and design internally both our own apps and for third parties, but one of the biggest problems we encounter is that we analyze the usability of the app from our own perspective and that can make us not notice any problem.
That’s why we use Nielsen’s 10 heuristic rules, which despite being written in the wonderful 90’s, allow us to detect a large number of usability errors without having to test or before testing with users.
System status visibility
One of the most fundamental. And the most difficult to remember in the design process. It’s the one that reminds you that the user must receive feedback from the system when performing an action. This way he knows that he has performed the action and that the app has received it without any problem.
This also applies to errors that may be present in forms and that must be signaled.
We can show them with icons, illustrations, animations, etc.
Emergency exit, or give the user control and freedom
This rule talks about giving the user the ability to control the actions he/she wants. Even undoing actions that may have been performed by mistake. How to cancel the sending of an email, modify a journal entry or undo a written text.
Something as simple as warning of mistakes you make as a human. Suggesting keywords in a search, if the password you are using is secure or is 123456 or warning that you have forgotten to attach a document or title to an email. This way we prevent blank entries from being generated.
Don’t take anything for granted
Sometimes we are so involved in the development of our app that we don’t take into account the flowcharts and we take for granted that the user will know the route to follow by inertia. Writing text is as inhumane as registering when the user does not even know what to do, or warning that a 404 Error has occurred and then just sitting there without the user who is reading the alert being familiar with the term.
What already works doesn’t need to be changed
We are not going to reinvent the wheel. And if we already understand the heart symbol as something positive and it will not mean the opposite in our app. This way you will not confuse the user and you will meet specific expectations.
Simple aesthetics and design
The minimal trend is not just a trend. The information displayed by an app should be necessary and useful at that moment and if not it should be hidden.
Recognizable better than by memory
Sometimes when we want to design as minimally as possible we forget things along the way. And what we least want to generate in the user when using our app is mental load. The more information you give the user about where he is and where he is going, the better10
Design for those who have just arrived and those who have been here for a long time.
Your app will have both new users and users who already master the app almost better than you. And for both it must be equally attractive. Explanatory screens and welcome tours are therefore necessary, but don’t bore them with tips after this entry barrier.
No instruction manual
This is one of the heuristic rules that we like the most and that is why we include it in our business principles. Ideally, but even so, a FAQ is a good example of how to avoid support emails and avoid the barrier of the user having to contact you.
Falling down and getting up
Errors are the bread and butter of users within your applications. They cannot always be avoided with the rules given above, but you can make it easier to identify them when they happen. In this way the user will be able to solve them in a simple way.
Practices to consider for accessibility in UX
The manufacturers of the different mobile platforms are aware of the importance that accessibility must have in our developments and designs and that is why they add accessibility within the predefined graphic components within the APIs of their systems.
Using native language and using the components that the operating systems make available to us, the adaptation that we will have to make to provide our application with UX accessibility will be minimal. Thus, we will only have to make the following adaptations to be fully accessible:
- Add descriptive or alternative text to all interface controls, using the appropriate attribute in each case.
- Describe images, icons and elements necessary for the understanding of the app in a correct and detailed way, avoiding purely decorative elements.
- Check that all interface elements that may involve interaction with a physical directional controller (mouse, braille tablet, gesture navigation) can be reached.
- Check that auditory messages are accompanied by a haptic or visual alternative. Allowing its use by hearing-impaired users.
In the event that we can not achieve all the functionality required by our application through system elements. And we have to generate our own elements, we will have to guarantee their accessibility by using the corresponding attributes and checking that the phone’s own UX accessibility services work correctly.
Do not write in capital letters
Sometimes, for whatever reason, we design headlines using capital letters throughout the text. This, believe it or not, generates a lot of accessibility problems in UX:
- Reading slows down by 10%
- Sometimes screen readers read these texts letter by letter
- These texts are more difficult to read due to the similarity generated between the letters. Eliminating much of the visual differentiation found in lowercase letters.
Do not use colors exclusively to provide information
Sometimes we use the traffic light system to give information quickly. Generating alerts with red, blue for information and green to indicate that something is correct.
But as we explained in the article on color theory to improve accessibility in UX, we do not all see color in the same way, and in the case of being color blind, we see both green and red as gray.
Therefore, in addition to adding chromatic differences, we must add an icon or a descriptive message.
Many times we design buttons where the padding (the padding space required by the sides of an element) is so residual and so close to other elements of the design that it can produce complications when making Tab.
If we leave a very small space in which to make a tab, we make it difficult for people with motor disabilities who have difficulty performing certain actions.
Include them in our design processes
As you include accessibility enhancements in your application, there are several tools that can help you test the experience and improve accessibility in UX.
- Accessibility Scanner: This app developed by Google and available for Android devices suggests accessibility improvements for your applications. Helping you find application elements that could benefit from accessibility improvements.
- Stark: Plugin for sketch that helps you to solve a lot of inconsistencies from the design process. It allows you to simulate visual problems related to color and even check contrast to pass WCAG tests.
- Cluse: Another plugin for sketch that allows us to control the contrast but in this case for free.
“We need to make every single thing accessible to every single person with a disability.” – Stevie Wonder
But the best tool is always to include your future users in your design process. This way you’ll include them in the co-development of your app and they will help you to find new features and be more accessible. Something that we took very much into account from Cori and that’s why we launched the app directly in an open beta that is allowing us to see what our audience is concerned about. If you want to help us improve the app feel free to subscribe to the beta or send us an email.
Main differences between Android and iOS
Basic UX accessibility features apply to all mobile platforms. The interface and design options should make an application accessible to everyone. However, the solutions provided by different operating systems are different. That is why I wanted to reflect the main features:
Both iOS and Android have screen readers within their operating systems. In order to help people with visual or literacy disabilities have access to the same information. Thanks to them, the text on the screen is transformed into voice. You can listen to the text instead of having to read it. Each platform has its own reader. Google Voice Assistant within Android and VoiceOver for iOS.
Screen readers treat the interface as components, which we must label in the correct way so that the reader can interpret them and the user can navigate between them. By default the reader will use the hierarchy of these components to start reading. Based on the position from left to right and from top to bottom. The gestures used to navigate and to proceed with reading are very similar on the two platforms.
Currently, the differences between iOS and Android have been gradually disappearing in favor of being more accessible. Both accept external keyboards to navigate through their interface as if operating a computer. Last year Apple even added support for Braille displays (something in which Android was ahead thanks to Braille Back).
Why are we accessible?
By developing mobile applications taking into account accessibility in UX we can develop a good user experience for all types of people. From digital natives to seniors with disabilities. Accessibility is not only moral but there is no reason that prevents us from ignoring accessibility. It is not just a feature. It is a necessity for the design and development of applications.