Inspiration
At most high schools, students are required to show proficiency in certain subjects to graduate. Now there’s a push to include computer science as one of those subjects. Millions of students are learning computer science and how to code, yet not all students have equal access to learning opportunities. According to Code.org’s in depth research, schools reaching the most diverse student groups are far less likely to offer computer science. Additionally, according to Google and Gallup’s report on Diversity Gaps in Computer Science, a lack of exposure is a major reason why women and racial and ethnic minorities as well as LGBTQ+ are underrepresented in CS fields. We are on a mission to address the issue by giving every student the opportunity to learn computer science. Although our target audience is high school students, we hope that our web app is helpful to anyone who is looking for an engaging, friendly, and approachable way to learn code.
Imagine the limitless possibility of being able to efficiently learn code while playing a strategic adventure game where you can select a unique character, strategically choose your path, collect precious items (i.e infinity stones), and slay various dragons. Currently, there are websites such as hackerrank and edabit that allow individuals to learn code… but in a monotonous way. Our game web app combines our love for video games and our shared vision of giving all students opportunities to learn coding in a beginner-friendly, approachable, and fun way.
What it does
CodeVenture: Dungeon Edition is a wizard-themed adventure game that allows the player to explore different paths, collect items, and defeat creatures in order to save a young wizard’s family while completing coding challenges all at the same time. It contains varying levels of difficulty to test the player’s CS skills as they move through the puzzle. The questions range from basic syntax of programming languages to algorithms.
How I built it
We first planned out the contents of the game (such as the different paths, items, challenges) using a whiteboard + sticky notes which included many iterations. Then, we built a web app using Python + Flask and designed the game layouts. We mainly used vanilla JS and basic HTML and CSS in order to have the most flexibility in the game.
Challenges I ran into
This was our first time building a game web app, so we were surprised at the amount of planning that goes into a strategic adventure game. Majority of our time was spent on detailing the player’s moves and coding out the full functionality of the game. This was a big challenge that we ended up successfully implementing.
Accomplishments that I'm proud of
Since this was our first time building a game web app, we were proud to include these functionalities in the game:
- Player cannot go down a path if the creature is undefeated (coding challenge has not been answered or was answered incorrectly)
- Doors unlock and treasure chests open depending on if the player has collected the required items
- Varying coding challenge difficulties depending on the items and paths taken
- HTML/CSS elements like placing items in the inventory box, creatures disappearing when defeated, etc.
What I learned
For one of us, it was our first time using Flask and building a fully functioning web application. It was also our first time building any sort of game web app, so we learned the basic components that go into building an adventure game along with learning more about backend and frontend web development. Finally, we used Microsoft Azure for the first time!
What's next for CodeVenture: Dungeon Edition
We hope to incorporate different modes within the game, such as adding C++ and Java versions along with an algorithmic mode and HTML/CSS syntax mode. This would give the user more flexibility in choosing what they would like to learn. We also hope to expand the current game map with more paths, items, characters to choose from and with more puzzles and coding challenges. We hope to incorporate a login functionality so players can save their progress and include a shareable post at the end of the game for players to share their game completion with friends on social media.

Log in or sign up for Devpost to join the conversation.