Moner

— Simplifying and optimizing finance management with the all-in-one app
Integration icon

Role

UX Research
Brand Identity
Concept Development
Usability Test
Integration icon

Tools

Figma
FigJam
Marvel
Maze
Integration icon

Timeline

80 hours
(4 weeks)

Overview

Efficiently managing and spending money necessitates dedication and a well-thought-out strategy. By implementing a practical budget to project expenses for the year, individuals can greatly enhance their long-term financial planning. This approach allows users to make realistic estimations of their yearly income and expenses, enabling them to plan for significant financial milestones such as launching a business or making investments. However, relying on multiple apps to manage finances can be inconvenient and inefficient. Without a cohesive personal finance app, individuals may struggle to adhere to their budgets, potentially jeopardizing their financial well-being and hindering progress towards their financial goals.

Problem Discovery

As individuals, we possess an inherent drive to attain both prosperity and well-being.

This idea is supported by Maslow's hierarchy of needs, which suggests that the second level of the hierarchy involves the requirement for financial security and physical well-being. However, people may have difficulty achieving both of these needs. According to research in 2022:
90%
of Americans want to build long-term wealth1
45%
of Americans say they don't know where to start to build wealth1
60%
of adults do not engage in the recommended amount of daily activity2
1. Source: Stash | 2. Source: Edward-Elmherst Health

User Interviews

Users find finances management intimidating and find it difficult to stay consistent.

To gain insights into users' current money tracking and expense budgeting practices, I adopted a user-centric approach by conducting in-depth user interviews. These interviews were designed to elicit qualitative responses from participants regarding their personal methods of financial management. By asking targeted questions, I aimed to understand how users currently track their money, budget their expenses, and gain a deeper understanding of their individual approaches to finance. Through these user interviews, I gathered valuable firsthand information that informed the design process and ensured that the resulting solution aligns with users' needs and preferences.  View user interview guide

Goals

1. Manage finances
2. Avoid overspend
3. Attain financial goals
4. Maintain credit score

Motivations

1. Convenience
2. Accuracy
3. Avoid late fee charges
4. Avoid bad credits
5. Useful reports

Needs

1. Budget expenses
2. Auto-alert
3. Sync with bank accounts
4. Detailed reports
5. Ensure confidentiality
6. Set saving goals & plan
7. Bill payment reminder

Frustrations

1. Manually enter expenses
2. Reports are hard to read
3. Bank accounts do not link
4. Data breach
5. Cannot set categories for expenses
6. Stay consistent

Target User

The target user is eager to save money but lacks familiarity with financial apps. They are careful with their spending and driven to reach their financial goals.

Competitive Analysis

Integration iconIntegration iconIntegration iconIntegration icon

Connect bank accounts

The app should allow users to sync their bank accounts, credit cards for an easy way to track all earnings & spendings.

Monthly/Yearly report

It is essential for a quick snap at the end of the month/year and adjusting the budget accordingly.

Set saving goals

The feature allows customers to add saving goals & saving plan based on their current financial standing.

Confidentiality

Face-id, two-factor authentication, data encryption are necessary to protect users information & privacy.

How might we guide users to complete different tasks and achieve financial goals in just one app?

Information Architecture

Based on the insights gathered from competitive research and user interviews, I utilized an app map to establish a clear hierarchy and prioritize features within the design. The app map served as the foundation, guiding me as I sketched out user flows that specifically addressed the account setup process for new users. Starting with multiple task flows, I mapped out the happy pathways for each. Combining these individual task flows, I ultimately arrived at two refined and finalized user flows. These user flows serve as a blueprint, outlining the optimal paths for users to achieve their goals within the app.
Moner app map
Moner app map that consists of 6 main tabs
Moner user flow
Onboarding flow for first time users to set up their profiles
Moner user flow
Set up budget for an expense and connect bills/subscriptions

Solution Ideation

While transforming the identified pain points into actionable ideas, I maintained a keen awareness of the inherent complexity of personal finance apps. My primary objective was to create an interface that offers intuitive navigation, enabling users to effortlessly accomplish various tasks. To begin the design process, I initiated with low-fidelity wireframes, focusing on the overall structure and layout. As I progressed, I refined the wireframes into mid-fidelity prototypes, incorporating more detailed design elements and interactions.
Moner wireframes
Early concept for budgeting app
Moner wireframes
Mid-Fi Wireframes

Branding

When designing a finance app, the choice of colors plays a crucial role in creating a positive user experience. In our case, we have opted for a vibrant and friendly-approach color palette to foster a welcoming and engaging atmosphere for our users. Finance can often be associated with stress and seriousness, so we believe that using vibrant colors injects a sense of energy and enthusiasm into the app, making financial management a more enjoyable and approachable experience. By incorporating warm and inviting hues, we aim to alleviate any apprehension or intimidation associated with financial matters, creating a visually pleasing environment that encourages users to interact with the app confidently and with a positive mindset.
Moner UI kitMoner UI kit
Moner UI Kit

Final Design

The final design of our personal finance app incorporates several key features that are highly valuable to users. Firstly, the ability to set saving goals provides users with a tangible target to work towards, helping them track their progress and stay motivated on their financial journey. The app also includes comprehensive monthly and yearly reports that offer a holistic view of users' spendings and earnings. These reports enable users to analyze their financial habits, identify trends, and make informed decisions to achieve better financial management. Additionally, the app allows users to conveniently connect their bills and subscriptions, providing a centralized platform to keep track of payment due dates, automate transactions, and effectively manage their recurring expenses. By integrating these features into the final design, we aim to empower users with the tools and insights necessary to take control of their finances and achieve their personal financial goals.

Usability Test

Conducting a usability test on the onboarding flow and the task flow of setting up saving goals and connecting subscriptions in our finance app offers numerous benefits. Firstly, it allows us to evaluate the effectiveness and efficiency of the app's user interface, ensuring that it guides users seamlessly through the onboarding process and complete set up a profile at hand.

One valuable feedback we received was that some users found it challenging to track their saving goals. This feedback sheds light on an important usability issue that needs to be addressed. By identifying this specific pain point, we can focus on improving the visibility and tracking mechanisms within the app, ultimately empowering our users to effectively achieve their desired saving goals.

"Onboarding process is straightforward. I love that there is an option to skip certain sections and complete later. I was able to set up the account that tailored to my goals and needs."

icon
Chloe P.

"I could not find the saving goals section. It took me a while to locate it. I think it is an important field so it should be easy to find."

icon
Tysha H.

Iterations

In the design iteration process, I prioritized adjustments to the content hierarchy and color contrast to enhance visibility within our finance app. I analyzed user feedback, usability test results to identify areas where the content hierarchy can be optimized. This involves ensuring that the most important information and actions are prominent and easily accessible to users, while less critical elements are appropriately prioritized. Additionally, we will pay close attention to color contrast, selecting combinations that meet accessibility standards and ensure optimal visibility for all users.
Since keeping track of the saving goal is important, I decided to move it to the top for users to easily track.
Adjusted the graph's contrast to enhance visibility

Takeaways

Developing an app from the ground up requires extensive research and testing to identify the most crucial features. While the main objective was to create a minimum viable product (MVP) for a budgeting app, I also strived to craft a memorable and visually appealing user experience throughout the process, aiming for a more comprehensive product (MLP). While usability is a key factor for an app's success, achieving a sense of lovability from users sets it apart from competitors. Given the project's time constraints, my focus was primarily on prioritizing features that address users' needs and pain points. However, it is worth considering additional features that offer significant customer value, such as:

1. Implementing notifications and alerts to help users monitor and manage overspending.
2. Providing card utilization statistics as a resource for users to maintain a healthy credit score.
3. Integrating credit score reports to enable efficient finance management.

Continue reading

Other projects

Link to project

La Madeleine

Streamlining highly-customizable order flow
Link to project

Pro Brite

Improving customer retention
Link to project

Unifocus

Hotel operations. Made simple.