UX, UI, Product Design Lead, UX Research, iOS App Design
First Direct App Onboarding
My role
UX and UI Design lead
UX Designer
User Researcher
Tools
Sketch
Invision
Platform
iOS
During my time as Product Design Lead at HSBC I led the design of the onboarding app for the UK challenger bank, First Direct. I worked in a cross functional team of developers, user researchers, ux writers and product managers taking designs from concept stage through to rapid prototyping and testing.
Goals
Create an account on-boarding experience that meets target customers needs and expectations of a challenger bank
Strengthen the brand loyalty
Drive an increase in account opening journeys for First Direct
Outcomes
Reduced errors with improved question set layout
Cognitive breaks in the journey made the experience more delightful for users. Qualitative testing shows the new onboarding journey felt quicker
Reduced the question set for users by working closely with business, legal and compliance
First direct onboarding app (iOS) design
A test and learn, human centered approach
I worked to create a new, more seamless onboarding journey for the app and working closely with a user researcher and a ux writer, I took the account opening journey design through 3 rounds of users testing to refine and test the user journey, design language and tone of voice.
Iterative testing
Concept and iterative testing pushed boundaries with question sets, language, app features and flow
We utilised a mix of quantitive and qualitative research, surveying over 600 adults and conducting 42 in depth interviews
Research highlighted the demand for ‘fin tech like’ experience backed by a trusted bank
Testing showed that flow and language elevated the brand as modern and innovative
Bold, creative design
A playful tone of voice helped to make the experience more delightful
Bold, bright illustrations help break up the user journey
Initial (optional) introductory screens allow a space to show off the brand
Human centric, helpful UX
Laying the onboarding questions out on separate pages proved to reduce errors and make account opening feel easier and quicker
Cognitive breaks in the journey makes the experience more delightful for users and was shown to make it actually feel quicker during user testing
I worked with the business team to reduce the question set for users and so help improve the onboarding experience
Concept testing
Concept testing
Journey Mapping
First, I spent time to understand the customer through research and ran workshops to collaboratively define the problem and began brainstorming ideas.
I worked on initial concepts which I prototyped and tested early with customers.
I used customer feedback to ideate and test further iterations. From here I began to converge; aligning with business and technical requirements, staying customer focused testing and iterating the end to end journey with customers.
Wireframes and User Journey
Reducing onboarding time
I worked to create a new, more seamless onboarding journey for the app and working closely with a user researcher and a ux writer, I took the account opening journey design through 3 rounds of users testing to refine and test the user journey, design language and tone of voice.
The design uses chunking of the questions to lessen frustration, cognitive breaks in the flow to help users pause and celebratory delight moments to help users move to the next set of questions with ease.
I then worked with wider stakeholders to reduce the question set as much as possible to make the journey quicker and easier for users. This included removing any product upsell from the account opening to really streamline onboarding for users. Once the users goal of opening an account has been achieved, they can apply for additional products such as savings, credit cards and overdraft inside their app.
MVP UX and UI Design
In app overdraft application journey (I worked with business to remove this from onboarding)
A blueprint for onboarding
Thanks to the strong test and learn approach (including 3 rounds of user testing), this approach to onboarding UX and UI at First direct has since been implemented in product application journeys at other application journeys across First Direct and HSBC. This was a really fun and collaborative project for myself and the team.
Final UI
