< Back to Projects

Mathropolis

Solo Project

*****

June 2025

Game Homepage Game 'Training Tower'



Overview | Origin | Development | Lessons


Overview

Mathropolis is a web-based educational game designed for Calculus 12 students, turning textbook learning into an immersive ninja-themed adventure. What sets it apart is its direct alignment with the Nelson Calculus 12 textbook used in most schools, ensuring that students stay on track with their actual curriculum. Players customize their avatars, enter the Kingdom of Calculus, and progress through chapters (scrolls) by completing interactive lessons in the Training Tower and demonstrating mastery in the Challenge Grounds. It includes game modes like Quests (story-driven math puzzles) and Exam Trials (no-hint assessments) with real-time feedback. As students train, they earn XP, unlock gear, earn badges, and visualize their journey through animated and gamified content, making learning both rigorous and rewarding.

***Attention: The website is no longer functional as the supabase config (used for user sign in) has expired. You can see it here though ↓

Origin

It's almost summer 2025 and I realize that in about 2 months I'll be starting my first year of uni as a CS student. I want to prepare ahead, and what better way to do that than attend a hackathon?

I make a Devpost account and stumble across 'the worlds largest hackathon' presented by bolt.new. Baisically, they give you a ton of free credits on bolt, and you vibe code your project. They also had other promotions form several other companies like supabase, elevenlabs, e.t.c that you could use to enhance your project. The only problem? The deadline for the hackathon as almost over. I signed up anyway, and the next few days took me through a whole journey.

Development

The entire project was made using Bolt, an AI-assisted web app development platform. I structured the entire game based on the Nelson Calculus 12 textbook, designing a world where each chapter became a scroll and each lesson a sublevel. While the initial ideas were all mine, I used ChatGPT to brainstorm game mechanics, write lesson logic, craft ninja-themed quest storylines, and fix broken flows. I then used prompts to generate UI components, lesson logic, test modes, and progression systems. Although Bolt handled much of the initial structure, I had to step in regularly to revise code, implement fixes, and adjust logic manually, especially as the project became more complex. Eventually, I also began editing the code directly using trial-and-error testing, as I ran low on tokens and the AI failed to understand some of my prompts. Finally, I used Supabase for authentication and data storage, and Netlify to deploy my project.

Since this was my first time building a large-scale coding application, I had to research everything from structuring to connecting with tools like Supabase. That process took a while, and by the time I became comfortable, I was low on tokens, which meant I had to be very specific and efficient with each prompt.

On the AI side, logic inconsistencies were a recurring issue. Often times, Bolt would only partially implement instructions or misinterpret structural prompts, especially when it came to making complex elements like the Kingdom map or the avatar system. In several cases, I had to resort to inserting images manually or editing the code myself. Even when content was generated, lesson screens would sometimes blank out because the AI failed to load or embed the interactive elements correctly. Finally, almost all features from login to navigation required careful restructuring of the game's logic through repetitive manual testing, which was pretty tedious.

I have a recorded series on the development of this project, which I'll link below. If you're only interested in the technical details though, please feel free to checkout this .


Lessons

I learned a lot through this hackathon. Firstly, VIBE-CODING IS A SKILL. Not anyone can just do it T_T.

I also learnt how to take a large vision and break it down into manageable, workable components (yes, even AI needs small parts to work with it, and I learnt that the hard way :)). I also became much more confident with project management, logical sequencing, and debugging along the way. Most importantly, I learned how to work within real-world constraints, whether that was time, platform limitations, or a limited token budget. Additionally, this was my first time editing code in a large-scale app, as I had to step in and make changes myself using both prior knowledge and what I learned online. That experience alone taught me a lot, and I must say, I was also genuinely impressed by how clean and readable Bolt’s generated code was!

All in all though, to really get the most out of vibe-coding you really need to know that stuff. AI is still developing, and I don't really think it's at the point yet where you can make a complex app through just prompting and not stepping in to fix the code time to time (note here, this is a 2025 opinion).