Scribble Fighters

draw your characters and watch AI bring them to life!

Inspiration

Some of our favorite childhood memories came from drawing silly and magical creatures and imagining them coming to life. For TreeHacks, we wanted to bring back this sense of nostalgia, amazement and feeling of pure imaginative joy. That's why we created Scribble Fighters, a multiplayer game that transforms doodles into playable fighters using AI.

What it does

Scribble Fighters is a 1v1 multiplayer battle game where players battle each other with their creativity. Players draw creatures of their choices - giant turtles, snakes, to tanks - the sky is the limit! GPT then interprets these drawings, giving each creation a unique name, stats (health, attack damage), and abilities (melee attacks, projectiles). The game is balanced through an ink economy where bigger / detailed drawings are rewarded with stronger stats, but consume ink players need to summon more drawings into the battle. Battles play out in real-time with physics-based environments, with a chat your friends can use to while an AI avatar provides live commentary. Last player with drawings standing wins!

How we built it

Frontend: Next.js, React, Tailwind CSS, Phaser (js game framework), Backend: Colyseus (multiplayer server and live chat), Matter.js (server side physics), Express AI Pipeline:

GPT: Analyzes drawings, generates a structured fighter config with abilities and stats, and provides battle commentary
HeyGen LiveAvatar SDK: AI video commentator

Challenges we ran into

This was our first time vibe coding a project. While we found that getting ideas into code was significantly, debugging became difficult since we had less intimate knowledge of what was actually happening. As such, we spent lots of time tracing through a codebase we were unfamiliar with. This tradeoff taught us that AI-assisted coding excels at rapid prototyping but requires deliberate effort and code reviews to maintain code comprehension.

Accomplishments that we're proud of

Overall, we are proud of building a procedural content pipeline where any drawing becomes a unique playable entity with different abilities. We also explored game design fundamentals by creating an ink economy that forces meaningful strategic choices, and polished the battle feel with projectile trails, knockback physics, and death animations that brought the hand-drawn sprites to life.

What we learned

One of things we learned was how to get reliable AI output for game mechanics. Getting GPT to consistently return valid, balanced fighter configs meant iterating on structured prompts, defining clear rules for stat scaling based on ink investment, and building fallback configs to ensure creative drawings never crash the game.

What's next for Scribble Fighters

More abilities: some examples could include shield, healing, teleportation, summons
Team battles: 2v2 or free-for-all (e.g. battle royale style)
Arena variety: walls, platforms, hazards like spikes or lava that can damage your drawings