MentaMorph
Objective: Created a dashboard where educators are able to engage students in educating them about financial literacy, showcase the game, and provide interactive feedback
Timeframe: 5 weeks
Role: UX Researcher
Team members: 2 UX Researcher; 3 UI Designers; 1 Project Manager
What is Mentamorph?
The MentaMorph Money app utilizes a gaming format that integrates elements of financial decision-making to simulate real-world experiences. The game features numerous scenarios, followed by increasing levels of complexity
What was our client looking for?
When my team and I met our client for the first time, she gave us background information about her business and how she wanted to present game data for for teachers to track their student’s progress on a dashboard
Our client was looking for ways on how teachers:
tracked student progress
incorporated feedback for their students on how they were learning financial literacy
onboard their class onto a dashboard platform
What measures did we take to provide user insights?
How did our Client perceive engagement?
I attended a game demo that my client hosted and I was intrigued by how my client facilitated discussions on how we played the game, based on the scenario that was given. She asked us how we came to make our financial decisions (examples: How did you feel when you had to save for emergency expenses?) and asked us how we felt during each level of the game
I constructed questions based on the demo for our user interviews to assess classroom engagement strategies and discussion facilitation
After finishing our interviews, I helped synthesize our results, and here are some common thoughts that our users had while they engaged with students.
What were our design principles?
Streamlined Onboarding Process
Intuitive Dashboard Elements
Simple but Effective Metric Tracking
Everyone sketched various components for our wireframe dashboard and our UI designer compiled everything onto a master sketch. I further made some adjustments for the highlighted features after I received feedback from our users from our first round of usability tests
How did our users react to our Low Fidelity Wireframes?
I kept going back and forth on our design principles to help structure wireframes with our UI designers and formed three tasks for our users to follow to gage feedback
We had 4 users to test our wireframes and all of our tests were moderated via recorded Zoom call
We needed to create more control from the dashboard home page to view data for modules and create distinct headings for graphs and modules
How did I improve our interface based on user feedback?
Reorganizing Metrics with clear distinctions:
I came together with my team to see how the graphs needed to be adjusted and what information was crucial for teachers to see
In order to draw out my ideas on how to organize metrics:
My client provided a guideline of metrics she wanted to prioritize from her education document
Logo Redesign:
I became inspired to test different tools that my teammates were using, so I helped redesigned Mentamorphs Butterfly logo by using the Figma vector tool, and eventually, we used it to see if it matched the colors in our style guide
Before
After
Module Heading Improvements
Reflections
As I worked with my team, there were many skills that I grew over time and I am curious to endeavor how to strengthen my knowledge:
I learned that
Patience is required to recruit users to interview and to foster authentic conversations. There were moments when I felt convinced that I wasn’t getting users in time, but I learned how to work with my team to create a guideline on how much time we needed to recruit users
Consistency and structure are crucial to relay information that is beneficial for users
I struggled with how to create a structure for myself and with the tools that I acquired with my team (Trello) I was able to stay organized