Three Sided Box is a brain-teasing isometric puzzle game template (built with Phaser 4 + TypeScript) where players activate box faces by drawing connected paths across a 3D grid. Strategically navigate branching paths, avoid dead ends, and complete every level by activating all visible faces — all rendered in a stunning 2.5D isometric projection using purely 2D sprite assets (no 3D models or rendering required).

Core Gameplay

Goal: activate every playable face (front, side, or top) on each box by drawing a continuous path from face to face.
Click or drag across faces that visually share an edge — neighbor detection is based on visible edges, not grid adjacency.
Face branching paths and dead ends — use Undo (Z) or Reset (R) to recover when stuck.

Levels + Generator

Levels are defined as a 3D numeric grid, making it intuitive for designers to create and edit puzzle layouts.
Each cell supports 8 face-enable codes (0–7), giving fine-grained control over which faces (front, side, top) are playable on every box.
Built-in Level Generator CLI tool automatically produces unique, solvable levels with adjustable difficulty.
4 difficulty presets — Easy, Medium, Hard, Insane — controlling grid size (up to 12×14×10), block count (up to 95), and visible face count (up to 80).
Insane mode includes a solvability-preserving post-processor that randomly disables faces for extra challenge.
Optional hint steps can be assigned per level to guide players or serve as the intended solution path.

Template Features

Reskin-ready with a dedicated reskin guide and comprehensive documentation.
Complete documentation including architecture overview, gameplay rules, asset catalog, level generator guide, and reskin guide.
Designed for 1080×1920 (9:16 portrait) mobile target resolution.
30 included levels ranging from simple 2×2 grids to complex multi-layered puzzles — all generated via the built-in CLI script.

Supported Browsers

Chrome
Firefox
Safari
Edge
Opera

Tech Stack

Phaser 4 (HTML5 game framework).
TypeScript 5.7
Vite 6.3

Asset Credits

Images: DevilsWork.shop (itch.io), Leo Red (itch.io)
Sound Effects: Kenney (itch.io)

Three Sided Box | Phaser 4 HTML5 Game