Designing a Mobile Banking App for the Elderly — a UX Case Study

BTS Bank — UX Design Challenge

Billy Setiawan
9 min readNov 13, 2019

It’s common practice for design candidates to receive design challenges during the interview process. I was provided with a design challenge that I and two other friends, Sarah and Taufik, did during our UX Design course at Purwadhika Startup & Coding School. This concept is mainly intended to identify existing problems and to suggest potential solutions or alternative approaches. So, here’s what we came up with.

BTS Bank, is a mobile banking app that we designed to help the elderly to save, transact, and manage their life and finance. We designed a new mobile banking app that would accommodate the elder’s needs. The challenge was that regular mobile banking app is often made with a design that only caters to a certain age group while neglecting the other. Wouldn’t it be better if there’s an app that presented age-friendly design and functionality that can be easily and successfully used by older adults and other populations?

With the limited time, we had to complete this challenge, we weren’t able to conduct a full Design Thinking process to develop our design concept. However, we developed our own framework that worked for us. We focused first on the problem, then the ideas and solutions generated, and finally concluded with a review of the entire process. By structuring the process step-by-step, it helped us break down the challenge into smaller problems that we could solve one at a time.

We worked together as a team in defining the problem and generating a general solution. However, each of us worked independently for each user flow as follows:

  • I designed the sign-in process
  • Sarah designed the sign-up process
  • Taufik designed the transfer process

1. Specify the End-User

Elderly age 60 and above were given as end-users in the challenge. We narrowed it further to a specific type of elderly who would most likely use a mobile banking app:

Elderly age 60+ who owns and uses a smartphone

Getty Images/iStockphoto

2. Conduct Desk Research

Since our users are based on older adults, it is more challenging to empathize with given their entirely different physical, and cognitive states and designing for their accessibility can get quite technical. To understand more about our user, we did some desk research that provided us with some insights about the user and their needs:

  • People over the age of 40 are more likely to experience presbyopia, or long-sightedness, which makes reading small text challenging
  • Color vision problems in the blue-yellow spectrum (tritanopia) are often detected among people in their mid-70s
Source: EyeQue
  • Between the ages of 55 and 65, hand-eye coordination and motor skills tend to decline, and this can make it harder to interact with UIs
  • Elderly are reluctant to go outside the house due to difficulties they might encounter when traveling, including distance and safety
  • Many elderlies find the internet too difficult and of those believe that they are “too old to learn”
  • Elderly requires a step by step approach at a slower pace while the cognitive structure of millennials enables them to process multiple information at once

3. List Desired Outcomes

The following are the expected outputs from the BTS Bank app based on the user needs:

  • Provide minimal design to accommodate different physical and cognitive conditions
  • Provide enough information for easy to use interface
  • Displays only feature that is essential for the user
  • Has a simple and easy navigation
  • Motion control that is accessible

4. Brainstorm Design Solutions

Competitive Analysis

To determine what kind of features to put on our prototype, we did some competitive analysis on two mobile banking apps, BCA Mobile and Jenius. Here’s the highlight of features from each app that we liked:

Picture: Competitive Analysis of “BCA Mobile”
Picture: Competitive Analysis of “Jenius”

Design Guide

In order to have a consistent design on each of our own user flow, we first came up with a small design guide consisting of the elements and components we would use to build our prototype.

The design guide consists of information like:

  • Colors
  • Font Family
  • Icons
  • Button style
Picture: Design Guide

Our goal is to create an app design that is accessible and user-friendly for all ages. Readability remained as our focus throughout all our design:

  • We used high contrasting colors to make it easier for our target user to read. Older adults are more likely to struggle to see all the items clearly on a more complicated background. The main rule of thumb is that our user should not have any trouble recognizing between colors
Color: White on Blue
Color: Blue on White
  • When it comes to font size, we used a font size that is not smaller than 14 points to make it easier for older adults to read
  • We provided the same attention to the font type for readability. Default fonts, like “Roboto”, usually are the easiest to read
  • We provided large enough spaces between interactive elements, such as buttons, so that users can click on or tap the correct item. This rule holds true, especially in cases when there are more than one interactive elements on a page
Large spaces between each of the bank features

5. Generate User Flow

The goal is to create a clear and simple flow to help the elderly get from the sign-up process to transfer without any difficulties.

Picture: General Task-Based Flow
Picture: User Sign-up Task-Based Flow

6. Sketches

The user flow we created in the previous step made sketching the screens a lot easier because we identified clearly the main actions that the user needs to take in order to complete their objective.

Our goal with the sketches was to quickly jot down any design ideas knowing that we’ll probably make some more changes when we create more detailed wireframes.

Picture: Paper Prototype

7. Wireframes

Picture: Wire-flow for Sign-in process

Remind your user Why

Your user should always know why they downloaded the application, and know why they are using your app even before figuring out how they are going to use it.

When they are opening your app for the first time, you should remind them what the app is actually doing and how it is going to help them.

Picture: Onboarding Screens

At BTS Bank app, I am using a basic carousel to present the app features. If you choose a carousel layout as I did, make sure to put the most important features on the first slide, it’s probably the only one the user will look at.

One Screen, One Action

Always remember that “less is more”. I want to make it as simple as possible for the elderly to understand what they should do on that screen. Keep it simple, focus on an action, a screen should be designed to maximize the result; one screen, one action.

Picture: Sign-in Screen

It should be clear where the user has to click, in the screen above, I am using a big Call To Action (CTA) button.

CTA Button: “Enter”

Easy Sign-in

Most applications today have one great drawback such as complicated Sign-in screen. I don’t want our target user, the elderlies, to have to provide so much information that might confuse them without a clear understanding of the reasons for doing it.

In an effort to make it easier for the elderly to get into the app while still providing them with the maximum account protection, I decided to implement the Touch ID feature on our app.

Picture: TouchID Screen

8. Define Success Metrics

The list of desired outcomes we defined, in the beginning, came in handy again in this process. I personally wanted to measure the success of the sign-in flow that I made by how well it can accommodate the objectives that the users are expecting.

Some metrics I wanted to measure includes:

  • Number of users who read through all the onboarding screen
  • Number of successful logins through the Touch ID feature
  • Reduced number of users who forget their password

9. Concept Testing

We gathered the feedbacks through user testing with 6 representative users. We found out that our representative users still experience problems while using the app. Here are some insights that we gathered from the user testing specifically for my design:

  • Although the signing in using your fingertips is very convenient to simplify their sign-in process, many elderly are not familiar with the concept of Touch ID. From our survey, although they are open to the idea, they need someone to explain how Touch ID works the first time they use it.
  • Not many of our representative users scroll through the onboarding screen. Some of them don’t understand what the onboarding screens are for. I would consider adding more text or description on the onboarding screen for better accessibility.
  • For the Forget Password screen, many elderly were opposed to using email as a method of password recovery since they are unsure if they would remember their email address. I would consider adding a call center feature or answering security questions as an alternative to entering an email address.

View the Prototype!

Key Lessons

I learned a lot from this design challenge:

Be fast and flexible

Most of the time during an interview, you need to come up with something fast and with limited information. Being fast and flexible with ideas and assumptions really helped me conceptualize a solution in a short period of time.

Define goals early

Having a good understanding of the user’s expectation would act as a guideline for your research phase and it would greatly increase your effectiveness.

In Conclusion…

Have you noticed the lack of something in the case study so far?

Yes, you’re right — user research!

At this point, the lack of user research was the elephant in the room. Just like what you would normally encounter during an interview, you don’t have the chance to conduct user surveys. So far, the design solution was built on top of a few assumptions that hadn’t been validated yet.

What could I have done better?

  • Given the opportunity, I would have done a deep dive into researching more about the key solutions offered here by interviewing users and conducting a survey to validate our initial assumptions
  • Read more on design features and guidelines that would help elders use a mobile app
  • Test, test, and test. Since the target users are pretty specific, I would try to incorporate user testing in every step of the design process

Here are some of my classmates' reflections on the case study: Sarah Alfiani’s version & Taufik Efendi’s version.

Clap 👏🏼 for the article if you find it interesting, and share it with your friends. This will motivate me to make more!

If you have any feedback, I’d love to hear from you. You can reach me at billyapsetiawan@hotmail.com or my LinkedIn

--

--

Billy Setiawan

Bringing empathy and perspective through experience and interaction design.