About the Project Campus Quest is an interactive game that helps students learn essential campus skills through exploration, mini-games, and problem-solving. Players navigate a pixel-style campus, complete tasks like recycling, bus route navigation, and safety awareness, and earn badges for their achievements. The game combines educational content with humor and intentionally quirky interface design.

Inspiration We were inspired to create Campus Quest to make learning about campus resources fun and engaging. The goal was to help students explore, discover, and understand their campus.

What We Learned Building this project taught us how to develop interactive games using HTML, CSS, and JavaScript. We learned about character movement, collision detection, task triggers, and integrating mini-games. We also explored UI/UX design principles, including how to make intentionally frustrating elements fun and engaging.

How We Built It We started by designing pixel-style characters and backgrounds for the campus and mini-games. HTML was used for the main structure and login screens, CSS for colors, fonts, and layout, and JavaScript for game logic, character movement, task interactions, and mini-game functionality. Sounds and badge animations were added to enhance engagement.

Challenges Some of the biggest challenges were balancing a “worst UI” with playability, making mini-games fully interactive, and managing multiple assets for characters, backgrounds, and sounds. Ensuring tasks triggered correctly and badges animated smoothly also required careful debugging.

Built With

Share this project:

Updates