💡 Inspiration
Standard merge games are highly addictive but usually static, isolated, and solo experiences. We wanted to build something that feels native to Reddit—an experience that turns the casual merge genre into a social, competitive community event. By introducing daily synchronized runs, competitive subreddit rankings, and direct community raids, we transformed a solo puzzle game into a cooperative Subreddit War.
🎮 What it does
SnooDrop is an interactive, physics-based 2D merge game built on Devvit where players drop Reddit-themed elements (Upvotes, Comments, Posts, Awards) into a container.
Key Features:
- Reddit Merge Physics: Custom Matter.js physical bodies representing Reddit-themed items.
- Synchronized Daily Runs: A new sequence of drops is synchronized globally from a daily seed every 24 hours, ensuring fair, skill-based competition.
- Subreddit War & Raids: Players contribute their high scores to their subreddit's war standing. They can spend points to "Raid" rival subreddits, deploying obstacle Downvote traps into their opponents' boards.
- Custom Glowing User Flairs: Players who successfully merge elements up to Tier 12 (Cosmic Reddit Master) are automatically awarded custom, glowing, prestigious User Flairs directly to their Reddit profile in the subreddit.
- Player Profile Card & Leaderboard: A sleek HUD showing the player's personal best, global rank, percentile standing, unlocked badges, and daily top-10 streaks. Includes 3 filter views: Today's Highscores, Top Streaks, and All-Time Global.
🛠️ How we built it
We used a modern, high-performance web stack integrated with Reddit's APIs:
- Backend: Reddit's Developer Platform (Devvit) running a serverless Node.js Hono router with Redis databases for leaderboard tracking, active streaks, and raid synchronization.
- Frontend: Phaser 2D Game Engine utilizing Matter.js physics inside the Reddit iframe.
- Prioritized Preloading: Optimized asset loading by only fetching initial gameplay sprites (Tiers 1-5) at startup (speeding up lobby boot times by 60%) and loading advanced assets (Tiers 6-12) in the background.
- Responsive Layout: Engineered canvas scaling grids to support seamless mobile touch interfaces and desktop layouts.
- Web Audio Synthesis: Synthesized retro sound effects dynamically using Web Audio APIs, complete with a persistent localStorage-saved mute button.
🚧 Challenges we ran into
- Physics Glitches: Matter.js sometimes allows high-speed objects to overlap. We resolved this by building a custom deferred merge queue to process collisions sequentially and implementing a squash-and-stretch jelly animation to absorb impact.
- Responsive Canvas Scaling: Designing a UI that feels premium and legible both on narrow mobile Reddit feeds and expanded desktop screens required complex container scaling in Phaser.
🏆 Accomplishments that we're proud of
- Fulfilling every single retention mechanism recommended by the Reddit team (Daily Streaks, Leaderboard systems, and Custom Reddit User Flairs) in one unified, polished package.
- Creating a highly competitive community loop where subreddits can actively raid each other and compete in a global war.
- Implementing prioritized asset loading to ensure the game opens instantly for users browsing Reddit.
🧠 What we learned
- The power of Devvit serverless architecture and Hono routing within Reddit posts.
- Managing player retention through synchronized daily seeds and visual profile progression.
🔮 What's next for SnooDrop
- User-Generated Traps & Obstacles: Letting subreddits vote and customize their own layout of obstacles.
- Real-Time Duels: Enabling players to merge items in real-time split-screen matches directly in the comments section.
Built With
- css3
- devvit
- hono
- html5
- javascript
- matter.js
- node.js
- phaser.js
- redis
- typescript
- vite
- web-audio-api
Log in or sign up for Devpost to join the conversation.