Vibe code games with Codex

Vibe Code Games With Codex

Codex App has image generation built in — no API key juggling. But a green build doesn't mean a working game. The pack is the workflow that catches that.

I used Codex App as the backbone for the Pirate Survival Beat 'Em Up tutorial specifically because it has image generation built in. No separate Replicate or OpenAI key for the asset pipeline. The whole brawler — combat, audio, screen shake, Fibonacci difficulty ramp — shipped in 17 focused prompts from a blank Phaser 4 starter.

The catch on games: Codex's canvas blind spot. A passing build can render a black screen and every test will still go green. That's why playwright-testing is the second skill I load after the engine one — Codex needs to actually see what it made.

Why It Matters

  • Forest Census — public Three.js mini-game built with Codex CLI and the threejs-builder skill
  • The exact 17-prompt sequence from the Pirate Survival Beat 'Em Up tutorial (Codex App + Phaser 4)
  • playwright-testing skill — Codex's blind-spot fix for canvas/WebGL verification

Workflow

Bound every task to a file group

'Add jump logic to PlayerController.ts and verify the player leaves the ground' is a Codex task. 'Build a platformer' isn't. Name the file, the behaviour, and the visible check.

Load the engine skill plus playwright-testing

Engine skill for the implementation. playwright-testing for the screenshot. Together they catch the 'compiled but invisible' class of bug that's specific to canvas games.

One mechanic per pass — keep it throwable

Forest Census shipped one verb at a time: look, count, score. Each pass was small enough to throw away if it didn't feel right. That's the speed unlock — not larger prompts.

Public Vault Excerpts

Project

Forest Census

A small Three.js counting game built with Codex CLI and the threejs-builder skill. It is the cleanest public example of using Codex for a scoped, playable web game instead of asking for an entire game at once.

  • Codex
  • Three.js
  • Static hosting
Open public resource

Agent skill

threejs-builder

The skill gives Codex the scene/camera/renderer setup, animation loop, resize handling, asset-loading, and performance defaults it needs before generating game code.

  • Skill file
  • 3D
  • Repo context

Agent skill

playwright-testing

A testing workflow for frontend and game projects, including visual checks and canvas/WebGL verification. Codex gets much better when it can prove the game is visible and interactive.

  • Testing
  • Canvas
  • Verification

Prompt Patterns

Bound the task to a file

Read the current structure first. Implement [one mechanic] in the smallest reasonable file set — name them before you start. Preserve current controls. End with a browser screenshot or short interaction test so I can confirm the canvas isn't blank.

Tool Notes

Codex App vs Codex CLI matters

Codex App has image gen built in — great for end-to-end game workflows where you're also generating assets. Codex CLI is leaner and fits well into existing repos. I use the App for tutorials and the CLI for tighter dev loops.

Best at implementation, weakest at design

Codex is excellent at turning a clearly-described mechanic into code. It's less reliable when you ask 'what should this game be?' Bring the design. Let Codex bring the keystrokes.

Canvas verification is non-negotiable

I lost an hour once to a Three.js scene that compiled clean and rendered black — wrong camera position. Now every Codex pass that touches rendering or input ends with a screenshot check. The playwright-testing skill makes this one prompt.

Frequently Asked Questions

Can Codex actually finish a game?

Yes when the shape of the task fits. The Pirate Beat 'Em Up tutorial is a 17-prompt Codex App build from blank starter to a full brawler. Forest Census is the Codex CLI version — a tiny Three.js counting game built one verb at a time. Both real, both playable, both shipped with Codex doing the implementation.

What should I build with Codex first?

Something one-screen and one-verb. A Three.js scene with collectibles. A Phaser arena where one thing chases you. A vertical slice — the first 30 seconds of a bigger idea. Keep the first goal visible without scrolling.

What does the pack add on top of Codex?

Game-specific skills (engine, assets, testing) so Codex isn't defaulting to web-app patterns. Source repos like Forest Census it can imitate. And the verification habits — playwright-testing, canvas screenshots — that catch the bugs Codex can't see by default.