Lessons in coding for the younger generation

Our process involved mapping themes from SciGirls episodes, crafting engaging animated sequences for storyline exploration, designing interactive quizzes that reinforce the educational content, and building the entire game from scratch. What began as a paper prototype quickly evolved into a fully realised digital experience.

We had to make sure the game worked on older web browsers like IE11 and less advanced mobile platforms. We used webGL technologies like Pixi.js and Tiled (a visual tile map editor) to design the levels. The game was deployed on the TPT platform using the Springroll framework. This allowed us to support important accessibility features like subtitles, captions, and sound controls.

In terms of design, we faced a unique challenge because the show didn’t cover many of the subjects we incorporated into the game. This meant there were limited visual references to draw upon. We focused on developing a coding interface that was both visually appealing and user-friendly, while also ensuring ample screen space for gameplay visuals. This involved multiple iterations to strike the right balance. Additionally, we adopted a tiled sprite system to provide level designers with maximum control over level creation.

The success of the game exceeded our expectations. Beyond teaching coding, we introduced concepts like spatial relativity. Test audiences embraced this new learning dimension with confidence and ease. In the words of one young user, “I really liked the game. I want to code when I grow up.”

Code Quest successfully empowers young girls to explore STEM subjects with confidence and enthusiasm.