Personal UI/UX Case Study · Mobile Banking App
OneBank — A Safe, Simple, and Modern Mobile Banking Experience
About project
About OneBank
Onebank is a personal UI/UX design project focused on simplifying everyday online banking. The goal was to create a mobile banking app that feels safe, easy to use, and visually reliable, while maintaining a modern and premium look.
This project was designed for both iOS and Android, with a strong emphasis on clarity, consistency, and user confidence.
This is a personal UI/UX case study project, created to explore better design solutions for modern digital banking.
Although there was no external client, I approached the project as if working with a real banking product—balancing business needs, user expectations, and usability best practices.
Background
Most banking apps today suffer from overloaded features, confusing flows, and inconsistent branding, which often leads users to feel uncertain or frustrated—especially when handling sensitive financial transactions.
As someone who regularly uses online banking for daily transactions, I noticed how poor UI decisions can directly affect trust and usability. This project was born from the idea that good banking experiences start with good design.
My Role
UX/UI Design
Tools Used
Figma & Photoshop
Industry
Banking App
Duration
3 weeks, on-going
Project Goal
The main goal of Onebank was to:
- Reduce user pain points and errors
- Simplify complex banking flows
- Improve clarity and ease of use
- Deliver a clean, modern, and trustworthy UI
Rather than adding more features, the focus was on making essential actions easier and more intuitive.
Challenges
Designing a banking app comes with unique challenges:
- Complex user flows due to multiple banking features
- Too many functions that needed to be grouped logically
- Ensuring clarity without overwhelming the user
- Maintaining a sense of security through visual design
Balancing functionality and simplicity was one of the biggest challenges in this project.
Challenges
To address these challenges, I focused on clarity over aesthetics, without sacrificing visual quality.
Key solutions included:
- Creating a design system to ensure consistency across screens
- Grouping related features to reduce cognitive load
- Running repeated A/B testing to validate layout and flow decisions
- Prioritizing frequently used actions like checking balance and sending money
Every design decision was made to help users feel confident, safe, and in control while using the app.
Design Guide
Wireframes
Before moving to high-fidelity designs, I explored mid-fidelity wireframes to validate structure, flow, and usability by focusing on:
- Information hierarchy
- Feature prioritization
- Screen-to-screen flow clarity
Design Guide
Visual Style & Design Direction
The visual direction of Onebank is modern, clean, and premium, designed to communicate trust and reliability.
Design principles:
- Minimal layout
- Clear typography
- Balanced spacing
- Accessibility-focused color contrast
Design Guide
Components & Design System
Consistency plays a critical role in building trust. If a banking app looks inconsistent, users may subconsciously feel that the service itself is unreliable.
A reusable component system was created to maintain consistency across the app, including:
- Buttons
- Input fields
- Cards
- Modals
Design Outcome
Final UI Design
The final design consists of 10–24 core screens, including key flows such as:
- Home dashboard
- Sending money
- Transaction overview
This version represents the first complete iteration of Onebank and serves as a strong foundation for future improvements.
Career Growth
Key Learnings
This project helped me strengthen my skills in:
- Building scalable design systems
- Using Auto Layout efficiently
- Applying A/B testing in UI decision-making
- Designing with clarity and consistency as top priorities