top of page

Design a web-app from concept for a financial education startup

Moolah U web-app project intends to help parents to form long lasting financial habits and behaviors in their children. Currently, many young people do not have clear financial goals and don’t understand how to organize, manage, and utilize their savings. Moolah U believes that every person should enter the adult world with a practiced experience of financial responsibility. For this challenging yet rewarding project, I played a key role in leading and facilitating its user experience design.

First mockup.png

Why

Moolah U currently possesses a web-app MVP that serves the most basic demand of “saving and sorting allowances”. However, due to its feature limitations, the current MVP did not retain a substantial number of active users. Ultimately, Moolah U wants to regain its lost users by letting their potential users recognize the value of using the product, form productive habits when using it and be engaged while using it.

 

Therefore, a new product is needed to help parents built money saving habits in their children from an early age, with real life experiences.

Role

Lead UX designer
Feature development
Project coordinator

Time Span

3 months, 2021 - 2022

The Solution: Summary

I helped Moolah U planned and designed the prototype of their new web-app product from scratch.

 

The product will solve both parent and child users' pain points by motivating the children to save money and think critically of using money; teaching the children the value of money and how to grow them.

 

Meanwhile, this product will empower children by involving them in the decision making process, giving them autonomy so that they can learn to be independent and responsible.

 

Parents will be at ease from thinking how to direct their children to the right path and be able to witness and involved deeply with their progress.

Research - User

Insights: What parent users want

  1. I want to make my child critical of how he/she uses his money.

  2. I want a way for my child to learn how to work for and save money.

  3. I want to teach my child the value of hard work and the importance of growing money.

  4. I want to encourage my child to be independent and responsible.

Insights: What child users want

  1. I want to make my own money and buy the things that I want with it.

  2. I want to have more say in how I can spend my money, or how I can save my money.

Insights: Parents' frustrations

  1. I cannot consistently teach my child about money.

  2. My child is always asking for money without understanding its value.

Insights: Children's frustrations

  1. I don't have a way to make money on my own

  2. I dislike that I have to wait for things I want

  3. My parents treat me like a kid

The stakeholder has accumulated a large amount of research and interview data through years of youth education business. Many of them became core principles of our feature ideation.

At the same time, I wanted to update the user pain points, and refine the major problem due to potential obsolete information (For example, the client believes most of the target child users only have access to desktop computers, while later research showed a significant percentage of them use tablets frequently).

Research - Constraints

The client had a strong philosophy that they wanted this design to represent, which to a point that I was concerned about the level of user buy-in. Therefore, a fine balance between user and business was extremely critical in this project.

 

In order to find that balance, I frequently communicated and interviewed with different stakeholders, including the company's camp instructors, child psychology consultant, product managers, and their CEO, and concluded the most accurate expectations from them. These expectations represent the philosophy and ideology of Moolah U and were considered as "must follow" constraints.

Reinforcing Copy: words like “spend,” “chores,” and “allowance” should be avoided.

Delayed gratification: Key features must be built based on the philosophy of delayed gratification, which is the resistance to the temptation of an immediate pleasure in the hope of obtaining a valuable and long-lasting reward in the long-term.

Autonomy: Children should have full autonomy and cannot be interfered with by parents when using the product. However, parents must be able to monitor progress and feel rewarded through the process.

Other constraints: There must be opportunities created for parents and kids to have conversations. Children need to learn how to manage money and how to grow money spontaneously without being told what to do.

Examples of some of the key constraints

Research - Market (C&C)

Synthesis 

  1. Parent users want to come back to monitor and witness the progress of kids. But they don't want to keep thinking/memorizing to do so.

  2. Child users want a unique color palette and design style that simultaneously shouldn’t look juvenile.

  3. Cross-verify that child users are not afraid of challenging concepts, they are afraid of long and tedious readings. Reading habits should be considered when it comes to feature design.

  4. All basic features must be well designed and made, even though most of them look identical to competitors.

We found that almost none of the direct competitors on the market that help children with their financial education shares the beliefs and ideology that Moolah U does, especially when it comes to delayed gratification and children's autonomy.

 

We found this information to be very exciting because it left us plenty of room to create unique features.

Define & Ideate

Based on the insights that the research team provided, I led the feature development team to start brainstorming the core features. 

​

We first defined more than two dozen of user stories with given acceptance criteria and solutions based on users' pain points, and then sorted them into different categories (I know, it does kinda look like Jira tickets).

 

We also card sorted all of these user stories based on priorities, re-evaluating the cost of time and effort in designing each solution. Since the contract had a clear deadline, we must focus on brainstorming the top prioritized solutions.

Part of the cardsorted AC based on user stories

After days of debating, we decided on three key features for Mooolah U:

​

  • Buckets

  • Gigs

  • Business Plan (later renamed to Grow Money)

Early brainstorm sketch mockups

Blueprint

Based on the key features I created the sitemap of the main pages and the sub-pages should be located on the web-app; and how they need to be connected. This helped us identified information architecture and understood what the product is.

Sitemap.png

site map

We decided to use the concept of dashboard so that both PC and tablet users can be able to use the product easily (more than 30% of survey participants claimed their children use tablets at home, similar to the number of PC users). 

​

On-boarding pages, profile & account pages, and other policy/legal/store-related pages were not considered for this contract.

task flow for gig page (v.2.3)

Estimated task flows were also created to identify design scopes, understand the interactions between parent dashboard and child dashboard, and further understand the product. Note that many steps in the current flows were later changed based on usability test results.

Visual Design

The visual design team focused on how to engage child users when it comes to color choices, the use of negative space, and the use of geometric and organic shapes.

 

Although I was not directly invovled in researching possible visual solutions, I provided insights from user interviews and C&C analysis to the team, and frequently involved in decision making processes as the team leader.

Feature Development

Outcome 1: Bucket

The concept of Bucket was part of the original MVP. However, after Heuristic Evaluation, we determined that the original user journey can be simplified to enhance the user experience, and additional features can be added based on our user interview synthesis. 

​

The Buckets, is where the money is located for child users. It is considered how child users receive money from parents into predetermined categories but it’s up to children to correctly budget their money. These categories are called Buckets.

original bucket design

For every dollar that the child receives, 10% will be transferred to the Grow Money bucket automatically. This is a critical concept from the stakeholder due to its property of delayed gratification.

​

Below, I included the major designs and the purposes that these features serve:

Outcome 2: Gigs

Gigs are tasks and projects that parent users assign the child users to do. Parents can assign tasks that they pay someone else to do for them. These are chores that are over and above children’s line of duty; not chores they are already responsible for.

We purposefully gave gig proposal the look of a contract in the adult world. Our user research indicated that children want to feel and act like responsible adults, they want to prove themselves, as well as make money.

feature 2.png

Outcome 3: Grow money

Grow Money feature allows children to grow their money by starting their own business, following the business plan they created on their own. 

​

Similar to Gig Proposal, the business plan is also based on templates. Children do not have to spend hours translating their business ideas into words. Instead, they only need to fill in the blanks.

feature 3.png

Outcome 4: Home page

The home page was not one of the early designed features. This page was added after the mid-fi usability test when parents reported they would love to:

  1. See analytical data on children's accomplishment

  2. Track progress and see historic data of what their children did.

  3. Glance to get the basic information

feature 4.png

Usability Test

Several rounds of usability test were conducted through both mid-fi and high-fi prototypes, and two major issues were quickly brought to our attention:

  1. Users were having trouble understanding the meaning of some of the UX copy;

  2. Users were having trouble understanding the functionalities of certain buttons.

 

Some of the significant improvements are shown below.

Mid-fi & Hi-fi usability test report

Major changes based on usability tests

Final Screens

Conclusion & Next

The stakeholder also owns a financial education camp for youth, thus half of the users who participated in the tests were their current customers who knew their philosophy. 

​

We were happy to see that both current camp customers and the outside users were very happy with the prototypes they were shown to. Parent user usability test average scores increased 36% from 2.39 to 2.75, and Child user usability test average scores increased 47% from 2.33 to 2.80 (Hi-fi version 2.0 vs version 3.0).

​

Almost all parent users reported that this product was exactly what they were looking for for the family. Parent users found the prototypes opened up the communication channel with their children when creating buckets and drafting gig proposals, and also boosted their confidence in teaching children basic financial habits spontaneously. Child users also reported that they learned a lot from testing the prototypes, especially when going through the business proposal creation.

 

The deliverables successfully met all requirements from the stakeholders, and stakeholders were confident in fundraising with the current prototypes.

​

More potential features were suggested to stakeholders for the future iterations: 

  • Customizable / collectible reward for child users to enhance engagement;

  • Recurring options for repeat gigs;

  • Social features, which include:

    • Business proposal trade, business partnership, business shares trade

    • Parent users community

  • Additional reading feature to add financial related readings for child users & child education readings for parent users;​

  • Tutorials such as animated character walk-throughs should also be considered to help with ease of use and child user engagement.

​

Stakeholders agreed and were willing to recruit the team for long-term project when fund is ready.

logo 2.png
bottom of page