Multi Snake

A fast-paced multiplayer Snake arena where friends battle in real time, use power-ups, grow their snakes, and climb a global leaderboard. A modern spin-off of the classic Snake game.

Comment

Inspiration

We wanted to recreate the nostalgic fun of classic Snake, but reimagined for today: fast, social, and competitive. Our goal was simple:

  • Play with friends instantly

  • Compete in real-time

  • Host/join rooms without friction

  • Track global high scores

  • We wanted a game that anyone could jump into in seconds, yet still feel polished, modern, and multiplayer-ready.

What it does

MultiSnake is a real-time multiplayer Snake arena where up to four players battle to survive the longest, score the highest, and dominate the global leaderboard.

Players can:

  • Create custom game rooms

  • Enter a name & join with a 4-letter code

  • Choose grid size, speed, and round duration

  • See names floating above snakes

  • Compete live with smooth movement & collision detection

  • View post-game results

  • Browse the leaderboard directly from the home screen

How we built it

We built MultiSnake using a modular full-stack architecture that supports real-time gameplay:

Frontend:

  • HTML5 Canvas for rendering snakes, food, and name labels

  • Vanilla JavaScript (ES modules) for game state, input handling, and UI screens

  • Tailwind CSS for fast styling and responsive layout

Backend:

  • Node.js + Express for room creation and server logic

  • Socket.IO for real-time movement syncing, collision detection, and state updates

  • Custom tick-based game engine for snake movement, food spawning, wrapping rules, and multiplayer interaction

Database:

  • MongoDB Atlas storing game results, winners, scores, duration, and total players

Leaderboard displayed directly on the home screen and updated after each match

Challenges we ran into

We faced several tough problems while building a real-time multiplayer game:

  • Synchronizing multiple players without lag Movement timing, input buffering, and preventing 180° turns needed careful logic.

  • Accurate collision detection Handling:

  • self collisions

  • body-to-body collisions

  • head-to-head collisions

  • Scaling the UI with Canvas Names floating above snakes had to stay readable across different grid sizes and devices.

  • Database permission issues Setting proper MongoDB Atlas roles and making the leaderboard load correctly took troubleshooting.

  • Room resets Keeping colors, names, and initial positions consistent after “Play Again” required restructuring the game state.

Accomplishments that we're proud of

  • Built a fully working real-time multiplayer Snake game from scratch

  • Achieved smooth Canvas animation with consistent 8 FPS tick logic

  • Implemented a persistent global leaderboard with MongoDB

  • Designed a clean, modern UI with Tailwind

  • Added customizable game settings: grid size, timer, speed

  • Supported multiple rooms, multiple players, and stable resets

  • Took a classic offline game and turned it into a fun, competitive multiplayer experience

What we learned

This project taught us a lot about:

  • Real-time communication using WebSockets

  • Designing multiplayer game loops

  • Efficient collision algorithms

  • Structuring frontend JS with modules

  • Using MongoDB Atlas + handling permissions

  • Managing complex state across multiple clients

  • Debugging gameplay issues under time pressure

What's next for Multi Snake

We have several improvements planned:

  • Power-ups like shields, speed boosts, and enemy disruptors

  • Mobile touch controls for universal play

  • Public lobbies and matchmaking

  • Custom snake skins + cosmetics

  • User accounts and long-term player stats

Built With

Share this project:

Updates