Solo Project

FateDoors

A suspense-driven pick-a-door game with weighted outcomes, narration, and scalable media-generation infrastructure.

FateDoors is a Next.js web game where players choose between two doors during a timed commitment window, then reveal narrated visual outcomes with rarity-based selection and repeat reduction.

FateDoors
Project Preview
FateDoors door-selection experience visualFateDoors door-selection experience
My Role

I built FateDoors independently, owning the game concept, interaction model, frontend experience, outcome catalog, API routes, and backend media-generation scaffold.

  • Built a Next.js App Router game experience with TypeScript and motion-driven UI interactions
  • Designed the two-door selection flow with a timed no-switch commitment window
  • Implemented weighted rarity logic for Common, Uncommon, Rare, Epic, and Legendary outcomes
  • Connected outcome images and narration so each reveal feels like a complete mini-story
  • Scaffolded backend generation paths using FastAPI, Supabase, Cloudflare Workers AI, R2, Gemini, and optional QStash dispatch
Problem

Interactive web games can feel static when outcomes are predictable, repeated, or disconnected from the reveal moment. I wanted a small game loop that felt suspenseful, replayable, and expandable.

Solution

FateDoors pairs a simple door-choice mechanic with weighted rarities, curated outcome media, narration, and infrastructure for future AI-generated doors and videos.

Impact

The project demonstrates full-stack product thinking across game UI, API route design, content modeling, media handling, backend worker architecture, and cloud-service planning.

Key Features
  • Two-door pick flow with a 10-second no-switch commitment window
  • Weighted rarity tiers for outcome selection
  • Narrated visual reveals with matched outcome assets
  • Repeat-reduction logic across recent results
  • Next.js route handlers for outcome pairing and generation jobs
  • FastAPI worker scaffold for future media generation workflows
Tech Stack
  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • Framer Motion
  • Supabase
  • FastAPI
  • Cloudflare Workers AI
  • Cloudflare R2
  • Gemini
  • Upstash QStash