Mimir

Personal Finance Management App

Mimir is a mobile App designed to help millennials by creating a personalized budget plan compatible with their lifestyle based on past spending habits.

PROJECT TYPE
Academic Sep-Dec 2021

TIMELINE
8 Weeks

MY ROLE
UX Researcher, Design Strategy, UX/UI Designer

TOOLS
Figma, Invision, Photoshop

PROBLEM SPACE

Millennials and Money

Every often I see a headline or an article titling “ This is how Millennials are wasting their money ” or “ If you’re a Millennial and want to buy a house stop spending your money on avocado toasts and lattes! ” or “Why Millennials are the worst financially responsible generation”. As a Millennial, these headlines hurt, and at first, I didn’t believe them to be true, maybe just some catchy headlines to get views. But I decided to dig into this problem space for my UX diploma program, and turns out, yes, there is a problem….

Millennials are the generation with the highest education yet the least financial security (The most in debt generation). 62% of millennials say they’re living paycheck to paycheck, and only 40% of them feel financially stable. While Millennials benefited from a considerable rise in wages compared to the Baby Boomers and Gen X, this increase hasn't kept up with the inflation and increasing living costs for them. This generation who had to face the 2008 financial crisis and the Coronavirus recession need a solution to improve their financials.

SECONDARY RESEARCH

What Do the Numbers Say?

In order to have a deeper understanding of the problem space and the challenges millennials are facing with their finances, I conducted several hours of secondary research. This research phase helped me make assumptions and a hypothesis statement going into primary research next. I have summarized some important statistics regarding financial challenges for Millennials.

PRIMARY RESEARCH

User Interviews, Conversations to uncover Frustrations & Goals

To learn more about the goals and frustrations of my users, I talked to 5 millennials who are handling their own personal finances and feel that they need to improve their personal finance management skills. I synthesized and categorized the data I collected into 3 categories of pain points, motivations, and behaviors, to find patterns and themes from them.

User Interview Insights

Here are their shared insights and frustrations my users shared with me during the primary research:

Persona & Experience Mapping

By gaining a better understanding of who my user is and keeping the user's needs front and center in all of my design steps, I formed my persona, Austin McAllen. Austin, a 29-year-old working professional who needs to budget and track his money so that he can save consistently and reach his financial goals. Austin often wonders at the end of the month, where did his money go and how did he spend it. He thinks he should budget his money, but it's such a daunting task, and even if he does, it's hard to stick to it, because it's not realistic or flexible.

Using my interview data, I got a sense of my persona's experience in using his personal banking app and made an experience map that shows his current end to end experience using his banking app and identifies design intervention opportunities that exist for my brand to help Austin meet his goals through using my product.

 
After looking at the experience map and persona, it is clear that millennials need a better way to manage and track their spendings. so I shifted focus to how I can help millennials have a budget plan which is compatible with their lifestyle and habits, realistic, and easy to follow. With all this in mind, it's time to ask the right question, How Might We...?

HMW...

How might we create a personalized and easy-to-use budgeting & tracking tool in order to help Millennials (ages 25 - 40) take control over their finances?

PRIMARY TASK

Automatic & Personalized Budgeting as MVP

Using the refined HMW statement and considering the needs of Austin the persona, I created a set of 30 user stories under 4 epics in order to help me define the function of my product. Taking into consideration the core value proposition, I chose the following epic and user stories to create my minimum viable product (MVP).
 

Core Value Proposition
To budget automatically considering spending habits and lifestyle

Core Epic
Create a personalized and automatic budget plan for monthly expenses

Showing 10 user stories under this epic. I identified the needs and goals of the users in these user stories so that I can identify the primary task in the one flow I'll be designing to meet these needs.

Selected User Story: As a Millennial, I want to have a personalized budget plan written for me so that I can manage my money better each month and save a defined amount of money at the end of each month.

After identifying my main tasks, I developed a task flow thinking about how a user would interact with the product to complete these tasks.

This task flow below shows a user who is already logged in and have their banking accounts linked to the app before, now looking to create a budget plan, selecting the option of the recommended budget by the app ( The Personalized budged plan based on spending records), adjusting the budget (if preferred) and Confirming the budget plan. 

SKETCHES

Ideas, Paper, and Pen

With a task flow in mind, I started sketching and ideating on paper to find the best design solutions that can communicate the functionality of the app clearly to the users and the best ways to show them their financial data in easy-to-read charts and graphs. Using inspirations from other existing UI components and looking at functionalities from apps like Mint, Banking Apps, and Fitbit App, I explored different ideas and selected the best ones to be the solution sketches.

Rapid hand sketches to ideate for the first prototype

WIREFRAMES

Translating into digital screens

I translated my sketches into mid-fidelity grayscale wireframes and prototyped them for the first round of usability testing. The features and functionalities that are designed are mostly inspired by the experience map and user interviews to meet the needs and expectations of my user. I tried to consider other themes which were discussed in the primary research as potential features for future expansions of the app. 

First version of digital, grayscale wireframes

USABILITY TEST: 2 ROUNDS

Iterations, Iterations, Iterations

By conducting 2 rounds of usability testing with 10 different people, I evaluated how well the tasks were completed by users and what parts of the app could be improved. 

During the testings, most of the users did not encounter any issues that block their flow, however, most of the users got confused about different graphs and charts or liked to see more details to understand them, these design improvements were considered in every iteration.

BRAND DEVELOPMENT

Enhancing User Experience by Building Brand Identity

Starting to build the visual identity of the brand before creating the high-fidelity prototype, I used a list of adjectives that I want my brand to embody, the adjectives must also be aligned with how millennial users like to feel towards their finances and managing them.
 

MOODBOARD

Tone & Color Extraction

To better explain my brand's identity, I created a list of "More A than B" phrases, and using a moodboard including imagery I tried to build it in a more visual language. The moodboard communicates the brand's identity using imagery, textures, and colors. For my brand's colors, I extracted colors from the moodboard to make sure I am transmitting the right tone in my app's UI.

MoodBoard & Color Extraction

USER INTERFACE

Color & Typography

My choices for Color and Typography are inspired by the brand's moodboard and brand adjectives. I used the palette below to create the user interface of my application and the "Avenir" typeface for its clean and modern look, as well as different weights. 

LOGO DEVELOPMENT

The Name that Embodies the Brand Best

In my explorations for the name that embodies the brand's mood best, I considered names that give a sense of knowledge, wisdom, or guidance (Beacon, Lantern, Vault, Pocket Pal,... ) But my explorations led me to a unique and symbolic name which was "Mimir".

For Mimir’s App icon and to create a logo for my brand, I was inspired by icons that show wisdom, knowledge, and growth. "Beard" is a symbol that embodies those adjectives best. So I decided to make an approachable, kind, and wise old man's icon for Mimir.

Mimir is the name of a Nordic mythological character who was the wisest and cleverest of all time. The App’s smart budgeting feature could be interpreted as a metaphor for Mimir’s knowledge and wisdom.

UI LIBRARY

Dear Developer & Fellow Designer!

The UI Library contains all of the components that I used for designing Mimir, the redlining for development handoff, and all of the content inventory exists in a Figma file for further continuing the app's design and developing it. 

Value Proposition

Aaaaand Assemble!

After consolidating rounds of iteration and brand development, I injected color into my prototype and made the final Hi-fidelity Design. If you're interested in the interactive prototype please click on the button below.

RESPONSIVE WEB DESIGN

Marketing Strategy

I also designed a responsive marketing landing page for Mimir. The website introduces Mimir and its features and can be used for Marketing my product. If you're interested click on the button below to view the prototype for the website.

CROSS PLATFORM 

Mimir on the Watch?

As another challenge, I tried to imagine my app on another platform, specifically on the Apple watch. I think Mimir has the potential to be used on the watch and show the users how much of their budget is left after they have had a transaction or at any other time. 

I designed a static screen for Mimir on the watch to show how Mimir's interface could look on it and will go back to explore the possibilities of more functions and features on the watch in the future. 

On this static screen, you can see that Mimir is showing the user their budget left in each category on the watch, so if the user is having a day out, they can see how much they can spend for themselves in order to not exceed their budget. 

Next Steps

What's Next for Mimir?

I would like to improve Mimir by conducting more rounds of user testings in the future and building more features and task flows. Specifically, these are some areas I'd like to do more iterations and explorations:

• The UI structure of the budgeting page can be improved, maybe the layout for the dropdown lists can be changed to another UI pattern.
• What will the budget progress bar look like if the user has exceeded the budget? How will that information be presented to the user and how will interacting with it look like?
  
• Considerations to resolve the challenge of not having enough data to form an algorithm or in other words; How is the user going to get a recommended budget plan if they have opened their banking accounts linked to the app, less than a month ago? ( How will the algorithm retrieve data of the user's spending habits?)
• Building a more inclusive and accessible user base (not focusing just on tech-savvy millennials) through iterations, user testings, and more interviews.
  

KEY PROJECT LEARNINGS

Designing for the user - testing and iterations shall never end!

Looking at the work I accomplished during these 8 weeks, there were plenty of highs and lows. My biggest takeaway from the process of human-centered design is to let the users inform the design. If the design doesn’t improve the user experience or meet a goal, then the design is just decorative. It is important to keep testing and keep iterating. And through this process, remember that as a designer, you are not your designs. I needed to keep an open mind during user testing and feedback, as there will always be hard moments that can lead to pivotal changes.
 
 
Other key learnings:

• Be Open to change— Getting fixated on ideas and solutions is not the best way to approach a problem in the UX process and as a UX designer I  should always keep in mind that constant testing and iterations will reveal problems with ideas that are not backed by user needs.
• Importance of other UX skills under the UX umbrella, Like UX writing and IA — these specific UX roles might not mind a Junior UX designer's workflow, but from working on this project I realized how each of these specialized UX skills can make or break the entire design, only because users perceive different words and verbiage differently or categorize information in a different way in their life. So it's important to consider these UX skills while working on every project!