Discord Buildathon · Full-stack game app
Disjoint
A virtual office that lives inside Discord. Your avatar walks around a top-down map, and as you enter the Arcade, the Meeting Room or the CEO Office, your actual Discord voice channel switches with you.
- Context
- Discord Buildathon
- Role
- Developer: SDK, gameplay zones, frontend & backend
- Platform
- Discord Embedded App (web)
- Backend
- Node.js + Express
How a room switches your voice channel
The core interaction, step by step
- Sign in through DiscordDiscord OAuth, then the app retrieves your guild and its channels.
- Walk the officeYour avatar moves around a top-down map rendered with Phaser 3.
- Enter a roomPhaser collision and overlap detection notices you entered a zone.
- Channel switchesThe zone is mapped to a voice channel, and you're moved there live.
What I built
Discord SDK integration, gameplay zones, frontend and backend
- Discord integration: OAuth, guild/channel retrieval and real-time zone-to-channel mapping.
- Gameplay zones: Phaser collision and overlap detection driving live channel switching.
- Full stack: a React + Vite frontend around the Phaser 3 game layer, and a Node.js + Express backend.
- Analytics: PostHog events for user behaviour.
The challenge
An Embedded App runs inside Discord's client, not on a page you control, so shipping it meant working through real deployment pain: CSP fixes, auth errors and API edge cases.
The approach
Let the map drive the voice chat. Rooms are zones on the map, entering one is a Phaser overlap event, and the zone-to-channel mapping turns that event into a live voice channel switch.
Keep exploring
Want a game where it doesn't usually live?
I'm open to game development roles, freelance projects and collaborations, in Pakistan or remote.