Revo
UI Design, Systems Thinking & Visual Rationale
This project formed part of my Professional Certificate in UI Design. The brief was to design a modern banking interface that feels simple and reassuring, while still adding a bit of personality. I was asked to create three key screens across different formats and show how my visual choices supported both usability and brand principles. Alongside the design work, I also had to produce a reflection document explaining my reasoning and what I learned throughout the process and was awarded 90% for the final submission 🏆
Project Overview
The goal of this project was to design a mobile banking experience that helps users understand their money quickly and feel more confident managing it. I focused on three key areas of the app: a My Accounts screen that brings all accounts together in one place, a Current Account screen that lets users clearly see their most recent activity, and a My Spending screen that helps people visualise where their money is going and how they’re saving.
Before jumping into design, I spent time researching the wider mobile banking landscape to understand what works well, what feels confusing for users, and where there are opportunities to do better. I also created moodboards to explore tone, colour, typography and layout direction, which helped shape the overall feel of the product and ensure it felt both trustworthy and engaging.
Problem & Goals
For this project, the main problem I was trying to solve was the fact that many mobile banking experiences still feel complicated, overwhelming and difficult to understand at a glance. Users often have to dig through multiple screens to find simple information like what they’ve spent, what’s left, and whether anything needs their attention. This leads to confusion, frustration and, ultimately, a lack of confidence when managing money.
The goal was to create an experience that feels simple, reassuring and genuinely helpful. I wanted users to be able to open the app and quickly understand their financial situation without having to work too hard. That meant focusing on clarity, hierarchy and meaningful visual feedback, while also supporting more detailed exploration when needed. My aim was to help people not only see their money, but actually understand it and feel more in control of it.
Users & Research
For this project, I started by thinking about the kinds of people who would be using the app and the different relationships they might have with their money. Some users check their accounts daily and like to stay on top of every transaction, while others only dip in occasionally and mainly just want reassurance that everything is okay. I also considered users who may feel anxious or unsure about banking apps and need clearer guidance and reassurance.
To inform the design, I looked at a mix of competitor banking apps, design patterns and usability critiques to understand where people typically struggle. I paid particular attention to how information was structured, how balances and transactions were presented, and how clearly spending insights were explained. I also reviewed feedback and common issues discussed in app store reviews and forums, which helped highlight recurring frustrations such as cluttered layouts, confusing terminology and too many steps to complete simple tasks.
This early research helped me build a clearer picture of user expectations, pain points and behaviours, and it shaped many of the decisions I made around simplicity, clarity and consistency throughout the design.
Mapping the Experience
Once I had a clearer understanding of users and the challenges they face, I started mapping out what their ideal journey through the app might look like. I wanted to understand what someone would typically come in to do, what questions they might ask themselves along the way, and where confusion might naturally creep in.
I walked through scenarios such as checking a balance, reviewing a recent transaction, understanding why a balance looked lower than expected, and getting an overview of spending for the month. By sketching these flows out, it became easier to see where information could be streamlined, where shortcuts might help, and where unnecessary friction could be removed.
This step helped me ensure that each screen had a clear role in the bigger story, rather than existing as isolated designs.
Ideation & Concepts
With the flows in place, I began exploring different ways the interface could communicate clearly without overwhelming users. I experimented with variations of layout, hierarchy, spacing and tone, trying to find a balance between being informative and staying simple.
I explored multiple directions for key screens, such as different card-based layouts for accounts, several styles for transaction lists, and different visual approaches to displaying spending insights. Throughout this stage, I tried not to get too precious about any one idea and allowed myself to test and discard concepts freely.
This phase was really about openness and exploration, making sure I didn’t jump too quickly into a single solution.
Information Architecture & Flows
From there, I refined the structure of the app so that navigation felt predictable and logical. I focused on making the most important information accessible within as few taps as possible, while still maintaining a sense of depth for users who wanted to dig deeper.
Key flows such as moving from an overview into a specific account, or transitioning from transactions into a deeper view of spending, were carefully designed to feel smooth and intuitive. I also considered edge cases like empty states, pending transactions and unusual activity, ensuring the interface could still communicate clearly in less typical situations.
This work helped anchor the experience in a framework that felt organised, calm and easy to learn.
Final Screen Design
Before moving into the individual screens, I focused on creating a visual system that would stay consistent across the whole experience. My aim was to design layouts that feel calm, structured and easy to understand at a glance. I paid close attention to spacing, typography and colour so that important information stands out naturally, without the interface feeling noisy or cluttered. Each screen builds on the same foundations, but is tailored to support the specific task the user is trying to complete.
My Accounts Screen
The accounts overview needed to give a quick snapshot without overwhelming the user. I designed cards that clearly differentiate between account types and balances. Important numbers are prioritised visually, while secondary details are available but quieter. My intention here was to make the experience feel calm, organised and easy to scan at a glance.
Current Account Screen
The Current Account focuses on transaction clarity. I worked on spacing, typography and icon choices so that each transaction is readable and understandable. Categories, labels and amounts are visually separated to reduce cognitive load. I wanted this screen to feel familiar while still cleaner than many traditional banking apps.
My Spending Screen
The My Spending screen was about turning data into something meaningful. I introduced charts and simple visuals to show where money is going over time. I focused on keeping the visuals honest, not decorative. Users should be able to glance at the screen and instantly understand patterns and trends without needing to decode the interface.
Reflection & Further Qualification
I was pleased with the consistency across screens and the balance between friendliness and trust. The main challenge was deciding how much data to surface without overwhelming the user.
If I had more time, I would expand testing, explore accessibility in more depth and refine interaction details based on real behaviour. I would of loved to have looked at other forms of user interaction and pain points to further expand this project! You can view the Figma File here.
Following this project, I went on to earn a qualification with the UX Design Institute in Designing for Accessibility. This allowed me to deepen my expertise in creating inclusive, accessible interfaces that meet diverse user needs while maintaining clarity, trust and usability.
