WebGL + WebGPU Game Engine Sandbox
Experimentarium is my long-running game engine lab in the browser for stylized water, micro-scale terrain, GPU-driven particles, and camera systems. A custom ECS, engine clock, and mode system power a growing set of game prototypes—from a WebGPU-assisted slime world to a balloon popping mini game.
What I’m exploring
- Interaction & feel: camera presets, input latency, and micro-animations tuned per mode (slime micro-world, score-chase test modes, and future experiments).
- Rendering: stylized lighting, horizon art, GI probes, terrain & water systems, and WebGPU-backed absorb particles.
- Systems: an engine-aligned ECS with a shared clock, event bus, and clean Start/End lifecycles for each mode.
- UX & tooling: in-scene HUD and debug overlays for tuning sky, terrain, water, post-FX, and GPU VFX quality.
Controls
Click/tap to interact. Press U to toggle the sandbox UI; Esc to pause.
What’s live in the sandbox right now?
A few of the current experiments you can find in the demo:
- Slime micro-world: a tiny creature exploring stylized terrain, water, and grass with physics-driven movement and camera presets.
- Score-chase test mode: a balloon-based arena I use to dogfood input, timing, and scoring systems, wired to a simple leaderboard.
- GPU absorb VFX: WebGPU-backed particles that respond to score and collect events, with a WebGL/CPU fallback where WebGPU isn’t available.
The exact mix changes over time as I swap experiments in and out, but the engine, camera director, and HUD stay consistent.
How I approach experiments
Each idea is a small, isolated mode with its own camera preset and clean setup/teardown. Global services (clock, events, effects) stay consistent so I can compare results quickly.
What is “ECS” and why use it?
ECS stands for Entity–Component–System. Think of it as three simple parts working together:
- Entities — lightweight IDs for “things” in the world (balloons, particles, players).
- Components — data attached to entities (like Position, Velocity, Color).
- Systems — functions that run every tick on entities that have the required components (e.g., a Movement system updates all entities with Position+Velocity).
This makes code modular, data-driven, and easy to optimize—perfect for quickly turning experiments into small games without spaghetti.