Vibe Coding with Claude

Vibe coding a small JavaScript video game using Claude Sonnet 4.6.

I set out to create a small web based game by vibe coding with Claude’s Sonnet 4.6. The end goal was to build something that I could embedd into this website as a playable game.

As embedded custom HTML is a paid feature, you can access the final game here:

https://connorwillis-lab.github.io/little-tree-planter/little-tree-planter.html

Step 1: Proof of concept

My first hurdle is that I have zero experiece with JavaScript, HTML or game design. I have also never used Claude, having previously favoured OpenAI’s ChatGPT.

From my initial research I settled on using a React based user interface. React is a JavaScript library for building user interfaces and is used to build single-page applications. For a simple puzzle game this is more than enough functionality to achieve my goal.

The first step was to creat a single level and play around with the mechanics. I chose a grid based game as I figured this would be the easiest to implement quickly. After a brief back and forth with Claude over some of the more basic mechanics, we were able to pull a playable first level together in about 10 minutes.

Step 2: Game Expansion

Once I was happy with the basic mechanics, it was time to expand the game into multiple levels. I began with 3 levels, introducing a additional features like obstacles and limited inventories with each level.

From here I asked Claude to expand the game. Initially prompted the chatbot to expand the game to 10 levels without my input. The result felt very formulaic, lacking a clear progression for the user. After further back and forth, we agreed a better template for level expansion.

Step 3: Game Expansion

The final step was to package the game into a WordPress friendly format.

Conlusions

The speed and ease with which Claude was able to build a small working game was impressive. It struck me that I only spent a few evenings during the week to create the final game displayed, probably no more that 3-4 hours of prompting and testing. From my starting point with no prior experience, I think I would have struggled to achieve the same results.

As a next step I want to delve deeper into Claude’s agentic capabilities, potentially putting together some simple workflows. It would also be interesting to see how the experience differs with other Generative AI’s.

Leave a comment