Colony is a gamified virtual space where users can build, explore, and interact. Inspired by Zep.us, it blends 2D RPG aesthetics with modern communication tools like proximity chat and video calls.
To create a decentralized, user-editable metaverse where "Map Sections" act as isolated communication hubs. Whether it's a private home, a corporate office, or a digital concert hall, Colony provides the infrastructure for social presence.
- Phaser 3: Our 2D game engine. You'll need to learn about Scenes, Sprite manipulation, Tilemaps, and Arcade Physics.
- React + Tailwind CSS: For the UI overlay (Chat, Settings, Dashboards).
- Shadcn UI: For premium, accessible components.
- Zustand: For lightweight state management (syncing game state with React).
- Bun: A fast JavaScript runtime.
- WebSockets: The core of multiplayer. You'll learn about broadcasting, rooms (subscriptions), and binary data optimization.
- WebRTC: For peer-to-peer video and audio calls. This is a big one! Look into Mediasoup or LiveKit for scalable SFU implementation.
- Tiled Map Editor: A standard tool for creating
.tmxor JSON maps. - Tilemaps in Phaser: Learning how to parse these maps and handle collisions.
- The Concept: Define "Rectangles" in your map as specific zones.
- Implementation: When a player's coordinates enter a
ZoneID, they automatically subscribe to that zone's chat room and video channel. - Proximity Chat: Audio volume depends on the distance between players.
- Implement a "Build Mode" where users can place tiles (walls, floors, furniture).
- Store these maps in a database (like MongoDB or PostgreSQL) as JSON objects.
- Interpolation and Extrapolation: Techniques to make other players' movement look smooth even with lag.
- Phaser 3 Documentation & Examples
- WebRTC.org - Getting Started
- Multiplayer Game Architecture Patterns
# Backend
cd server && bun index.ts
# Frontend
cd client && npm run dev