Modernizing Heritage Bank's Mobile Experience For The Next Generation of Users
2023
Mobile, Banking, Fintech
Team
2x
Product Designer
1x
User Researcher
1x
Product Manager
2x
Mobile Developers
2x
Backend Developers
Timeline
May ‘23 - Jan ‘24
A bit of context...
Heritage Bank is one of Nigeria’s commercial banks with over 2.3M depositors. Its mobile banking app had grown outdated, with clunky navigation, poor onboarding, inconsistent design, and no dark mode. These issues left users frustrated and stakeholders dissatisfied.
My Role
As lead product designer, I owned both UX and UI. I began with a UX audit and preliminary report, analyzing 200+ App Store reviews and benchmarking leading fintech apps. This revealed that onboarding and transfers were the biggest sources of frustration, while competitors set higher standards for navigation and clarity.
Guided by these insights, I redesigned onboarding flows to reduce early friction, introduced a token-based design system for scalability, and restructured navigation to bring core actions within one or two taps.
Impact & Results
10k
Downloads in 1st month
97%
Unassisted onboarding
60%
Reduction in TTV
Onboarding
I redesigned the onboarding experience to distinguish between new users, returning customers, and Padie users. The new flow reduces friction and clarifies next steps with minimal cognitive load.
New users can setup a profile with an account number and OTP
HB Padie users onboarded using their existing credentials, but will create a transaction PIN and set seceurity questions.
Returning users can login and jump right get back into it. Subsequent logins can be done with biometrics
A New Home & Navigation
The Home screen was restructured to showcase relevant shortcuts like transfers, bills, and account history, making frequent actions more accessible.
I introduced a bottom navigation bar featuring the most-used sections; Home, Transactions, Self-Service, and Profile.
Do More with Heritage Bank showcases relevant shortcuts like transfers, bills, and account history, making frequent actions more accessible.
Transfers in Few Clicks
I added intra-bank and interbank transfers as separate shortcuts on the home screen for easy access. Repeat transfers can be done with quick access to recent recipients.
Intrabank Payments can simply setup a profile by inputing their account number and verifying with OTP
Inter bank Payments can simply setup a profile by inputing their account number and verifying with OTP
Multi-Theme Compatibility
I created a component-based system using tokens for colors, spacing, and typography, making it easy for engineers to switch themes or introduce new modules. The system is structured for easy maintenance and updates.
Figma Variables, Tokens, & Components
I created a component-based system using tokens for colors, spacing, and typography, making it easy for engineers to switch themes or introduce new modules. The system is structured for easy maintenance and updates.
Design System
Figma Variants & Components Library
