AIventure: Vibe Coding Journey
Key Takeaways
Builds AIventure, a retro dungeon crawler using Angular, Phaser.js, and Gemma 4 open weights to teach vibe coding and agentic behaviors
Original Description
Ian Ballantyne, Developer Relations Engineer at Google DeepMind, introduces AIventure, an open source retro dungeon crawler that doubles as a Gen AI masterclass for developers. Built on Angular and Phaser.js and powered by Gemma 4 open weights, the game teaches vibe coding and agentic behaviors through gameplay.
What's covered: Prompting a Chicken NPC to vibe code a web app that Gemma 4 writes in HTML, CSS, and JavaScript and renders in an iframe, prompting a Robot NPC that triggers an autonomous thinking loop with tool calls into the Phaser.js engine, and the model-serving options for Gemma 4: fully local with Transformers.js, Ollama, or LM Studio, or routed to the Gemini API or Google Cloud with a config change.
Scan the QR code in the video or hit the GitHub repo to explore the full developer solution.
AIventure on GitHub / Developer solution writeup / Gemma docs / Gemini API
What are you building with Gemma 4? Drop it in the comments.
Subscribe to Google for Developers → https://goo.gle/developers
#GoogleDeveloperNews
Speaker: Ian Ballantyne
Products Mentioned: Google AI, Gemma
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
More on: AI Pair Programming
View skill →Related Reads
📰
📰
📰
📰
React Introduction
Dev.to · Karthick (k)
Why SnapDOM Beats html2canvas for DOM-to-Image Capture
Dev.to · Juan Martin
I built 42 landing page templates as single HTML files (no npm, no build step)
Dev.to · Segcam spa
Part 7B — Section 2 — React Event Handling Explained: Forms, Event Object & User Input.
Medium · JavaScript
🎓
Tutor Explanation
DeepCamp AI