Color Dot Rush

How fast are your reflexes? Tap your way to the top!

Comment

Color Dot Rush – Project Story

Inspiration

Color Dot Rush was born from my fascination with minimalist reflex games and the challenge of creating one that feels at home within Reddit’s social ecosystem. The goal was to capture that “just one more try” magic: simple to play yet hard to master, while embracing Reddit’s community-driven nature through leaderboards, daily challenges, and shareable moments.

I wanted players to feel the tension between reflex and cognition, rapidly tapping dots that match a dynamic target color while dodging bombs and false colors. This simple premise evolves into a mental endurance test that blends pattern recognition, timing, and strategy.

The Reddit Devvit Web platform pushed the idea even further. Building a high-performance, production-grade arcade game that runs natively inside Reddit posts (with no downloads) felt like an exciting new frontier for indie web games.

What it does

Color Dot Rush is a fast-paced, neon-themed reflex game where players tap dots that match a changing target color while avoiding bombs. Each correct tap updates the target instantly, forcing quick adaptation and testing both reflexes and focus.

Key Features

  • 🎯 Dynamic Target System: A visible “TAP: RED” cue updates after each correct tap, creating fast-paced cognitive switching.
  • 💥 Bombs, Slow-Mo, and Multipliers: Power-ups and hazards add tactical depth, including slow-motion boosts, golden 2× dots, and explosive bombs.
  • 📈 Exponential Difficulty Curve: Gradual scaling formulas (speed = baseSpeed * growthRate^t) ensure a smooth, challenging progression.
  • 🌈 Neon Pulse UI: Cyberpunk-inspired gradients, glowing animations, and a mobile-first responsive layout.
  • 🧠 Tuned Balance: Designed for average session times of around 90 seconds for maximum engagement.
  • 🏆 Reddit Integration: Leaderboards, daily challenges, and automatic community updates.

How we built it

Color Dot Rush was built for the Reddit Devvit Web platform using a modern TypeScript-based web stack.

Stack

  • Frontend: Phaser.js v3 for graphics and gameplay logic
  • Backend: Express.js with Reddit API integration
  • Build Tools: Vite for fast iteration and optimized bundling
  • Language: TypeScript for full-stack type safety

Architecture Highlights

  • 🧩 Scene Management: Boot → Preloader → Splash → Game → GameOver with a parallel UI scene for seamless transitions.
  • 🔄 Object Pooling: Recycled 50 dots, 20 bombs, and 10 power-ups efficiently to minimize garbage collection overhead.
  • ⚙️ Service Layer: Singleton services for Leaderboard, Storage, and Debug for better modularity.
  • 🧠 Finite State Machine: Controlled transitions between READY, PLAYING, and GAME_OVER states for consistent flow.

Backend and Reddit Integration Enhancements

  • Implemented a Redis-based top-score tracking system that automatically posts congratulatory comments when users beat high scores.
  • Added tagging for previous top scorers to promote healthy competition.

UI Innovation

  • 💪 Four-Tier Fallback System: Primary → Secondary → Minimal → Emergency layers ensure the game remains playable even under partial UI failure.
  • 🖋️ DOM-Based Text Rendering: Replaced Phaser’s text engine with HTML overlays to fix font timing issues and improve accessibility.
  • 📱 Mobile-First Design: Dynamic scaling, 44px touch targets, and full portrait/landscape support.

Challenges we ran into

1. Font Loading Race Conditions
Phaser text objects sometimes failed before fonts finished loading, causing startup crashes. Replacing them with DOM-based text overlays solved this, improving stability and startup time by nearly 50%.

2. Object Pool Timing Bugs
Exit animations occasionally hid active dots mid-screen. A two-step validation fixed this by cancelling tweens on activation and verifying state consistency.

3. Visual Effects Alignment
Glow effects were misaligned due to absolute coordinate rendering. Anchoring them relative to parent graphics objects solved the issue cleanly.

4. Content Security Policy (CSP) Restrictions
Reddit Devvit disallows external resources, so CDN fonts and libraries were off-limits. I reworked the build pipeline to bundle all assets locally, improving performance and ensuring full CSP compliance.

5. Cross-Platform Performance
Maintained 60 FPS consistently across devices using automatic quality adjustment and responsive scaling.

6. Debugging Daily Post Automation
Debugging the automatic posting of daily leaderboard and challenge threads was particularly difficult because only approved apps can access detailed logs in Devvit. This limitation made identifying issues in production more challenging, requiring creative use of temporary local mocks, additional instrumentation, and safe retry logic to ensure reliability.

Accomplishments that we're proud of

  • ⚡ 60 FPS Stability: Consistent frame rates across devices through careful optimization and object pooling.
  • 💎 Error-Resilient Architecture: A four-tier recovery system keeps the game playable even if parts of the UI fail.
  • 🌐 CSP Compliance: Every asset is bundled locally with zero external dependencies.
  • 🧮 Game Balance: Difficulty tuned with exponential formulas to deliver 90–120 second average sessions.
  • 🧩 Neon Pulse UI: A fully responsive, gradient-driven, cyberpunk-style interface.
  • 🏅 Automated Reddit Integration: Weekly leaderboards, top-score comment automation, and tournament-style engagement messages.

What we learned

  • 🔍 Debugging race conditions requires deep lifecycle instrumentation and patience.
  • 🧱 Designing for failure is essential; fallback-first architecture prevents cascading crashes.
  • 📊 True performance comes from structure, not micro-optimizations.
  • 🌍 Progressive enhancement ensures accessibility and adaptability across devices.
  • 🧮 Data-driven balancing makes gameplay fair, engaging, and replayable.
  • 🤖 Automating Reddit interactions with Devvit APIs can transform static games into dynamic community experiences.
  • ✂️ Simplifying moderator tools improved UX consistency and reduced configuration complexity.

What's next for Color Dot Rush

Social and Competitive Features

  • 🏆 Weekly tournaments with bracket-style competition and custom rewards
  • 🏅 Achievements and badges for accuracy, endurance, and milestones
  • 🌐 Subreddit-wide community challenges

Gameplay Expansions

  • 🔮 New power-ups such as Freeze Time and Shield modes
  • ⚡ Additional game modes: Zen (relaxed), Blitz (hardcore), and Color Blind (pattern-based)
  • 🎨 Seasonal visual and thematic updates

Technical Roadmap

  • 🧭 Improved accessibility with screen reader and control options
  • 🧩 Moderator tools for challenge scheduling and subreddit-specific leaderboards
  • 🔗 Public APIs to allow community-built extensions and integrations
  • 🏅 Further expand top-score automation with smarter tagging and AI moderation hints

Color Dot Rush will continue evolving into a Reddit-native arcade platform that combines precision gameplay with community-driven competition and creativity.

Share this project:

Updates