arrow_back Back to Projects Game Dev • Personal • Shipped

Gravitas Merge

HTML5 JavaScript Cloudflare Pages Cloudflare Workers GitHub Actions Claude Code
Gravitas Merge logo

Overview

Gravitas Merge is a browser-based HTML5 puzzle game built as a personal project. Players merge falling planets by changing the gravity, combining planets to reach higher tiers. The game runs entirely in the browser with no install required.

The site and game are hosted on Cloudflare Pages with automatic CI/CD handled by Cloudflare Workers. Every push to the GitHub repository triggers a deployment automatically, keeping the live game in sync with the latest code without any manual steps.

Development involved talking with real users who played the game and gave direct feedback on both the game feel and the surrounding site experience. That feedback drove several rounds of iteration: adjusting game mechanics, refining the UI, and improving how the site communicated instructions and goals visually.

The project was largely built using Claude Code as the primary development tool. Working with it throughout the full lifecycle was a practical way to develop fluency with AI-assisted workflows, and gave me a clearer sense of where that kind of tooling genuinely speeds up progress versus where it needs more guidance.

Technical Highlights

check_circle

Cloudflare Pages + Workers CI/CD

Hosted on Cloudflare Pages with deployment triggered automatically by GitHub pushes via Cloudflare Workers. Zero manual deployment steps: push to main and the live game updates within seconds.

check_circle

HTML5 Canvas Game Engine

Game logic and rendering built from scratch using HTML5 Canvas and vanilla JavaScript with no game engine. Physics was derived from Matter.js, and the collision and merge logic are all custom-written, keeping the bundle lean and the game fast to load.

check_circle

User Research & UX Iteration

Brought in real users early, collected direct feedback on game feel and site presentation, and used those sessions to drive concrete changes. Multiple rounds of iteration improved both the gameplay experience and how the UI communicated the game's concept.

check_circle

Claude Code Workflow

Used Claude Code as the primary development tool from initial scaffolding through deployment and ongoing iteration. The project became a hands-on way to develop a working mental model of AI-assisted development, helping learn how to direct it effectively and recognizing where it adds the most value.