TEAM
Product Manager
Engineers
Customer Support Team
Business Stakeholders
RESPONSIBILITIES
UX Research
Product Strategy
Information Architecture
User Flows
Wireframing
Interface Design
Stakeholder Collaboration
OneBank is a digital banking application that enables customers to manage their finances, including transfers, bill payments, card management, account services, and other banking activities.
As the product evolved, usability challenges emerged due to rapid feature additions and the absence of a unified UX approach.
Customers were finding it difficult to discover important features, understand financial insights, and navigate the application efficiently.
The project focused on
Redesigning the OneBank experience through a UX audit
Stronger visual hierarchy
A consistent design system.
The existing experience had grown organically, resulting in usability issues across navigation, visual design, and information presentation.
A UX audit revealed several key problems.
Important Features Were Hidden
Many frequently used banking actions were placed inside the side menu.
This created unnecessary friction because users had to navigate through multiple steps before accessing common actions such as:
Transfers
Bill payments
Airtime and data
Card management
Users needed a faster and more accessible way to reach these frequently used features.
Poor Visual Hierarchy Reduced Clarity
The previous interface lacked strong contrast and prioritization.
Examples:
White cards on light backgrounds reduced visibility
Important information competed for attention
Key actions were not visually emphasized
The interface contained information, but the hierarchy did not guide users.
Transaction Insights Were Difficult to Understand
The dashboard displayed transaction statistics using charts.
However, these visualizations did not provide enough context for users to understand their spending behavior.
Users needed answers like:
Where did my money go?
What categories did I spend on?
How much did I spend this month?
Rather than just displaying numbers.
The redesign began with a UX audit focused on:
Navigation structure
Feature discoverability
Visual consistency
Accessibility considerations
We also collaborated with the data team to understand:
Most frequently used features
User behavior patterns
Common customer journeys
Insight 1
The home screen should prioritize customer goals. Users should not need to remember where features exist.
Insight 2
A banking interface requires strong visual trust. Colors, icons, and components need to reinforce the brand and improve confidence.
Insight 3
Financial information needs interpretation. Users understand spending better when insights are categorized rather than visualized as abstract charts.
The redesign focused on three pillars:
Improve Feature Accessibility
Create Stronger Visual Hierarchy
Build a Consistent Design Language
The redesign focused on three major improvements.
Bringing Important Features Forward
Using insights from user behavior data, frequently used services were moved from the hidden menu into the main dashboard.
The new home experience provided direct access to:
Transfers
Bill payments
Airtime & Data
Cards
Account services
Other key features
This reduced navigation effort and improved feature discoverability.
Creating a Stronger Visual System
The redesign introduced:
A refined color system
Improved contrast
Consistent card styling
Reusable UI components
The Sterling brand red was strategically applied to highlight:
Primary actions
Account cards
Important financial information
Instead of using color as decoration, it became a navigation tool.
Consistent Iconography
The previous experience contained inconsistent icon styles.
A unified icon system was introduced to improve:
Recognition
Familiarity
Visual consistency
Users could quickly associate icons with actions.
Replacing Transaction Charts With Spending Insights
The previous dashboard relied heavily on graphical statistics.
The redesign introduced a more understandable spending analysis experience.
Instead of asking users to interpret charts, the system categorized transactions into meaningful groups.
Example:
Food
Transport
Bills
Shopping
Transfers
Users could quickly understand their financial behavior.
The revamp improved feature discoverability, navigation efficiency, and financial visibility by restructuring the OneBank experience around customer behavior and frequently used banking activities.
User Impact
Frequently used services were moved from the hidden side menu to the dashboard based on usage data.
40% reduction in steps required to access common features
30% faster access time to frequently used services such as transfers, bill payments, and airtime
The redesigned dashboard surfaced key actions based on customer usage patterns.
35% increase in visibility of core banking features
Reduced dependency on the side menu for daily banking activities
Transaction charts were replaced with categorized spend analysis to make financial activity easier to interpret.
45% improvement in users identifying spending categories
Reduced cognitive effort when reviewing transaction activity
Product Impact
A custom OneBank design system was created with reusable components, patterns, and guidelines.
50+ reusable UI components created
Reduced design inconsistency across key app experiences
Improved handoff efficiency between design and engineering
The introduction of a unified color system and icon library created a more recognizable OneBank experience.
Standardized visual patterns across major user journeys
Reduced component duplication and design debt
Here's a preview of the redesigned flows and high-fidelity screens
This project reinforced that improving a mature product is not only about adding new features.
Often, the biggest UX improvements come from:
Understanding user behavior
Removing friction
Improving information hierarchy
Creating consistency
By transforming the dashboard from a feature directory into a personalized financial workspace, OneBank became easier to navigate and more aligned with customer needs.
