UX/UI Design

Teaching Financial Literacy Through Game Play

Mentamorph Money is an immersive mobile simulation game that teaches resource management and financial literacy.

Role

UX Researcher & Designer
Visual Designer
Project Manager

Industry

Entertainment Software,
Educational Games

Timeline

4 Weeks (2020)

Project

Team Project,
Design Challenge

SCROLL

ShipRelay
WeThePeople

Context

The Client
Susan is an engineer, published author, and corporate educator who is passionate about the environment. Susan is also an entrepreneur with a mission to improve people's financial literacy.

Her original game came to her "in a dream" one night, where she imagined a game that taught people how to better manage their resources. After all, the world is made up of "matter, energy, space, and time," as Susan says. "It is up to us to exchange and trade it to how we see please in order to reap the outcomes we expect or desire".

The Challenge
Susan doesn't know a lot about developing on iOS or Android platforms. She also believes that there is a way to explain the core concept of the game in a much simpler way that is engaging and motivates the user to continuously come back. As a team, we were tasked with translating Susan's existing excel game into a digital platform.

My Role on the Team

  • Project Manager in steering the team in the right direction
  • Quality Assurance (QA) in polishing final deliverables before client handoff
  • UX Researcher in conducting user interviews and testing screens
  • Lead UX Designer in executing high fidelity screens

The Game As It Exists (What We're Working With)

When my team and I adopted this project, Susan's game existed in two formats: an excel spreadsheet and a workshop exercise played with middle and high school students.

The workshop exercise is played with toothpicks to be exchanged and shapes on paper cards that held value. The excel spreadsheet spanned over 20 plus levels where values are entered in manually in each cell, and each round progressed as the player flipped through sheets.

While these games are purposeful in teaching the core concepts Susan wants her players to learn, Susan has dreams of scaling the game and making the lessons "stickier" to the brain.

What does this mean?
MentaMorph's current excel game format does not work if she wants to scale the lessons and game. To reach a larger audience who can benefit from Susan's money lesson is to design a digital mobile game that can be easily downloaded from the app store.

From initial project scoping, I learned that Susan's Goals were:

  • Robust tutorial and onboarding
  • Make the game intuitive for first time users
  • Create or redesign a basic design system for the interface
  • Generate a stream of revenue through the app - start with freemium version (Long Term Goal)
  • Infuse a social or sharable experience - Multiplayer (Long Term Goal)

Understanding the Problem Through Research

The Problem Space

My initial process begins with exploratory research where I dove deeper into intersection of four topics:

The Current Market of Mobile Games (that teach financial literacy)
While games make up 20% of the Apple App Store, the current form of learning about financial literacy are done in-person instruction/training, webinars, or e-learning. There are games that teach economics but none of this simulation/multi-player nature. "Financial literacy" games are unappealing to users because they are not interactive and engaging.

Gamification vs. Game-based Learning
Gamification integrates elements like points and badges into lessons. While game-based learning uses game-like activities to facilitate the learning itself. Both are great and important ways of teaching a lesson but sometimes education is active rather than passive.

Elements of Game Design and Game Play
I did extensive research on the 9 different genres of games that exist. But role playing and simulation is the crucial genre that most fits the goals of this game. Role playing (RPG) mimics reality and puts the user to think and act within a scenario. There is an established list of best practices or heuristics to follow when designing a game.

Financial Literacy: What is it and how do we teach it?
The five basic concepts of financial literacy is: basics of budgeting, understanding tax rates, prioritizing savings, credit-debt cycle traps, and identity theft issues and safely. In teaching financial literacy, we must consider the audience, understand their needs, goals and the best way to deliver the curriculum to them.

What does this mean?
I had no previous experience designing for games. Doing exploratory research helped me understand how to best approach and tackle the problem we are solving for. By casting the net of knowledge wide, we can try to narrow down our questions to ask for our subject matter experts and potential users.

Advice From Experts and Potential Users

We consulted 8 experts in the industry about their experiences and general topics to understand how big the challenge was. We consulted financial experts, game design experts and education experts to see if we can draw parallels from all three fields.

Some key insights our 4 subject matter experts advised us on were to create a game that:

  • Supports individual and multiplayer
  • Uses simple language
  • Allows players to compete with each other
  • Measures progress and achievement
  • Incorporates engaging symbols and imagery
  • Implements a minimalist onboarding process
  • Hooks the User

We also consulted 10 potential users and gathered insights on creating a game that:

  • Allows the user to customize their experience
  • Involves levels that challenges the user
  • Fast and easy for users to learn and understand
  • Makes progress visible and shareable
  • Incorporates competition
  • Teaches users complex concepts in simple ways
  • Emphasizes educational component
"What keeps you coming back to play? There are a few people there that I want to beat."
- User Interview Participant, omitted for privacy reasons
"I like mindless mobile games, like where you have puzzles and you're just constantly swiping to, like, unlock the block or something...I like to release my mind..."
- User Interview Participant, omitted for privacy reasons

What does this mean?
I have no previous experience designing for games. I love the research aspect of the project because I get to learn about user motivations and uncover a deeper veil into the project scope. I was curious about game design and why and how games capture people so well. Doing exploratory research helped me understand how to best approach and tackle the problem we are solving for.

Framing the Challenge

Financial literacy is an important skill for everyone to have because the knowledge and skill to manage resources can greatly determine a person's foundation of their life. How might we...reimagine Susan's game while balancing her goals?

Who exactly did I meet?

While Susan's target audience is anyone in need of financial literacy, from the majority of our user interviews, I met someone like Gabrielle who is a young and busy college student. She is becoming an independent woman who is starting to think future-forward about her money.

Keeping Gabrielle in mind, I devised that the game needs to be:

  • Simple - Players of all ages can pick it up and understand the lessons it teaches
  • Engaging - The style and game mechanics immerse the player from the get-go
  • Guiding - The game should be intuitive and offer support so the player never feels lost
  • Practical - The game's goal is to teach real and relevant world skills

Build Then Play

Entertaining 3 different ideas

Each team member broke away and spent time developing their own concepts of the game. Divergent thinking helped us ideating on possible "narratives" the game can take form. Stars, circles, and colors in Susan's original game was difficult to follow. We explored different metaphors players can relate to, os they can understand the concepts a little bit better.

Moving Forward With One Concept

Once we decided on one concept, we started the ideation process all over. I began working with paper to plan out each screen and flow before taking the ideas into Figma and prototyping early versions in black and white. My team stopped at the mid-fidelity version. But I decided to take it one step further to enhance the game's UI after the project was completed.

The Game We Designed

I was inspired by Susan's passion and vision about seeing the world broken up into energy, matter, time, and space. The theme of the game became this idea of managing an apple farm where the player will need to water, fertilize, and respond to surprise events as they come up.

Fundamental Lesson of the Game
One of the fundamental lessons of the game is knowing when to buy, save, spend, and how to manage emergencies at the right time.

Objective of the Game
The person with the highest net worth at the end of the rounds wins the game.

Platform
This game is designed to be compatible with iOS and Android operating systems.

How to Play

In each round of the game, the player will collect income, trade assets, and manage emergencies as they come up.

Collecting Income
Each round, your tree will yield a certain amount of apples. These apples turn into income and it can increase with saving or decrease if you have an outstanding loan. You can later use your income to buy more trees for your farm which can yield even more apples. Apples -> income -> currency.

Paying Expenses
Every week (round) or month, you are expected to water or fertilize your farm. No luck getting around it, it is just something you have to do to maintain your farm.

Collecting Assets
You have the opportunity to generate even more income by saving the money you earn each round. You can also buy and hold onto various seeds that increase or decrease in value. These assets can help you generate income on the side simply by holding onto it.

Resolving & Planning for Liabilities
Just like the unpredictability in life, these are the randomly occurring events that cost currency to resolve before allowing the player to advance to the next round. They encourage players to balance their assets so they can manage unexpected events. A loan can be taken out to help in hard times, but they come with a cost.

Playful and Simple Visual Design

In order to make the app feel more like a game instead of an educational text book, I designed the visuals using flat vector images and cheerful bright colors. I also decided to use an isometric game design to help visualize a 3D effect on a 2D farm.

Bit by Bit Onboarding and Tutorial

Since Onboarding and tutorial was a main goal and focus of this project, by slowly introducing various elements round by round, users can grasp the concepts at their own pace.

I thought back to the original format of the classroom exercise toothpicks, and how Susan explained it was beneficial to have a facilitatory that guide the player through each level with a debrief. The game is hard to grasp in itself, so this "slow reveal" method makes the tutorial and game elements easy to follow.

Playing to the Game Mechanics

Watering, fertilizing, and managing emergency events are critical to the survival of your farm. A player can generate residual income with the fruits it yields from the seeds planted. By responding to these events as the game progresses, the player learns how to adapt and make strategic decisions that could help grow their farm in the long run.

Leveraging Game Play Elements


A round or level based game not only forces the player to think and react on their feet, but to be able to fully take in the lessons of losses and wins so they can strategize and do better next time. I also thought it was important to infuse positive affirmations throughout the game to encourage positive feedback and behavior.

Testing with Actual Users

Once we had prototypes of the game we immediately put them in front of users to get feedback, so we tested 10 users and asked them to play through the game from start to finish. We implemented this helpful user feedback into our second and third prototype versions.

Specifically we wanted to know:

  • Which features were  easy to use?
  • Which features were difficult to user?
  • Which features best met users’ needs?
  • How likely users were to use this product again?
  • Where we could make improvements for the final design?

From our research findings, there were two big areas the game needed improvement:

User Quotes
Recommendations
Visual Cues and Navigational Patterns
"I can't figure out what this fertilizing thing does, or if there is anything advantageous to it..."
Redesigning the icons and reworking page navigation will help cue Users when they needed to complete an action.
Seed Metaphor & Game Objectives
"So I have to plant these trees, but not with these seeds right? So why do I even have seeds? I'm confused."
Clearer copywriting will help users grasp the concepts, terminology and rules of the game. Or perhaps abandon or rework the metaphor all together.
Concerns

In general, most users enjoyed the tutorial and game mechanics as the "pro-tips" helped them navigate the game play. Our users were still confused about the Tree and Seed Metaphor and small usability issues like scrolling and navigating clickable icons.

Next Steps

While testing validated that this narrative and game concept works, it revealed big red flags that as a team, we need to rethink the game objectives and perhaps use a different metaphor. This initial concept set a great foundation for what the game could be, but it wasn't fully "fleshed-out" and it gave way to many problems I foresee down the road.

If I were to continue down the path with this concept, there are 4 areas to further refine and build out of this concept:

  • Customization and Personalization - of game and characters
  • Multiplayer - incorporate social aspect of sharing, competing, and interacting with other players
  • Focus or Infused Education - focus on educational content
  • More Narrative - leverage storytelling to help users articulate decisions and events

What I learned

This project was challenging to me because it introduced me into the world of game design. Learning how to be a game designer is a whole new occupation and industry in itself.

Successful projects lies on team alignment.
I was on a team with 4 other very skilled UX designers, and I learned the success of the project lies on the strength and alignment of the team. Miscommunication and difference of opinions naturally happen when each designer brings their own unique perspective and skills to the table. What matters is the ability to work together effectively, build team morale, and overcome the barriers that strike us unexpectedly.

Successful projects also lies on solid foundations.
With that being said, I learned how critical the initial concept plays a role in establishing direction of the game moving forward. At the end of first round of testing, the research and data we've collected shed a harsh light that there are holes in the concept of the game. This not only tells me how much more work needed to be done moving forward, but if we had defined game mechanics and game play at the beginning, it would save us time in the long run. As UX and product designers, everything we need to do must be grounded in research and data.

Alternative solution...

Since this project was a design challenge (with a real client) that lasted over the course of 5 weeks, we were restricted in the direction and constraints we've established in this game. I took the research and data we've gathered in our usability tests and decided to do another iteration of what the game could potentially be.

I decided to build upon the "wizard theme" in my first concept to incorporate the feedback I learned from research conducted.

Check out some of the screen designs I put together on my Behance.

Testing with potential users.

After testing with four new users, players voiced that this version felt more like a game because of the interactivity of the motion and the storytelling. The visual design was favorable and the game mechanics were put well in place, however, Susan's resource management lessons were unclear. If I were to continue on this project, next steps is to focus on making those lessons more apparent.

Overall, both versions of the game is scalable to a larger audience and has potential to explore "freemium" models of game.