Project Overview
BudgetBe is a fintech mobile application designed to simplify financial management by helping users track expenses, set budgets, and make informed investment decisions. The app prioritizes ease of use, accessibility, and clarity, ensuring that both beginners and experienced users can manage their finances effortlessly.
Project Duration
5 Weeks
Tools
My Role
UI Designer
Problem Statement
Managing personal finances is challenging, especially for individuals with limited financial knowledge. Many financial management apps are complex. It is difficult for users to track expenses, set budgets, and make informed decisions. There is a need for a simple, intuitive, and accessible solution that empowers users to take control of their finances with ease.
Goal
The goal is to design BudgetBe, a user-friendly and intuitive fintech app that empowers users to manage their finances efficiently and make informed investment decisions. The app will prioritize simplicity, ease of use, and accessibility while addressing users’ pain points and needs. By tackling these financial challenges, BudgetBe aims to provide users with a seamless, stress-free, and secure experience.
Design Process
User Persona
Sarah
28 years old
Profession: Software Engineer
Education: Bachelor’s degree in Computer Science
Description:
Sarah is a detail-oriented software engineer who enjoys solving complex problems. While Sarah is skilled in logical thinking and planning, managing personal finances feels like an entirely different challenge. With a busy work schedule and a love for staying up-to-date with the latest tech trends, Sarah values tools that simplify and streamline processes. She is eager to build financial security, particularly by optimizing savings and exploring beginner-friendly investment opportunities.​
​
Goals
-
Efficiently manage her finances with minimal effort.
-
Make informed investment decisions that align with her goals.
-
Save time and reduce stress associated with financial management.
-
Access financial services conveniently from her mobile device.
​Frustrations and Fears
-
Overwhelmed by the complexity of financial systems and investment options
-
Struggles to stay organized and keep track of multiple accounts and payment methods
-
Lacks financial literacy to make confident investment decisions.
-
Limited free time for active financial management.
Motivations
-
Simplifying financial management through user friendly tools.
-
improving her financial literacy to feel empowered in decision-making.
-
Using secure and reliable financial services tailored to her needs.
By addressing Sarah’s pain points, Budget Bee can offer her a simple, user-friendly solution for budgeting and investing. The app can guide her step-by-step, saving her time and reducing the stress of financial management while empowering her to make informed decisions.
Site Map
We sketched the app’s skeleton to ensure that every feature—from budgeting tools to investment guidance—was logically placed and accessible. At this stage, the focus was on functionality and intuitive navigation.
Low Fidelity wireframe
After conducting research and developing user personas, the next step was to design the low-fidelity wireframes. These wireframes were created to establish the app’s structure and flow, focusing on functionality rather than visual aesthetics. The purpose was to translate user needs and goals into a clear, organized framework that outlines the app’s navigation and core features.
Style Guide
Once the low-fidelity wireframes were finalized, the next step was to create the style guide. The style guide serves as a visual reference to ensure consistency throughout the app’s design. It includes key elements such as the color palette, typography, iconography, and button styles. These design choices were made with the user personas in mind, focusing on creating an interface that is visually appealing, accessible, and easy to navigate.
Typography
High-Fidelity Prototype
This stage focused on a clean, modern, and intuitive style while ensuring a seamless user experience. Visual elements like typography, color schemes, and icons are refined for both aesthetic appeal and functionality. Accessibility considerations, such as legible fonts and intuitive navigation, ensure the app is user-friendly for a diverse audience.
Easy and secure authorization
Security is crucial in financial applications. BudgetBe ensures a safe experience by requiring a special code for login, with the option to use Face ID/Touch ID for convenience.
Improved Accessibility
We replaced encrypted names and random icons with recognizable logos and clear names. This change has brought greater clarity to the transaction list, enabling users to quickly scan and understand their transactions without extra effort. Additionally, incorporating text labels alongside icons further enhances accessibility by ensuring that all users can easily identify and navigate the app’s features.
Conclusion
BudgetBe provides a streamlined and intuitive solution for personal finance management. By prioritizing simplicity, accessibility, and user-centered design, the app empowers users to take control of their finances with confidence. Through thoughtful UI design and research-driven decision-making, BudgetBe delivers a seamless experience that reduces financial stress and enhances user engagement
