Roles: Character Designer, Asset Designer, UI/UX
Tools: Figma, Adobe Illustrator, Procreate, Adobe AfterEffects
Collaborators: Robin Hunt, Daniel Onufer
THE PROBLEM
The severe underrepresentation of women in STEM fields and lack of empowerment can cause young girls interested in STEM to lose interest in the field. Therefore, our project aims to address this issue by creating a fun and engaging game that not only encourages their interests but also helps alleviate the problem.
THE PROCESS
RESEARCH: Women are significantly underrepresented in STEM fields, facing biases and stereotypes from a young age that discourage their interest and success in these subjects. This is reflected in lower numbers of women receiving degrees in computer science, engineering, and physical sciences, as well as a gender pay gap and greater obstacles for women of color. The lack of female role models in STEM exacerbates the issue, emphasizing the need to address societal biases and promote diversity and inclusion in education and media. A study specifically focused on botany research found that women comprised only 38% of authors of plant science papers in 2017, and were less likely to hold prestigious positions as first or last authors.
SOLUTION: According to Microsoft's study, a supportive learning environment is crucial for students, which entails teachers, mentors, and parents being attentive to their needs. Additionally, students benefit from seeing how STEM subjects are applicable in real-world scenarios, thus requiring a curriculum focused on practical applications. To maintain their interest and investment, engaging materials that incorporate interactive, and building challenges are recommended. Our challenge is to create an enjoyable learning experience. Considering that 59% of girls conceal their gender identity while gaming online, we decided to design a single-player game. The fact that 95% of adolescents in our age group own smartphones gave us confidence in our decision to create a mobile game. Open-concept exploratory games are popular among our demographic.
OUR APPROACH
VISUAL DIRECTION
Our team started off by splitting up and creating mood boards for our vision for the visual direction of the game to pitch to each other. We landed on “Herbal Turtle”, a 32-bit, exploratory botany game with an open-world concept and a cosy environment.
Our team started off by splitting up and creating mood boards for our vision for the visual direction of the game to pitch to each other. We landed on “Herbal Turtle”, a 32-bit, exploratory botany game with an open-world concept and a cosy environment.
LO-FI WIREFRAMES
We then created 3 wireframe task flows that illustrate 3 different missions in the game including, identification, propagation and removal of invasive species. We found that this was crucial to nail down before beginning to create the assets for the game.
We then created 3 wireframe task flows that illustrate 3 different missions in the game including, identification, propagation and removal of invasive species. We found that this was crucial to nail down before beginning to create the assets for the game.
GAME ASSETS
After which we split off to make the various assets need to bring the game to life such as characters, plants and environment. The plants and environment were modelled after the nature of the Pacific Northwest, with the idea of unlocking new regions should we expand the game. For the game UI, we referenced atomic design principles; these UI assets would be considered atoms. We then composed into molecules and organisms to create templates to meet the needs defined in our task flows.
After which we split off to make the various assets need to bring the game to life such as characters, plants and environment. The plants and environment were modelled after the nature of the Pacific Northwest, with the idea of unlocking new regions should we expand the game. For the game UI, we referenced atomic design principles; these UI assets would be considered atoms. We then composed into molecules and organisms to create templates to meet the needs defined in our task flows.
HI-FI WIREFRAMES
Having all our assets created, we are now able to move on to bringing our lo-fi wireframes to hi-fi interactive task flows using Figma.
Having all our assets created, we are now able to move on to bringing our lo-fi wireframes to hi-fi interactive task flows using Figma.
USER TESTING
Moving towards the end of the project, we gathered a small group of our schoolmates and walked them through the 3 task flows, prompting them to bring up any confusion and concerns to us.
- Were not able to tell that the plants were interactable
- Felt that there should be more little achievements at the end to encourage the user
- Minor UI feedback (increasing the size of checkmarks)
Moving towards the end of the project, we gathered a small group of our schoolmates and walked them through the 3 task flows, prompting them to bring up any confusion and concerns to us.
- Were not able to tell that the plants were interactable
- Felt that there should be more little achievements at the end to encourage the user
- Minor UI feedback (increasing the size of checkmarks)
FINAL TASK FLOWS
Taking all the feedback into account, we refined our wireframes. A problem we faced during the whole project was Figma being unable to support all the assets in the file, because of this, the animations in our prototype were very slow and clunky. Our solution was to record the task flows on our device and import them to an editing software to speed up the slow moments. This created a much more smooth way to show how the game works! Check out the task flow prototype in action!
Taking all the feedback into account, we refined our wireframes. A problem we faced during the whole project was Figma being unable to support all the assets in the file, because of this, the animations in our prototype were very slow and clunky. Our solution was to record the task flows on our device and import them to an editing software to speed up the slow moments. This created a much more smooth way to show how the game works! Check out the task flow prototype in action!
