ROLE
Product Design Lead – User Testing, Wireframing, Prototyping, Visual Design, Game Design
TEAM
Madhav Alapati
Jeffery Hata
Tim Lacaba
Jason Nguyen
Clement Vo
Brian Schodorf
Jeff Sun
TIMELINE
Sept 2023 - Dec 2023
OVERVIEW
When PlanetFlip first approached us to design a new educational game for their platform in September 2023, we were a little out of our depth.
We weren’t familiar with the application and didn’t understand exactly what they wanted from us. Additionally, none of us had any prior experience designing a game from scratch, not to mention an education focused one.
Over the span of three months, I led a team in meeting with key stakeholders of the application, conducting user surveys, and prototyping game designs until we finally cranked out a design that not only we were satisfied with, but the organization was satisfied with as well.
00 | FEATURES
How to Play Green Travel
Get to your final destination under the time limit while using less than the allotted fuel. Using different modes of transportation will take up different amounts of fuel and time.
01 | STAKEHOLDER INTERVIEWS
What did the PlanetFlip devs want from our team?
Early on into the design process, we met with the lead developer of PlanetFlip to learn more about the application and to discuss their expectations in detail. From this, we learned a couple of key things:
PlanetFlip RecycleIt Game
02 | SECONDARY RESEARCH
Let's Take a Look at Existing Games
Because no one on the team had specific experience with creating a game from scratch, we took to the game we ourselves enjoyed to figure out what we wanted to create.
Additionally, we wanted to take a look at other existing environmental games to see what lessons they taught.
For example, PlanetFlip itself already features a game called “RecycleIt”, where the user must drag specific pieces of trash to the trash, recycling, or compost. The game is in a 2D vector style and awards points based on whether the user selects the correct bins or not.
We also took a look at other environmental games, such as the ones featured on NASA kids as well as mobile games on the app store. We noticed a couple of recurring themes:
03 | BRAINSTORMING + IDEATING
Fleshing out Potential Game Designs
Now that we had an idea of what the developers wanted from us as well as what other existing games looked like, we began to brainstorm ideas for our game. We split up into groups of two to generate and flesh out each game, coming up with the basic game play loops as well as pros and cons of each.
This led to us having four game designs to work with.
Game Concept #1: Top - Down Map
The player must create a path from the start point to the end destination while staying under the fuel and time limits. Different modes of transportation have different time and fuel costs.
Game Concept #2: Tower Defense
The player must defend against enemies that are hazardous to the environment by placing down specific towers.
Each tower counters a specific type of enemy, so the player must learn what counters what.
Game Concept #3: Choices Game
The player must make certain choices throughout the day that contribute to an overall environmentally friendly score. The higher the score the better.
Game Concept #4: Energy Resource Management
The player must balance a personal happiness meter as well as an energy consumption meter. Certain applications will turn on throughout the house and the player will be given certain tasks to complete.
Looking at our time constraints and our understanding of the expectations from the PlanetFlip team, we decided to move forward with Game Concept #1 on Public Transportation.
We felt that it was the most educational while also having the potential to be fun by increasing difficulty on each level. Additionally it touched on a topic that the PlanetFlip team wanted us to cover, while the others somewhat overlapped with the existing content on PlanetFlip.
To most clearly demonstrate what we had in mind to the PlanetFlip team, we developed several lo-fi wireframes to send to them to get more feedback on.
We tried to match our game's visual design with PlanetFlip's existing design. However, the main focus of this iteration was just getting the main gameplay loop across. As such, we didn't bother with any level design.
Overall the team really liked our game idea and the basic educational message. They wanted to know more details about the game, but gave us the green light to keep ideating and designing. A couple of important things they pointed out include:
We distributed a Google Form survey to other college students that included a short video demonstrating the main gameplay and then asked them questions about the intuitiveness of the game, whether or not they would be inclined to take climate action after playing, and their thoughts on the game’s UI and visual design.
Bus and Trolley Systems Could Be Made More Clear
"It would be more optimized if each train and bus "route" were shown on the map since you aren't supposed to have control over the routes of public transportation"
Visual Design is Boring and Uninspired
"The UI and graphic style could use some work as it looks like a graphic made by the dmv or some government organization which is somewhat dull and unexciting."
Players Wanted to See How Their Gameplay Translated to Real Life
“I think the ending message is the key factor in inspiring people to change. While the game is effective in getting players to understand the objective, transferring that knowledge to the reality around them is highly important in motivating a difference in how people operate.”
Taking the insights from our user survey, we created our final wireframes. Noticeable changes include making the trolley and bus lines visible and making the different modes of transport different colors to make them more distinguishable.
We couldn’t make too many changes to the visual design as we still had to match PlanetFlip’s visual aesthetic, however we did decide to use more uniform looking icons as opposed to the illustrations from the previous iteration.
First Iteration Screens vs. Final Iteration Screens
The biggest change was changing the message at the end of each level to a real world evaluation of the fuel that the player saved. This was calculated by looking at the fuel data provided by the San Diego MTS and calculating the fuel from the blocks that the user traveled.
07 | KEY TAKEAWAYS
As none of us had any experience working on a game prior to this, we were definitely pushed out of our comfort zones on this project.
Before we could even tackle the UI and UX elements, we had to fully flesh out our game design and that took a lot more brainstorming than I initially thought it would. I would sit on Figma trying to figure out how to display certain information before realizing that we still had ambiguities to iron out as a team.
This project also involved a lot of keeping in contact with stakeholders and the PlanetFlip team. As I was the main point of contact between our team and the others, I learned the importance of timely communication, as so much of the project hinged on getting their approval and feedback.
As in the future, the PlanetFlip team will continue to conduct user testing on our game idea, we also had to keep sufficient documentation and notes to ensure that anyone picking up the project would be able to understand our design process.
Overall I had a lot of fun getting to actually fully imagine a game idea, and I would love to see the actual game implemented in the app some time in the future.