Designing for accessibility: 4 overlooked features in mobile banking
Why is accessibility important for mobile banking? According to the World Health Organization, there are an estimated one billion people worldwide that have some type of mental, physical, or sensory limitation that could impact their ability to fully use technology. With the population in North America and Europe aging rapidly, coupled with the increasing number of users becoming mobile banking-dependant, accessibility has become a key consideration for all product designers. Unfortunately, there is no official guideline for accessibility on smartphones. This makes designing for accessibility a difficult, and somewhat subjective ordeal for us product designers. Although some of the WCAG 2.0 guidelines are relevant - like contrast ratio and labels, for example - those rules were created for web browsers and lack information about smartphone-specific capabilities, such as what to do with touch interactions, gestures, auto-rotation, and iOS/Android-specific assistive technologies.So, I decided to put together a list of easy-to-implement (but often overlooked) features to consider when designing for mobile banking.
1. Let users pick the size of their text
Figure1.png
One of the more useful accessibility tools that is not supported by the vast majority of banking apps is Larger Text. This feature allows a person with poor eyesight to increase or decrease the size of the text on their smartphone screen. These users almost always have this feature on and adjusted to their preferred text size. When these users navigate to an app that doesn’t support Larger Text, it is, as you can imagine, a very noticeable and disappointing experience. As a designer, you need to consider how text will be displayed when it gets magnified by 200% (courtesy of Larger Text). Pay particular attention to line spacing and kerning - it can look odd, and becomes hard to read when there is too much space between words and lines. Also, if you have any borders or boxes around text, such as on a button, you will have to decide whether to make the box dynamically enlarge along with the text, or to keep the box static. Keeping the box or button static will require you to add an ellipsis to the end of the text, as the copy will outgrow the box. You need to consider what that will look like, and whether it will still be readable and functional (see image).If the iOS app you are designing (or redesigning) doesn’t have this feature implemented already, then make sure it is added as part of your requirements. While you’re at it, the bank you're designing for should also consider adding the ability to bold text as well.For Android phones, Larger Text works out-of-the-box on all apps, but depending on how the app was coded, there may be places where it doesn’t work properly and needs fixing. Test thoroughly to make sure Larger Text is working properly as millions of users rely on this feature every day.
2. Always give users a way out
Figure2.png
In iOS, when VoiceOver is enabled, the iPhone changes how it interacts with the visually impaired user. For example, with VoiceOver on, a user can touch their screen and the feature will tell the user what's there. Swiping left or right highlights elements on the screen, such as buttons. When you interact with an element, a black rectangle appears around it so sighted users can follow along. As a designer, you need to make sure that if a part of your app requires a swipe to work, there is another way to perform that same action without a swipe. For example, there are news apps, which require users to swipe or “flip” the screen to go to the next section or article. By only having the option to swipe to perform an action, someone using VoiceOver will not be able to get to the next section. The user will be trapped on the same article or section with no way out since the app was designed with a gesture-only method for performing that action. If you are going to use a gesture in your design, make sure to add a button - preferably on the same page - that can be used to do the same thing as that gesture. This allows users who rely on VoiceOver and Talkback to perform those same tasks without getting stuck.
3. Don’t kick users out without a warning
Figure3.png
Timeouts in a mobile banking app are an important way to ensure that user information is kept secure. If banking apps didn’t kick their users out after a certain amount of time, anyone with access to the person's phone would be able to hijack their bank account. Designers should keep in mind that users with cognitive disabilities, ranging from dyslexia to dementia, may take longer to complete certain tasks. When an app triggers a timeout due to inactivity, designers should make sure to warn users that a timeout is about to occur. The alert should have a clear message, a countdown clock, and an option to cancel the timeout.
4. If you're accessible, let the people know!
Figure4.png
When someone with accessibility needs uses an app for the first time, many of them head straight for the Help or FAQ section, looking for information about what accessibility features are supported. This is a quick way for users to get the information they need about the app without having to manually test the accessibility features themselves. This is a simple inclusion that a lot of bank apps, and apps in general, fail to include. Be sure to have an accessibility FAQ for the mobile banking app that you are designing for. You should include information about the features that work (VoiceOver, Dynamic Type, Bold etc.), other supported accessibility tools (e-braille), and can also include colour, font sizes, and information on layout. Sometimes the FAQ is located in the settings portion of the app, while in other apps it can be found in its own menu item labelled “Accessibility”. This makes it even easier for new users with accessibility requirements to understand what measures were taken to accommodate their needs.
To wrap it up...
Today, many banking apps are compatible with VoiceOver and Talkback. This is a good start, but those users make up only 20% of the total users with accessibility needs. My parting message to designers: Make sure you don’t forget about the millions of other users whose ability to use technology is impacted - that includes elderly folks, people with cognitive disabilities, people with colour-blindness, those who have affected limbs, and so on. The four accessibility measures mentioned in this article will not make your banking app fully accessible, but they are relatively simple things to implement, so keep them in mind when designing a mobile banking app.