Overview
PixelForge is a client-side tool for packing loose sprite images into a single texture atlas, entirely in the browser — no upload, no server round-trip.
Problem
Indie developers often end up with dozens of loose PNGs that need to become one packed atlas plus a JSON/XML metadata file for their game engine. Existing tools were either desktop-only or required uploading assets to a third-party server, which some teams weren't comfortable with for unreleased art.
Approach
- Bin-packing (MaxRects algorithm) implemented in Rust, compiled to WebAssembly for near-native packing speed on batches of 200+ images.
- All processing happens client-side via the Canvas API — images never leave the browser tab.
- Exports a packed PNG plus metadata in either JSON (custom format) or a Unity-compatible XML layout.
fn pack(rects: &mut Vec<Rect>, bin_size: (u32, u32)) -> Vec<PackedRect> {
rects.sort_by_key(|r| std::cmp::Reverse(r.area()));
max_rects_insert(rects, bin_size)
}
Tech stack
React + TypeScript UI, a Rust packing core compiled with wasm-pack, and the
Canvas API for the final atlas rasterization. Ships as a static site with no
backend at all.
Outcome
Used the tool on two of my own game-jam entries to pack sprite sheets in under a second for batches that used to take a couple of minutes manually.
Note: this is a mock case study written for portfolio demonstration purposes.