Food Fight

A game that solves my own takeout indecision

Eight foods fight it out in rounds of would-you-rather until one is left standing. My concept, art direction and UX, built in about five days by directing Codex.

foodfight.online, landing screen
Client
Personal project
Role
Concept, game mechanics, art direction, UI/UXbuilt by directing Codex; I acted as product owner and QA
Stack
  • Next.js
  • React
  • JavaScript
  • GSAP
  • Vercel
  • ChatGPT
  • Codex
  • Higgsfield
Timeline
V1 launched October 2026sound design and more food categories in progress
128
choice paths, all checked by an automated test
7
rounds to a winner
~5 days
from idea to a running V1
12
Codex sessions

Overview

I always freeze when I open a delivery app: too many options, no idea what I actually want. I also needed a project to get properly fluent in AI-assisted development, so I built a game that fixes the first problem. You pick a category, eight foods fight it out, and whatever is left standing is what you order.

My role

  • Came up with the concept and designed the game mechanics
  • Set the art direction and designed every character concept
  • Designed the layout, UI and UX of the full flow
  • Planned the build with ChatGPT, broke it into Codex-ready tasks, and directed Codex through 12 sessions
  • Tested every build myself, diagnosed what was wrong and described each bug precisely enough for Codex to fix
  • Refined motion, timing and layout until the experience felt right

Challenges & solutions

Turning indecision into a game loop

A long list of options is what causes the problem in the first place, so the game never shows more than two at once. Each round is a single either/or choice, and the winner stays in, so you’re always comparing a new option against your current favourite. Eight foods give seven rounds and 128 possible choice paths. Codex ran an automated test across all 128 to make sure every game ends in a consistent final recommendation.

Pick a craving: one category is live in V1, more are on the way

Directing AI rather than just prompting it

I’m not a React developer, and I didn’t write or review the code. My job was everything around it: I planned the approach in ChatGPT, broke the product into tasks small enough for Codex to build reliably, and set what counted as done. Then I tested every build like a product owner. When something broke or felt off, I worked out what was wrong and described it precisely enough for Codex to fix.

The arena entrance is a good example. The first version worked, but squeezed the whole sequence into 1.27 seconds, so the poster movement and the fighters’ entrance felt rushed. I rewrote the task as specific beats:

  • keep the immediate response to the click
  • slow the poster’s movement toward the centre
  • hold for 400ms
  • then bring in the fighters
  • keep choices disabled until both fighters have finished entering
  • leave the existing combat animations and arena placement unchanged

The revised sequence runs about 2.35 seconds. Desktop and mobile recordings, plus automated checks for input locking, focus and reduced motion, gave me concrete ways to review the result without reading the code.

The revised entrance: click response, poster move, a 400ms hold, then the fighters

A consistent cast of AI-generated characters

Each food fighter started as my own character idea. The risk with generated art is a cast that looks like it came from different games, so I used ChatGPT to keep the prompts consistent in style and structure, then generated the characters in Higgsfield.

The full cast, generated from one consistent prompt structure

Timing and continuity

The hardest part wasn’t the logic; it was the feel. Beyond the entrance, two refinements made the biggest difference:

  • One persistent scene: the arena height varied by up to 50px between screens, so the stage jumped during transitions. A single persistent scene frame fixed this and keeps the experience continuous from start to finish.
  • Responsive composition: I checked the scene composition across five viewport sizes, from 320px mobile to 1920px desktop.
The arena: one persistent scene frame from the first fight to the winner
The same scene at 320px and 1920px
A full game, from craving to winner

Results

  • From idea to a running V1, in about five days of part-time work

  • Every possible game checked by an automated test, all ending in a consistent recommendation

  • A complete experience on its own domain, from category choice to final winner, with one category live and more in progress

The web is full of worlds

Let's build yours!