Inspiration

I grew up solving Hidato puzzles in the newspaper and spent way too many hours on pixel art as a kid. One day, it just clicked: what if solving a number puzzle revealed pixel art? That "aha" moment became Pixel Path. I wanted to build a puzzle game that not only challenges players individually but brings a subreddit community together through shared daily puzzles and player-created content.

What it does

Pixel Path is a daily number-tracing puzzle game embedded natively in Reddit. Players trace a sequential path (1→2→3→...) through a grid by tapping adjacent cells, including diagonals. As they solve correctly, each cell reveals a color, and a hidden pixel art image gradually emerges. The game features:

  • Daily puzzles with a community leaderboard.
  • Architect Mode lets anyone design their own pixel art and submit it to the community. After which, the algorithm automatically converts the art into a puzzle.
  • Moderation tools for curating the best user-created puzzles as daily features.
  • Competitive rankings based on solve time.

How I built it

Pixel Path is built on Reddit's Devvit platform using a modern web stack:

  • Frontend: React 19 + TypeScript with Tailwind CSS for responsive, mobile-first design
  • Backend: Express server on Devvit with Redis for persistent storage (puzzles, scores, progress)
  • Build tooling: Vite for fast compilation and hot-reload during development
  • Architecture: Custom post types with dual entrypoints, a browse/splash screen, and the full game view.
  • Platform: Built entirely on Reddit's Devvit, leveraging its webview, storage, and mod tools

Challenges I ran into

  • Mobile viewport mismatch: 100vh doesn't account for Reddit's app chrome (close button, vote bar), grid was getting cut off on real phones. Fixed with 100dvh and flexible percentage-based layouts.
  • Responsive number sizing: Making grid numbers readable on phones without overflowing on desktop required careful clamp() tuning with mobile-specific breakpoints.
  • Puzzle validation in Architect Mode: Building a puzzle editor that's intuitive enough to create valid puzzles against the submitted pixel arts, while enforcing adjacency rules and ensuring solvability was a complex design challenge.
  • Moderation workflow: Building a review pipeline where community puzzles are hidden until moderator approval, with proper state management across Redis.

Accomplishments that I'm proud of

  • The reveal moment: Watching gray cells transform into colorful pixel art as you solve is genuinely satisfying; it makes every puzzle feel rewarding.
  • Full game loop on Reddit: Players can discover, play, compete, and create, all without leaving Reddit. It feels truly native.
  • Architect Mode: Empowering users to create their own puzzles turns players into contributors, building a self-sustaining content pipeline for the community.
  • Responsive design: The game works beautifully on mobile, desktop, and full screen, a consistent experience everywhere Reddit runs.

What I learned

  • Devvit's platform power: Custom post types, Redis storage, and mod action triggers make it possible to build surprisingly rich applications directly in Reddit.
  • Design for the smallest screen first: Starting with mobile constraints and scaling up produces much better responsive layouts than the reverse.
  • Community-driven content matters: Building creation tools alongside the game itself transforms passive consumers into active contributors.

What's next for Pixel Path

  • Themed puzzle packs: Seasonal and holiday-themed pixel art collections
  • Achievement system: Badges for streaks, speed records, and puzzle creation milestones
  • Multiplayer races: Real-time head-to-head puzzle solving against other Redditors
  • Bigger grids: Support for larger, more complex pixel art with richer detail, broken into multiple smaller puzzles, which, upon completing all reveals the final masterpiece.

Built With

Share this project:

Updates