Code Championship
What is Code Championship?
Code Championship is a fun, competitive, and friendly virtual coding game for new and experienced coders from 3rd to 9th grade. Similar to sports, competitive coding is fun and pushes young coders to be great through tournaments and head-to-head gameplay.
The Problem?
Even though Code Championship is a game for kids, it is not an easy game to understand and the interface lacks a game-like look and feel. It is somewhat complex and requires the user to watch a video to learn how the game is played.
How can we create a more approachable and fun learning environment for kids to explore code in a way that is still fun and engaging?
Team
Additional Team Members: Christian Arias, Liz Brood, and Mackenzie Leach.
Role: Researcher, Testing Moderator, Product Designer.
Methods: Cognitive Walkthrough, Moderated Remote Think Aloud Testing, Group Information Synthesis,
Tools: Zoom, Invision, Google Suite, Sketch, Photoshop,
Research
Cognitive Walkthrough
The initial research for this project began with a cognitive walkthrough of the Code Championship website by identifying the primary user tasks along with their goals. In addition to noting these tasks and goals, each action was evaluated for the following usability including categories: Mental Model Matching, Visibility/ Hierarchy, Mapping/ Consistency, and Feedback.
Our initial research showed that the gaming experience as a whole had a variety of potential pain points that were due to mental model mismatches, visibility/ hierarchy issues, a lack of mapping/ consistency, and some errors with feedback.
Group Synthesis
After completing our individual Cognitive Walkthrough, our team worked together to compile our data to identify potential pain points, project goals, questions, and tasks for a contextual interview. Key task goals included: Understanding the rules, playing the game, programming a bot, and understanding what a bot number is. From this synthesis, we were able to craft a script for a contextual inquiry interview.
Contextual Inquiry
With our Research-based script in hand, we conducted a 45-minute zoom contextual inquiry with a 4th-grade user to observe how they were able to navigate the website, play the game, and to what degree the game and concepts were understood. We also asked about her background and how she was feeling to evaluate how relevant this website was to her and track her emotional changes throughout the entire experience.
Research Findings and Prototype Planning
From the observations and findings from our contextual inquiry, a Research Findings and Prototype plan was created. From our inquiry, key opportunity areas were identified and some user stories were created to add rationale to the changes that were made to the Code Championship website. Along with these stories and key opportunities, an architecture diagram was made to map out key changes within the website and what pages needed to be added.
Prototype Walkthrough
A new interactive prototype was then created in sketch and added to Invision. This prototype had a variety of changes that were made based on our research to improve how the game is understood/ played become more user-friendly for new coders.
Key changes included: Adding a walkthrough feature with a small character to promote a better understanding of the game, changes to the layout of the website page and in gameplay for better hierarchy and visibility, and language changes to make the game more relatable to a younger audience.
Future changes to the website would include: More walkthrough and hint features, better feedback features to the in-game play, and creating a key for every game to better identify game variables for users.
Feedback
“Wow... this is incredible. As always, there are great ideas that would be really challenging to implement, but I feel like the biggest “wow” moments for me are the, “This is so obvious, how come I didn’t think of that.” The share with a friend link is so great and is something that won’t be too hard to implement. And adding the name before they ever get to building the bot is genius! That’s going to clear up so much confusion! That’s fantastic! Thank you so much! (And let me know when I can get back in line!)” - Luke Schlagen, Code Championship Founder
Gillette Children's Hospital- Usability Review
BootUp- Rapid Prototyping
Ready. Set. Pivot