top of page

Project: MyBank

Online Banking Experience

In this sample engagement, I provide a review of an online bank and create a user experience that engages customers to help them set up savings goals.  As part of this UI Project, I developed high-fidelity wireframes, clickable prototypes, and user flows for the mobile website to enhance user engagement and increase conversion rates.During the iteration, user testing also identified other areas for improvement. 

Mobile Web: Savings Goal Tool
 

  • Problem: The research found that a significant portion of people wanted to save, but had difficulty maintaining a budget. A key aim of MyBank was to allow users to create separate money buckets. This enabled them to save either for fun items, such as a new phone or sunglasses, or larger items, such as home deposits. By doing this, the user would have more control over their spending and have better visibility into what they're spending.  Through extensive research, however, we found that there were more critical barriers when navigating the site and setting up a savings goal.​

​

  • Process: To better understand the user we need to know what might motivate them to save.  For example, items they would likely be saving for and whether they found using an online tool beneficial to them. We conducted competitor analysis to identify their competitors and market research to identify interface design trends in the online banking sector.
    We conducted ten interviews and usability testing.
    Through affinity mapping and user journeys, we gathered all the information and synthesized several root problems and potential solutions.

Beach Parasols

Insights from Affinity Mapping

Simplify Menu Access

Often users struggled to find the top menu and found the location confusing.

Allocate Funds to Savings Goal

The oversized display of the account balance led to user concerns regarding the security of their information.

Improving Statement Visibility

The user was unable to see their statements in the top menu navigation.

Account Balance Display

The oversized display of the account balance led to user concerns regarding the security of their information.

Research

In our user research, we found that avid online bankers would like the option of allocating funds toward saving goals to an account of their choice. This helped users focus on their goals by showing their savings progression with a percent value.

​

Customers also like to personalise their saving goals by adding labels and saving completion dates.  In this way, the user could become more active in their saving goals.

3 Wireframes of the Saving Goal, Low fidelity, Mid fidelity, high fidelity

Getting more relevant product information

​

We centred our biggest decisions around:

  • How to make the navigation menu easier to access

  • How to visually make the savings tool easy for the user to use

  • What key features would need to be added to make this interface easy to use

  • Adding the ability to choose an account from which to transfer funds

Key features

(L) Current Website - home screen  (R) Redesign Home Screen

Saving Made Simpler

Recommendations

(L) Current website Saving Goal section  (C) Saving Goal account section with option to select account  (R) Redesign

Redesign

  • Move the menu location to make the navigation easier for users to find

  • Add a percentage calculation to the Savings Bucket to illustrate the progress of saving

  • Implemented the option to choose the account for transferring funds towards savings goals.

High Fidelity Screen, Slide out menu, Landing Screen, Savings Goal Screen

Redesign  (L) main menu   (C) Landing page  (R) Savings Goal page

What next...

As we explore the different ways online banking has changed, we are looking to create more functional experiences to allow users more control over managing their daily banking needs.

With bank branches urging their customers to bank online, mortgage information should also be readily available online for the customer to access.  

bottom of page