DEV Community

Cover image for I Vibe Coded a Balloon Popping Game Using Claude AI 🎈
BlinkNBuild
BlinkNBuild

Posted on

I Vibe Coded a Balloon Popping Game Using Claude AI 🎈

#gamedev #webdev #javascript #beginners

What I Built 🎮

A fully playable balloon popping arcade game that runs entirely in the browser — built using Claude AI (vibe coding). No React, no libraries, no build tools. Just one index.html file.

🎈 Play it live → balloon-blaster.netlify.app
💻 Code → github.com/S-SUJAN-S/balloon-blaster

What is Vibe Coding?

Vibe coding = you describe what you want to an AI, it builds it, you iterate, you ship.

No boilerplate. No setup. No framework debates. Just:

  1. Describe the idea
  2. Let the AI build it
  3. Test, tweak, ship

I used Claude AI for the entire thing — and honestly it was a great experience.

What's in the Game

  • 🎯 3 balloon sizes with different point values
  • 💥 Combo multiplier system
  • âš¡ 8 power-ups — Rapid Fire, Shield, Tri-Shot, Freeze, Extra Life, Bomb, Double Score, Laser
  • 🎆 Particle burst effects on every pop
  • 🌠 Animated star background with meteor streaks
  • 📱 Mobile touch support
  • 💾 High score saved locally
  • 🔊 Sound effects — all synthesized in-browser, zero audio files
  • 3 difficulty levels — Easy, Medium, Hard

How I Built It

Honestly? I just described what I wanted to Claude AI and iterated.

"Make a balloon shooting game in a single HTML file, portrait canvas, with a shooter at the bottom, balloons falling from the top, combo system, and power-ups"

From there it was just:

  • Testing what worked
  • Describing what to fix or add
  • Deploying to Netlify with a drag and drop

Total time from idea to live URL — a couple of hours.

Run It Locally 

git clone https://github.com/S-SUJAN-S/balloon-blaster.git
cd balloon-blaster
# Just open index.html in your browser
Enter fullscreen mode Exit fullscreen mode

No npm install. No config. Just open and play.

Deploy in 30 Seconds

  1. Go to netlify.com
  2. Drag your index.html onto the drop zone
  3. Done — live URL instantly

What I Learned

Vibe coding is a real workflow. You don't need to understand every line to ship something fun and working. The key is knowing what you want to build clearly enough to describe it — the AI handles the how.

Drop a comment if you want me to do a proper walkthrough of the vibe coding process — I'll make a full video on BlinkNBuild!

🎮 Play → balloon-blaster.netlify.app
💻 Code → github.com/S-SUJAN-S/balloon-blaster
📺 Watch → youtube.com/@BlinkNBuild

Built with Claude AI âš¡ | BlinkNBuild

Top comments (0)