A high-fidelity Rubik's cube viewer with real-time reflections and physically-based rendering — built to see how much visual quality the browser could carry.
The Rubik's cube is an old toy. Its visual representation in software, traditionally, has been functional rather than beautiful — a grid of coloured squares, often flat, sometimes shaded. I wanted to find out what the cube would look like with the full modern rendering treatment: physically-based materials, real-time planar reflections, the kind of finish that used to require an offline render farm.
Neon Cube Lab is the result. The mechanics of the cube (the rotations, the sector grouping) are conventional. The visual treatment is what makes it worth opening. Check it here.
What it is
An interactive 3D Rubik's cube where each of the 26 sub-cubes is a separate object grouped under a parent, allowing the cube to rotate as a whole or by face. The neon aesthetic comes from physically-based materials with high emissive properties, combined with a glossy floor that reflects the cube in real time.
What stayed with me
The discovery that planar reflections are cheap enough for real-time browser work. A reflective floor doubles the visual richness of a scene for very little additional cost — the engine renders the scene a second time from below the floor, then composites the result back through the floor's transparency. That technique appeared in several later projects whenever a scene needed extra polish.
Also: the cube taught me that a piece of geometry inherits authority from its surface treatment. The same cube with matte materials looks like a toy. With proper PBR and reflections, it looks like something you might find in a museum installation. The geometry didn't change. The finish did.
Part of the early experiments — stress-testing the browser's visual capabilities and learning when the finish matters.