Content Creation ICM528

Meet: Money Kit

A case study for an educational website that helps millennials achieve financial wellness.

In my previous article, I explained the financial circumstances that most millennials face and why I am personally interested in the topic. I also shared my UX Process and Plan to develop a product related to millennials and money for the remainder of the semester. Since that last post, I have submerged myself in working towards that goal for five weeks. It’s been an intense journey but also incredibly rewarding. Below I’ll break down the primary portions of the process and reveal the outcome.


This phase was all about understanding the users, their current challenges, and the existing landscape.

Method 1: Secondary Research

Also called desk research, secondary research is gathering information from resources and products that already exist.

Through secondary research, I realized why millennials are financially behind and their attitude and behaviors towards money. I read several articles and academic publications about the financial state of millennials and watched interviews in which they described their financial and professional struggles and outlook.

Below is one of the resources I found during my research.

Millennials: The Unluckiest Generation In Modern History? | Think | NBC News

Secondary research helped me understand what external obstacles millennials have faced that have left them feeling helpless in ever “catching up” financially (I discussed this in more detail in my previous article). This validated my hypothesis that millennials need and want financial well-being, making it a problem that deserves to be solved. Research also built my empathy for the generation and their situation.

Method 2: Competitive Analysis

A competitive analysis is an assessment of products that already exist in the market. This type of research provides insights into the information, features, functions, and feelings the competitors are conveying with their product.

I conducted a competitive analysis to identify what financial products are currently available to millennials. I documented my observations in a Notion spreadsheet in order to easily compare them side-by-side.

Here is a snapshot of my competitive analysis gatherings. Each line item is also clickable and provides more detailed comments.

Through this exercise, I was able to understand the market much better. But, it also made me realize that I didn’t understand the user’s experiences with these products, which led to me the next method.

Method 3: Primary Research Surveys

Primary research is research that you conduct yourself. It can help you collect more targeted and qualitative data from your specific users and fill in any gaps of knowledge you could not find through secondary research.

For my primary research, I developed an anonymous survey asking millennials what existing financial products they’ve used and what their experiences have been. I also probed users on what types of financial content they need information on, and their learning preferences. The survey included multiple choice, check-box, and open-ended questions.

A screenshot from one of the questions included in the survey.

I posted the survey through my social media and discord channels and received nearly 20 responses before concluding the session.

This research helped me identify what obstacles users currently face with existing products, what types of information they are looking for, and how they prefer to receive this information. The survey provided great insight into what I could create that doesn’t currently exist and how my product can solve their needs.

Global economics keep pushing the goal post. I’m not a homeowner and I’m not in a position to save for a home. My wife and I just bought one car, and I’m pushing 40 with barely enough money for savings.

Response from one of the survey participants

Synthesizing the Data

It’s time to gather all of the raw data collected through my research in the Discovery phase and turn it into valuable insights.

Method 4: Affinity Mapping

Affinity mapping is an exercise that helps you identify patterns and relationships across research and cluster them together to uncover valuable findings and insights. I had gathered over 120 data points through my research and wrote each one down on an individual post-it note. I used different colors of post-it notes for different types of research. Yellow was used for secondary research, pink for competitive landscape analysis, and blue for survey results.

A time-lapse video from my affinity mapping exercise. Over 100 data points were clustered in about 30 minutes. Coffee helped the process keep it’s momentum!
Some of the key insights from the affinity mapping exercise included:
  • Millennials struggle with financial literacy, but they want to understand it and achieve financial wellness. It’s something they recognize is essential and that they need help with.
  • Millennials are actively looking for technology to help them understand money, but most apps and websites now focus on money management, not money education.
  • The best way to communicate and reach millennials is by being personal and genuine with them. They expect the technology and brands they interact with to act and feel human, like a friend.
  • To help millennials, we need to meet them where they are on their financial journey, and provide a guided and supporting path towards financial wellness.
Method 5: Personas

Personas are fictional characters who represent actual research and insights for user segments. Personas help humanize the data and answer the question, “Who are we designing for?”

Method 6: Defining the Problem

One of the most valuable discoveries from my research was the direct link between financial literacy and financial wellness. 

Financial literacy is positively linked to financial outcomes, and as such, it is essential if individuals are to thrive in today’s society.

TIAA Institute_Millennials and Money report, page 6

Many millennials don’t have financial literacy, so they are further out of reach of obtaining their ultimate goal of financial well-being. Unlike many factors in their life, learning financial literacy—especially with the right tools and resources—is something they can control. Millennials need something that will take the guesswork out of financial literacy so that it feels efficient and worth their time and effort. Scrambling through the internet trying to piece random articles from various resources together is not working.


Millennials need a personal and educational financial resource because they show low levels of financial literacy, are stressed about money, and feel pessimistic about their financial futures.

How might we teach millennials financial literacy so they can achieve financial wellness?

Visualizing the Solution

Method 7: Sitemap

A sitemap is a visual diagram that represents the structure of pages across a website. It shows the hierarchy and labeling of information and clarifies the relationship between content across an entire site.

After conducting a quick card sorting exercise, I drafted the first of many rounds of sitemaps. The sitemap helped me understand how the scale of the project, and the user flows and pages I should consider wireframing and testing.

The first version of the sitemap for the website.
Method 8: Wireframe Sketches

Wireframe sketches helped me imagine the various ways this product could take physical shape—especially from structural and information hierarchical perspectives. This exercise allowed me to get ideas out of my head and onto “paper” quickly and easily.

I enjoy the process of sketching because it increases my confidence when I jump onto the computer—knowing I’ve explored several solutions before making any decisions. I also find myself revisiting this exercise throughout the design process, not just in the beginning.

Screenshot of some initial sketches for the product.
Method 9: Mid-Fidelity Prototype and Usability Testing

After sketching, I jumped into producing mid-fidelity prototypes. I choose mid-fi because I wanted give users the opportunity to also provide feedback on some of the proposed content and features, in addition to interaction and navigation.

The interactive prototype worked perfectly in the usability testing session, in which I was able to gain some valuable insights. After building a usability testing plan, I was prepared for the testing session.

An image taken during the usabilty testing session.

“I didn’t seem to navigate to where I needed to go because I assumed what I was looking for would be in different areas, or be called different things.”

Quote from user during usability testing
Some insights from the user testing session included:
  • User was confused between resources and tools. He asked “What’s the difference?”
  • Overall, there was a lot of confusion about how things were labeled.
  • User didn’t understand the difference between “My Dashboard” and “Financial Hub” and that this section was a subdivision of the larger product.
  • In “Planning a Trip” budgeting per week doesn’t seem as useful as determining the entire cost of trip.
  • Having the entire “watch” time for each module seems daunting to user, but it doesn’t seem as overwhelming when times are broken down by module.

Based on the feedback and in an embrace of the iterative design process, I reworked the information architecture and taxonomy of the site to bring higher levels of clarity and findability to the site. Then, I made updates to the mid-fi wires.

Revised sitemap based on user testing feedback.

The Final Product

Meet: Money Kit

Money Kit is a personalized, educational platform that teaches millennials financial literacy to achieve higher levels of financial well-being. The platform provides an expert-based economic path towards financial literacy. Users can assess their skills and jump into the course right where they belong, based on their current understanding. They can also test their financial literacy and track their improvements along their journey.

Users also have access to a Financial Hub that allows them to link all of their accounts, evaluate their net worth, track their credit score, and build a budget and financial goals. As users continue to learn about financial literacy, these tools will become more valuable in understanding their financial picture.

Money Kit is just that—a kit full of educational tools, articles, and resources that make money easier to understand and less stressful to manage. Money Kit provides users the information they need to make the best financial decisions for themselves through every step of their financial and life journey.

Method 10: Style Guide

I created a style guide to help build a consistent visual design system across screens, and appeal to the right audience. The overall look and feel is non-institutional, approachable, and friendly like millennials expect; and credible and trustworthy like a reliable educational tool should be. The illustrations are from unDraw, and they worked perfectly for this product.

Method 11: Hi-Fi Prototyping

After developing an initial style guide, I was prepared to build out the visual designs of the prototype. I really enjoyed the process of developing this project. What started off as a hypothesis on millennials and money transformed into a fully designed concept in just 7 weeks total. I’m happy with the UX solution I created and the UI that tied it all together.

The final designs can be seen in the images below, and the prototype can be tested here.

A shot video that shows the interaction across pages.
A few screens from the mobile version of the website. This could also function as a downloadable app.
A few screens from the desktop version of the product. Users can access this platform from anywhere on any device.

Reflection and Next Steps

After an intensive 7 weeks and 143 hours of planning, researching, synthesizing, prototyping, testing and designing, the product feels like it landed in good shape. Managing my project through Notion has not only been great for organizing my work and keeping me on track, but it has also proved to be valuable artifact in itself. Looking back, I am glad I was diligent in documenting all of my work through Notion, because I can step back and visually see everything it took to bring this idea to fruition, and the path I took to get here. I’ve never had such a clear representation of the work I had to put into something, like I do now with this Notion project page.

Project Overview page in Notion. Within each line item, I also recorded sub-steps within each process, and any work I produced for each one. The production journal is a reflection of how I worked through each step, and what I learned along the way.

Next, I’ll run this updated design through another round of usability testing and make any additional revisions. Additionally, I think there is potential to build a social media campaign and channel that advertises this platform to its target audience, that I would also like to consider creating.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s