Zebb

Project shipped ✅ The app is currently in the development phase.

From concept to MVP development. I designed and delivered an end-to-end solution for a B2C financial budgeting mobile app that minimized the cognitive load of managing budgets.
duration
3 months | 2024 @J3C
Tools
Figma, Adobe Illustrator
Teams
1 Product Manager, 1 Engineer

◦ About Zebb

Overview

Zebb is a financial budgeting app that addresses the issue of cognitive overload by simplifying budgeting, helping users optimize their spending to reach their financial goals effortlessly.

◦ About My Role

Product Design Intern

As the sole designer for this project, I led the end to end design direction of a financial budgeting app from concept to MVP development. The scope of my work included research, ideation, iterations base on research and stakeholder feedbacks, prototype, and user testing.

◦ Problems amongst Budgeting Apps

◦ Research Insights

Engagement reduced due to complex user flows

People are anxious about seeing overspending insights due to the complex budget management amongst the budgeting apps, leading to a lack of motivation to make a budget.

◦ MVP Highlights

Simplified Onboarding Flows

Onboarding guides users to connect their bank accounts via Plaid to help verify their bank accounts and eliminates the redundant process often found in other budgeting apps for users to manually add transactions.

My research study indicated a preference for previewing app features first for new users. I added a 'Skip' option for users to explore without connecting their bank accounts immediately.

Reduced Cognitive Load

Base on the IOS Swift Charts feature, I conducted a simple usability testing and found out that employing a vivid, color-coded interactive donut chart can minimize the cognitive overload.

Users can select a section, which then becomes highlighted, while other sections subtly fade. The categorization list section also allows users to easily identify and navigate through categories with minimal effort.

Create a Budget Goal based on related Merchants

In the "Goals Setup" section, users have the capability to select a category they created and then choose which merchants are related to this category for their budget goals.

Increase User Motivation through Customization for Categories

Users can create a new category or modify an existing one. They can personalize the category name, choose a color, and selecting an emoji for quick recognition. Users also have the option to add sub-categories under each main category.

Provide Transparency through Transaction

This feature displays all transactions from user accounts connected through third party partner Plaid. It allows users to see each transaction's date, amount, and merchant, offering a clear view of financial activity. Users can sort transactions by date or amount and filter by account or type.

◦ Design Approach

Followed design principles to streamline the design process

Drawing from my research, I established a set of design principles early on due to the project's time constraints.

This approach not only guided my work but also efficiently streamlined the design process, ensuring that I met deadlines while adhering to the design needs identified in the research insights.
📑 Learnability
The tasks should be simplified for new users to perform them intuitively, optimizing the affordances.
🔍 Clear
The wording in the apps need to be concise to prevent any confusion. UI has recognizable colors and intuitive layouts.
👁️ Simplicity
To improve affordances, minimize unnecessary features and information to help users easily focus and interact.

◦ Success Metrics

1. Reduced time spent on task
Measure the reduction in time users spend completing tasks comparing to competitors, such as personalizing categories or reviewing uncategorized items.
2. Increased engagement motivation
Gauge initial engagement intent through user feedback collected after their first interaction with the app. Measure the weekly engagement data.
3. Interfaces are easy to focus
Evaluate the clarity of focus on the interface through direct user feedback after initial use
4. Ease of Information Access
Users can access necessary information from their first interaction, targeting high success rates in locating and understanding information without guidance.

◦ Reflection

At J3C, working as a Product Design Intern on a fintech budgeting app project, I deepened my understanding of aligning design with business values, and how to be the voice of the user.

How to inform design decisions
My key learning was the value of using research data to inform design decisions. When faced with differing opinions or directions, I would turn to user research and data analytics to get evidence-based decisions.
How to balance business needs and user needs
As an advocate for the user, I would make sure to prioritize their needs through deep understanding, ensuring that, although business objectives lay the foundation, user needs guide our direction.