Vibe Code a Complete 2D Beat 'Em Up Game From Scratch - Full Tutorial (Codex, Phaser, Images 2.0)
🎮 VibeGameDev — My AI Game Dev Skills & Playbook ► https://www.vibegamedev.com/?utm_source=youtube&utm_campaign=vgd07 🧰 This video's FREE resources (Starter Project) ► https://www.vibegamedev.com/pirate-beat-em-up-resources?utm_source=youtube&utm_campaign=vgd07 🚀 Get My FULL AI Builder System (ALL ACCESS) ► https://www.builderpack.ai/?utm_source=youtube&utm_campaign=vgd07 Last week I showed you how to make sprites using AI. Today, we build a FULL game using them: a real, playable pirate beat 'em up. Combat, round progression, HUD, health, audio, polish — built end-to-end with Codex, Phaser, AI-generated artwork, and AI-generated sound. Every prompt I used is in this video. Built from a clean starter folder all the way to a complete, shippable game. If you've ever wanted to know how to actually finish an AI-built game — not just demo one — this video is for you. 🛠️ THE STACK • AI agent: Codex app (OpenAI) — full build, also works with Claude Code / Cursor / Open Code / Zencode • Game engine: Phaser 4 + TypeScript • Background art: Image Gen (built into Codex, piggybacks on ChatGPT subscription) • Sound + music: ElevenLabs (via official sound-effects + music agent skills) • Workflow automation: n8n (community routing — see today's sponsor segment) • Skills loaded: Phaser game dev + Phaser 4 game dev agent skills 🚀 WHAT YOU'LL LEARN • How to load AI agents with the right skills before you start building • Parallel sub-agent prompting — generate 4 background candidates in the time of 1 • Building a canonical asset index (and why one JSON file saves a thousand tokens) • Frame-based hit detection — why your weapon hitbox should only register on frame 4 • Visualising attack bounds with debug overlays to actually feel hits land • Health systems with depleting color states (green → amber → red blink) • Closing the game loop — why a game-over screen matters more than the menu • Fibonacci wave progression — making difficulty curves that feel non-linear • Fixing the Phaser scene restart bug that breaks 90% of vibe-coded games • Generating background music + sound effects from prompts with the ElevenLabs skill • Adding juice: noise-based screen shake, freeze frames, particle effects, hit flash • The "browser-use" verification trick in Codex that catches integration bugs automatically 🕒 TIMESTAMPS 00:00 Intro 01:19 1. Tutorial Resources 01:58 2. Project Structure 02:16 3. `public` folder 03:11 4. .Agent skills 03:42 5. Codex App 04:57 6. Running the game 06:14 7. Better Testing Setup 07:42 8. Generate Background Art 09:38 9. Use parallel sub-agents 11:05 10. Create an Asset Index 14:10 11. Adding the Pirate Player 16:40 12. Browser Testing in Codex 18:37 13. Add Skeleton Enemy 20:26 14. Collisions & Hitboxes 21:46 15. Adding Debug 22:54 16. Fixing Attack Frames 24:48 17. Fixing Hit Boxes and Bounds 26:52 18. Adding Health System & Bars 28:34 19. Game Over And Death Flow 29:28 20. Wave Progression System 32:20 21. Restarting The Game 34:31 22. Generated Sound & Music with AI 39:56 23. Adding juice and polish 42:36 Wrap Up 🔗 LINKS • VibeGameDev: https://aiod.dev/opi • Free starter files + resources: https://aiod.dev/06c • Codex: https://chatgpt.com/codex • Phaser: https://phaser.io • ElevenLabs: https://elevenlabs.io #vibegamedev #aigamedev #vibecoding #claudecode #codex #phaser #gamedev #indiedev #aigame #automation #aitools #pirategame #beatemup #imagegen #elevenlabs #aimusic #vibecode #howto #tutorial