Lila - finance education made easy

A mobile application designed to create a relaxed and engaging learning environment for users looking to self-educate on personal finance.

About the Project

My Role: UX/UI Designer
Duration: 1 month
Tools: Adobe XD, Miro My Team: Melanie Lynch (UX/UI Design), Libby Lim (UX/UI Design)

This project was completed as part of the Georgia Tech UX/UI Design Bootcamp. The assigned task was an open-ended mobile app design challenge. After a brainstorming session with my teammates, we chose to focus our app on financial education. Our hypothesis was that financial education is underrepresented in traditional public education, and that many Americans are missing out on the benefits of good financial practices. To address our problem, we designed an app that allows users to learn about personal finance in a relaxed and engaging digital environment. Our largest constraints were lack of funding for research and a 3-week timeline on the project.

Conducting the Research

We conducted 6 user interviews and a survey of 44 people. Our initial research gave us encouraging results, showing that people were interested in investing their money and wanted to learn more about how to do it.

Figure 1. Survey results from 2 questions supporting hypothesis that users are interested in investing and learning about investing.

We were surprised to find that our participants largely self-reported good savings habits, as we had predicted saving money would be at the top of the list of money frustrations. However, participants did not report investing the money they saved outside of employer-sponsored retirement plans. Additionally, 74% of participants said they wished they had taken a financial education class.

Below are outtakes from our affinity diagram that we used to organize our interview and survey data. These groupings were the most informative for writing our point-of-view statements.

Figure 2. Affinity diagram groupings focused on users feelings and goals related to money.

Figure 3. Point-of-view statements based on our research.

Overall, the participants had a positive relationship with money but a fearful relationship with investing. People had the desire for the growth of their money but intense reservations against the risk of losing it.

Our user persona and empathy map communicate very similar ideas. People are aware of the need to save money and they have an idea that investing could help them towards future goals, but their fear of losing money and their lack of knowledge prevents them from pursuing investing opportunities.

Users are also frustrated in their attempts to self-educate on personal finance because the resources they find are full of jargon they don’t know.

Figure 4. User persona based on the results of our research.

Figure 5. Empathy map for our user persona, Abby.

Defining the Problem

Based on our research, we defined the following user insight:

“Young people are interested in learning more about financial planning but haven’t had access to the resources to feel confident in the topic. Therefore, we believe that frustration surrounding financial planning is due to a lack of knowledge.”

We have found that young people know they need to save money and want a financial plan but find the investing process intimidating and difficult to learn. They report that attempts to teach themselves are often thwarted by not knowing financial vocabulary and not understanding the relationships between financial institutions. They tend to avoid investing out of fear of losing money and making ill-informed choices because of their perceived low level of financial literacy.    

Settling on Solutions

We then began ideating on how we could solve the problems our research had outlined for us. After brainstorming many ideas, we used a feature prioritization matrix to decide which features would be most impactful and feasible in our design. From this matrix, we defined our first priority as creating finance learning modules, and our second priority as a finance simulation feature. Our goal was to give users a way to learn about money in general, but also be able to simulate their personal financial outlook. With both these features, we imagined that users would be better able to gain new knowledge and apply that new knowledge to their own situations.

Figure 6. Feature prioritization matrix.

As a last exercise in defining our problem space we created a user journey map for our persona, Abby. In our user scenario, Abby is a young professional who wants to get a head start on early retirement but doesn’t know how to achieve that goal. She is frustrated by her attempts to teach herself about early retirement strategies online, and almost gives up on the idea until she finds and downloads our product. She then uses our app to learn about personal finance in a relaxed and engaging manner.

Figure 7. User journey map for Abby, who hopes to achieve financial freedom.

Implementing the Ideas

Moving into the prototyping stage of the design process, we began by diagraming a user flow for the app and sketching ideas for the main features. We then created digital wireframes and built an initial clickable prototype. We took inspiration from the language learning app, Duolingo, as we imagined how our app would organize its educational content. Consequently, our learning feature was sorted into categories of financial education and levels of difficulty. After some internal debate, we ended up with two versions of our content delivery screens. We decided to A/B test these screens in our first round of user tests. We were concerned with determining the tone of voice and layout that users would prefer when being taught unfamiliar material.

Figure 8. Comparison of content delivery in Version A and Version B.

From our A/B testing we discovered that both designs had their pros and cons. We were surprised to find that users did not care for the informal tone, but they liked the security of vocabulary definitions just in case they were confused. We also had users of version B dislike that lack of feedback on their progression through the lesson, which users of version A received through the card stack style of the UI.

Additionally, we found that we needed to provide better feedback for wrong answers on quizzes and we should create separate navigation flows to flashcards and quizzes. We also decided to create larger clickable areas for our navigation elements.

Figure 9. Examples of how we combined the best characteristics of Version A and Version B.

Figure 10. Example of improved feedback on the quizzes.

Branding & Style

When we iterated our prototype using our testing results we also began adding visual design. We chose a predominantly purple color scheme because this color is associated with royalty and wealth. We chose an iOS style navigation system so that many users would have familiarity with the navigation patterns. Because we were combatting user’s predetermined dislike of financial learning, we felt we needed to have a friendly and approachable branding with our app. Therefore, we used soft shades of purple and curved edges to give the entire app a relaxed and non-formal appearance, and we chose the name Lila so the app didn’t sound like an institution or bank.

Figure 11. Onboarding screens for the Lila app.

Figure 12. Images of the learning and planning center of the app.

Future Steps & Lessons Learned

We found an obvious need in our research and a lack of direct competitors for this product. Desire for more finance knowledge is a widespread need across all age groups and socioeconomic classes. Financial goals for the users may vary but they all want a better understanding of how to get the most out of their money.

Given more time, there are many features we would add to this product, including:

• Allowing users to save and revisit missed questions

• Formatting planning templates for them to choose from when using the planner

• Example: Saving for a House

• Giving users personalized study plans

• Add more progress bar features so our users receive more feedback on their learning

Working as a design team was challenging and fun. Our project was highly collaborative throughout the entire process and working together forced us to challenge our own design biases. We found our Trello board and Slack channel absolutely vital for keeping us on schedule and organizing tasks across members. Overall, we highly enjoyed this project and felt proud of what we accomplished in our short timeframe.