Designing a personal finance adventure game for students on web and mobile platforms paired with an in-class curriculum.

Software: Photoshop, After Effects, Maya, Unity

MindBlown Labs is an EdTech startup that develops products for K-12 students on iOS, Android, and web platforms. 



  • Goal: Create a personal finance adventure game for students paired with an in-class curriculum.

  • Strategy: A mobile+web game that taught experientially through doing rather than a passive format.

  • Timeline: The product was developed over the course of around three years, including prototyping ad testing, an MVP launch, and a final release across North America.

  • Team:

    • Producers - Jason Young (lead), Ty Moore

    • Developers - Keegan Stone (lead), John Tang

    • Designers - Trevin York (lead), Brendan Milos (UX/UI)

    • Art - Brendan Milos (lead), Zeth Carmer (technical animator), Juan “JJ” Lopez (2D), Samantha Pena (3D)

    • QA - Aaron Akagi

  • Define the creative vision and execution of the style, including the art, animation, and UI in collaboration with leadership, engineering and producers.

  • Recruit and mentor an art team to execute the creative vision by defining quality standards, using storyboards, concept art, and exemplar assets, while providing hands-on coaching, refining production work, and leading skill-building workshops.

  • Establish a UX/UI design process in the studio to better align the team by proactively seeking user research and professional consultancy.

  • Define brand guidelines for our visual marketing including trailers, app store pages, social media posts, banners, and the website.

Vision for the Art Style

Bring the aesthetic and energy of comic books to mobile gaming in a vibrant, near-future world that combines imaginative locations with fictional technology.

A behind-the-scenes look at how the art was created.

Reference & Inspirations

Art Goals

How do we describe the player experience?

Art Pillars

What techniques do we use to accomplish our art goals?

Highlighted Work

TnS Gallery Art Style.png
TnS Gallery Face Maker.png
Portfolio_ConceptArt_MBL_ShimaCity.jpg
Portfolio_ConceptArt_MBL_RustysMesa.jpg
Portfolio_ConceptArt_MBL_Costume_F.jpg
Portfolio_ConceptArt_MBL_Costume_M.jpg
TnS Gallery Template-1.png
TnS Gallery Template.png

Research

The initial round of research that I conducted consisted of a mix of student interviews and surveys.

Participants were screened to consistent of college students with a focus on mobile gamers.

The main goals were to get a sense of appeal and clarity of initial style mockups with students. Career preferences noted as well.

Key Takeaways

  • Students were likely to play mobile games several hours a week.

  • The overall aesthetic of the art style looked appealing.

  • When it came to in-game career choices, students gravitated toward more aspirational dream jobs.

Prototype

Once leadership approved of the initial vision for the art style, we began prototyping in the game engine to get a sense of what was feasible given our limited team size.

Character facial and body animations.

Environment animations and lighting tests.

An early version of the UI working in-engine.

Build

The next phase of development involved building a vertical slice of the game for our MVP launch to receive a higher volume of feedback. During this time, I hired an art team that would help speed up production and elevate the overall quality of the art.

Screencaps from the MVP launch.

Test

The MVP release taught us a lot about how far off the mark we were. While the release had some delightful moments, overall players would get confused as to what their next steps were.

Feedback summary from external game developers mentoring our team.

Key Takeaways

  • Usability issues stemmed from an underlying lack of UX/UI design process in our studio.

  • Frequent user testing on smaller portions of the game would help our team correct pain points more quickly.

  • We needed to breadcrumb more tutorials every time we added a new feature or educational topic.

Iterate

The feedback from the MVP launch gave me an opportunity to take the lead on refining our studio development to be more user-focused, and continue seeking UX/UI design mentorship through accelerator programs.

UX/UI Design Process

Launch trailer for the game.

Conclusion

This project made me realize how important UX/UI design process is to any game or app. While I learned a lot, I also came to appreciate how much more I can improve in this area.

My favorite part of creating this project was getting the chance to bring a creative vision to life and rally a team behind it.

Seeing students get “aha!” moments when they learned something about personal finance while testing the game was surprisingly enjoyable.

The lessons I learned shipping this project have stuck with me ever since.