JT
  • Home
  • Projects
  • Extras
  • Contact

© 2026 Joshua Tjhie. All rights reserved.

GitHubLinkedIn
Back to Projects
  1. Home
  2. Projects
  3. Copperfall

Copperfall

Tiny PNGs become playable chunks in this 2D browser game, built with a custom JavaScript engine.

Game developmentJavaScript
Copperfall

Details

JavaScriptCanvas 2DHTMLCSS

Links

Source on GitHub

Copperfall's maps start as 8 by 8 pixel images. A white pixel becomes a rock, a green one becomes a pickup, and other colours place enemies. A few dots in an image editor become a place the player can explore.

I built Copperfall and its 2D engine for my first semester in Creative Computing at St. Pölten University of Applied Sciences. The game runs in the browser, with JavaScript and Canvas for the world and HTML and CSS for the menus.

Painting the Pieces of a World

Each image describes one chunk. The generator chooses a blueprint and rotates it before reading the colours, so the same layout can appear in different orientations. Chunk types change with distance from the starting area.

That keeps some control over the encounters. I can arrange rocks and enemies inside a small blueprint, then let the generator choose how those pieces repeat across the world. Changing a layout means editing pixels; introducing a new kind of object still means adding code and a colour mapping.

Copperfall gameplay, with the player beside a spaceship inside a rocky map containing enemies and pickups.
The player beside the starting ship. Rocks, enemies, and pickups occupy the generated chunks around it.

Leaving a Chunk Without Forgetting It

The chunk manager removes distant chunks from the engine's active object list. Their objects stop updating, rendering, and colliding, but the manager keeps their state. When the player returns, it registers the surviving objects again and skips anything already destroyed.

This separates the part of the world that is active from the part the game remembers. It reduces the work in the game loop, although keeping old chunks still uses memory.

Building the Engine

The engine uses scenes, game objects, and components, a structure inspired by Unity. Components handle sprite rendering and collisions. Keyboard and gamepad controls map to shared actions such as dash and interact, so the game can respond to an action without each object checking which device produced it.

Generating a 3D Arena

The Circussy One
The Circussy One
Automatic weapons keep firing while you chase upgrades and the Stage Door in this circus roguelite prototype.
Project•Game development

Questions About This Project?

Ask about how it works, or point out something I missed.

Contact me