UOB Mighty

Bank. Dine. Pay.

Designing a Mobile Banking + Lifestyle Experience
UOB Mighty allows UOB customers to do mobile banking transactions, explore dining deals, reserve tables at restaurants and make contactless mobile payments.

Role: User Interface Design         Client: UOB         Agency: Aleph Labs          Year: 2015
Challenges
One of the main challenges in designing this app is getting all the different sections—Banking, Dining and Payment—in the app fit well together and feels cohesive.

Bank

Card Concept

We used the card UI concept to display accounts which allows users to quickly get an overview of their accounts. When the card is expanded, the account details are shown.

Form Design

We explored and tested various mobile form designs for key transactions. We reduced the number of taps and steps required as much as possible to make the experience simple.

Dine

Card Concept

In Dining, we use the similar the card concept to display restaurant overviews.

Form Design

We use consistent form elements used in Banking to design the UI for booking a table and rating a restaurant in the Dining section.

Pay

Transactions

Adding a card, making a payment, viewing transaction history and settings.
Usability Testing
We conducted usability testing to make sure users are able to complete transactions and navigate within the app without any confusion or difficulty.
The usability testing was set up in two parts:
01
We outlined a set of tasks for participants to complete for the features which we wanted to test and we observed their interactions. Whenever relevant, we asked follow-up questions to understand the participant’s thought process and behaviour.
02
Following that, we conducted one-on-one interview with UT participants on a range of topics relevant to mobile banking, payments and dining.
Design Style Guide
The objective of the design style guide is to set up a reference point for everyone working on the product on the design components, assets, design specs and the tone of language used for the interface. It helps us to weed out any inconsistencies in the design and make sure we don’t end up with 68 different greys!

section navigation

Section Header

2nd level header

Launched
The first version of the app was shipped at the end of 2015.
“It’s clear that UOB’s latest incarnation of their lifestyle mobile app is the frontrunner compared to the other local banks. I was so impressed that it was relevant to me as a non-UOB credit card holder..”
Money Smart
     Read full review