• 

  drawin territory

• 

  game over

• 

  capturing opponents territory

• 

  rules

• 

  settings

• 

  how to play

• 

  dashboard

Drawin

Drawin is a fast-paced territory-capture web game where players draw their way across the map, take risks outside their territory, and compete to control as much of the arena as possible.

What inspired us

We were inspired by the simple and addictive nature of territory-based games. We wanted to take that idea and build our own experience around a simple question:

How much territory are you willing to risk everything for?

The result is Drawin — a game where every expansion is a decision between playing safely and taking a bigger risk.

How we built it

Drawin was built as a browser-first game using TypeScript, React, Vite, and Phaser.

The game uses a grid-based world to manage territory efficiently. Players begin with a small area, leave their territory to create a trail, and must safely return to capture the space enclosed by that trail.

We also implemented AI opponents with different behaviors to make the arena feel active and competitive. The game was designed around short, replayable matches where players can immediately understand the objective but gradually improve their strategy.

A major focus was game feel. We worked on responsive movement, smooth trail rendering, territory capture animations, collision feedback, particles, sound effects, and UI transitions to make every expansion feel satisfying.

What we learned

Our biggest lesson was that a simple game mechanic can require surprisingly complex systems behind the scenes.

Movement, trail generation, collision detection, territory calculation, AI behavior, rendering, and performance all have to work together smoothly.

We also learned that polish matters as much as features. Instead of trying to build a huge game, we focused on making the core loop feel responsive, satisfying, and fun.

Challenges we faced

One of our biggest technical challenges was determining which part of the map should become the player's territory after completing a trail.

We solved this using a grid-based approach and flood-fill style territory calculations, allowing us to efficiently determine captured areas without relying on expensive geometry operations.

Another challenge was making collisions feel fair. In a territory game, a tiny movement or collision mistake can completely change the outcome of a match, so we spent time tuning movement and collision behavior to keep the game competitive without making it frustrating.

The result

Drawin turns a simple idea into a competitive loop:

Draw → Risk → Return → Capture → Expand → Repeat.

Our goal was to create a game that takes only a few seconds to understand, but keeps players coming back because they always feel like they can capture just a little more.

Draw your territory. Risk everything. Own the map.

Built With

• css
• github
• html5
• phaser.js
• react
• tailwind
• typescript
• vite
• webgl