I Vibe Coded a Street Fighter Game With AI (Cursor, Codex, Opus 4.8)

🎮 VibeGameDev — My AI Game Dev Skills & Playbook ► https://aiod.dev/ip4
🧰 This video's FREE resources (asset pack + every prompt) ► https://aiod.dev/nkl
🚀 Get My FULL AI Builder System (ALL ACCESS) ► https://aiod.dev/pjl
🦊 Spriterrific — the AI animation tool I built ► https://aiod.dev/c5h

This week, let's vibe code: a 2D fighting game. Real hitboxes, hurtboxes, blocking, best-of-3 rounds, and meter specials with multi-hit combos. The art, animations and code, including UI and the special finishers all made with AI.

If you've ever wanted to build a Street Fighter-style 2D fighter with AI — three characters, real frame-data combat, blocking, and meter specials — this video is for you.

🛠️ THE STACK
• AI agents: Codex (OpenAI) for the art, Cursor for the build — same workflow runs on Claude Code
• Game engine: Phaser 4 + TypeScript
• Concept mockups, character references, portraits, UI + prop atlases: Image Gen (Image 2.0, built into Codex)

🚀 WHAT YOU'LL LEARN
• Why a fighting game is "just" a per-frame box engine — and how a platformer starter already had everything it needed
• Generating SNES-style concept mockups and pulling a fighter out of each one as a clean reference
• Splitting a mockup into transparent parallax background layers for the stage
• The Character Gym — authoring per-frame hit / hurt / attack / guard boxes with Unity-style translate + scale gizmos
• Active-frame attack windows — why a punch only hits on its strike frames (the line between a fighter and a swing-through)
• Blocking as geometry, not labels — a guard box and two independent checks (did it touch, was the right stance up)
• A reusable Fighter entity + a playground with a training dummy and live per-character stat tuning
• The versus flow — mode → stage → character select with portraits → "Round 1, Fight!"
• Hit detection, best-of-3 rounds, a 60s round timer, and a group camera that scrolls a wide stage only when one fighter gives ground
• A UI-atlas HUD with a dynamic health fill, low-health blink, and a match-start entrance
• Meter specials with multi-hit combos — the attack-span trick that makes a single swing land several hits — and a super cut-in finisher

🕒 TIMESTAMPS
00:00 Vibe Fighter Intro
01:08 This Video's Resources
01:53 What we're building
02:40 Step 1: Context
03:16 Step 2. Generating concept art and mockups
04:01 Step 3: Exracting the backgrounds
05:09 Step 4: Character references
06:13 Step 5: Character Sprites & Animations
09:19 Step 6: Build a Character Gym
11:59 Step 7: Build a Playground
14:02 Step 8: Generating menu portraits
14:55 Step 9: Core combat loop
15:23 Step 10: Generating UI & Health Bars
16:53 Step 11: Special Moves and Polish
18:09 Wrap Up

#vibegamedev #aigamedev #vibecoding #claudecode #codex #cursor #phaser #gamedev #indiedev #aigame #aitools #fightinggame #streetfighter #2dfighter #spriterrific #aianimation #imagegen #vibecode #devlog #howto #tutorial

Видео I Vibe Coded a Street Fighter Game With AI (Cursor, Codex, Opus 4.8) канала Chong-U — AI Oriented Dev