BitBonder is both fun and educational. Players learn about molecules, the structure of elements and their position on the Periodic Table, all under the guise of a series of entertaining mini-games.
Color plays a big role in distinguishing between the families of elements throughout gameplay. Careful consideration went into selecting colors that are both visually distinct and harmonious.
In this game, everyone is a chemist. Students create objects in the Lab by combining elements which promotes recognition and understanding about the relationship between molecules and elements, and the elements’ roles in the world around us.
Playful illustrations in a flat, vector illustration style are friendly, fun, and appropriate for our intended audience.
Players are motivated to discover more elements to get more content that they can share with friends. Leaderboards encourage healthy competition and accountability with parents and/or teachers.
We created an advertisement to excite viewers and ignite their curiosity. This would be posted on Instagram because of its popularity amongst pre-teens.
While the best methods for gathering user insights entail first-hand research, we were constrained by our limited access to our target users (specifically girls in our target age range of 10-14), so we found other ways to collect qualitative data about our users.
We started out by researching existing studies on the underrepresentation of women in STEM activities. We then interviewed women ages 18 to 27 who did not pursue higher education in STEM fields with the intention of gaining insight into why they chose a different path. And finally, we reviewed educational apps that were designed for children and read user reviews, focusing on the substance of what users were saying versus the star rating.
Women remain underrepresented in STEM fields, with the greatest disparities occurring in engineering, computer science, and the physical sciences. Middle school is a critical time for students to be learning STEM subjects, but also is when girls begin to lose interest.
Reasons girls veer away from STEM subjects include:
Educational App Comparison
Apps fall short when they don’t provide adequate explanation of concepts or wrong answers.
Utilizing information collected in our research, we created personas of our target users.
Game Concept and Design
We decided to narrow our focus to chemistry because it’s especially abstract and is one of the fields where women are the least represented. In our personal experience, chemistry is also the point in our science careers where we began to feel particularly alienated in class.
We researched chemistry basics to validate that it is a subject on which we could focus. While brainstorming, we realized that the size, uniformity and variety of the periodic table lends itself to scalability and enjoyable repetitive and comprehensive pattern of gameplay.
We then had a whiteboarding session to brainstorm game ideas and created an initial gameplay flow.
Together, we determined our general goals for the game:
Branding and Visual Design
We wanted BitBonder to be friendly, approachable and fun, as opposed to the current landscape which has a cold, science-y, and somewhat daunting feel. This translated to a visual design that is bright, colorful, energetic, but not inherently “girly.”
We wanted the UI to connect with their real-world counterparts to promote learning and retention, and played with different shapes, colors, speeds and tactility. We started out using circles as a metaphor for atoms, but later chose to use falling squares because they more closely represent the element “pieces” of the periodic table. This choice helped hone our gameplay metaphor and brought cohesion to the overall game system.
The game is built around the periodic table and users are constantly interacting with it. We wanted to take something that typically is seen as daunting and make it more approachable so for the design, we created elements that appear tactile, bite-size and are overall fun to interact with.
Before moving onto high fidelity mockups, we created a design system in order to make sure that everything that was being created would be consistent. This also helped save time and facilitated rapid prototyping, using our mood board to help guide our style choices.
We were eager to test our concept on users and created our first high-fidelity prototype. In total, we created two iterations.
After building a higher fidelity prototype, we tested our game concept as well as our visual design. Users completed the prototype without error and we received positive feedback overall. There were some issues of clarity around some aspects of our visual design which were easily resolved. The next steps would be to test the latest iteration of the prototype.
Creating the Advertisement
We chose Instagram as our platform to reach our target audience because of its popularity amongst pre-teens.
We did a whiteboarding session to come up with our ad concept and created our first storyboard. Using our style guide as reference, we created our assets in Illustrator and created a production-ready storyboard to guide the animation creation.
Our advertisement is intended to excite viewers and ignite their curiosity. It sends the message that science is fun, approachable, and for everyone.
The next steps for this project would be to build out the teacher and parent functionality. This is how parents and teachers are able to monitor students’ progress in the game.