Online Banking

As part of a UX team made up of agency and client-side designers, over a span of six months I helped to design a next-generation online banking solution for a major bank.

The focus was on delivering a unified experience across mobile, tablet and desktop and to get buy-in from all the internal stakeholders. Because the bank delivers a high-touch, concierge like experience, there was also a strong emphasis on user testing and gathering real customer feedback throughout the process. Our efforts involved requirements gathering, discovery, competitive analysis, paper prototyping, wireframes, interactive prototypes in Axure, writing test scripts and conducting and reviewing in-person and remote usability testing.

Mind Map

At the beginning of a user experience project I often like to get in the mind of a user by creating a Mind Map. For the online banking project, I wanted to understand why a user is coming to the banking app in the first place – what are they thinking? Nobody opens up a banking app for no reason, they’re always looking to find some information or to complete some task. By creating the Mind Map I was able to identify the top ten reasons why a user would open the app which would help to identify use cases for moving forward. It also helped me to identify common use cases that we could possibly automate, relieving the user of some responsibilities.


Mind Map representing user of banking app

Where’s that check?

One of the ideas I focused on was Recent Activity. This was built on the notion that many users come to the banking app to find some quick info like “Hey, did that check clear yet?” or “Did I transfer that money to my sister?”. The approach I developed was built on cards – each transaction represented by a card showing the most pertinent details of the activity, including the Status of the activity and the ability to View More. The cards would show up on the Homepage alleviating the need to drill down into individual accounts to search for the information. I built an interactive prototype in Axure that illustrated the feature and tested it on The results were very positive with most users being able to complete the tasks with ease. When reviewing the design with the back-end technical team there were some concerns about exactly what Status information their legacy database could provide in real time so we had to account for that in the way we phrased our messaging.


Tablet Dashboard showing recent banking activity

What’s important for mobile?

As we designed for mobile devices we kept in mind that it’s not just a smaller screen that the user is interacting with, but also what they’re trying to accomplish is often different on mobile. Most users are comfortable checking balances on mobile devices (as long as no one’s looking over their shoulder on the subway!) but when it comes to more complex use cases, like reviewing monthly statements, many prefer to do it on a larger screen with a keyboard. And the top five reasons for opening the desktop website may differ from the top five reasons for opening the mobile app. That said, many users these days expect that all functionality should be available on all devices, even if it’s less than ideal on a small screen. As we explored these use cases, we designed and tested different mobile dashboards as shown below.


Concept for Mobile Dashboard

DIY versus Human Touch

The bank prides itself on providing superior service to its customers. This means that they see many customer problems as opportunities to reach out to the customer and help them directly. In many application (perhaps most) the goal is to reduce customer care requests so this was an interesting challenge in our designs. One way we tried to bring the human touch to the digital device was to incorporate the personal banker and personal team with most functionality. We wanted the customer to feel like they could just say “Do it for me!” and things would get done. We also presented direct phone numbers and one-click calling to contact personal bankers.