Mobile Banking App

Designing a Mobile Banking app for HSBC

Client

HSBC

Project dates

 Feb 2015 –  June 2016

Platform

iOS

Project Summary

  • Define the mobile banking experience for HSBC customers in the UK and Globally.
  • Develop mobile-first features for customers to complete core banking tasks.
  • Design patterns which were thoroughly tested via an external agency were then detailed in a reusable component library.

Alongside a Visual Designer and Developer we produced an animated demo for a mobile banking experience as part of our pitch to HSBC. We won the pitch which subsequently turned into a huge project for the agency. I became Lead UX for the project working in quite challenging circumstances to scale up a team and deliver work to HSBC’s development teams.

define_icn
design_icn
test_icn

UX Strategy

An initial workshop with key stakeholders helped establish the priority user journeys and KPIs to focus our design sprints and roadmap. Working in cross-functional sprint teams assigned a particular a user journey we unpicked the current user flows in order to try and optimise them. We established a framework for states, layers, page types and journeys within the App.

 

User flows

Design system

Design patterns were transposed into a component library, using an atomic design framework, for consistency, scalability and ease of going into development.

Design prototype

Tap anywhere on the screen to advance through the demo

Results

  • Streamlined and improved core journeys … logon, account management, payments, transfers
  • Established a Design system for HSBC mobile Apps.
  • Established interaction and animation behaviours.
  • Worked in agile cross-functional teams to rapidly adapt to new priorities and features.
  • Delivered accessibility compliant front-end components as code to HSBC software delivery teams.