Case library 06 — Real-time 3D

Light is the model.

A dispersive glass specimen rebuilt as a live scene, where the spectrum comes out of refraction instead of a picture of it.

Type
Concept · self-directed
Discipline
Real-time 3D · Web
Deliverables
Live scene, art-direction panel, case study
Payload
No models, no textures, no CDN
Light is the model.
01

The brief

The plate to match was a mineral body inside thick glass, its edges broken into spectra and thin orbits crossing in front and behind. Producing the shape was the easy half: exported as a model and dropped into a page, it read as a grey lump. Everything convincing about the reference lived in the lighting and the refraction, and neither of those survives an export.

So the work was not to reproduce a picture but to rebuild the conditions that make it — something that holds up while it turns, on a viewport of any shape, without shipping a single asset.

02

Design decisions

01

Dispersion is physical here. The core is an opaque mesh, so it lands in the renderer's transmission backdrop and the shell refracts it per wavelength — the fringe moves correctly as the body turns, which a screen-space effect never does.

02

A procedural environment does the lighting: a dark room with a few broad panels and three narrow bright strips, pre-filtered into an environment map. The strips are what smear into spectra; without them glass has nothing to bend.

03

Separate membranes for the wings read as grey plastic against a dark ground, so they were dropped. The shell's displacement field grows lobes instead, keeping one continuous refracting surface out to the silhouette.

03

Outcome

About forty kilobytes of hand-written code over a vendored renderer, generating its own geometry, lighting and grain at load. It survives being turned, resized and re-seeded, drops into any page as a module, and hands the GPU back when the section unmounts.

What was delivered
0
Asset files
Geometry, colour and dust are grown from seeded noise.
2
Displaced icospheres
Glass body and sediment core, normals from tangent probes.
40 kB
Hand-written code
Over a vendored renderer, no third-party scripts.

A concept project designed in-house, not a client engagement. Figures describe the delivered design system — components, screens, scope and duration — not commercial results.

The concept is live and open to read.

The original build opens in a new tab, with its own case study page alongside it.

Open the live concept →
Next case
07 07 — Community platform Luna Bloom Society maternity community Read

Start with the two-week diagnostic.

A 60-minute review, then a fixed-fee fortnight. You leave with a costed roadmap and no obligation to continue.

Office
23A Dromorne Rd, Remuera
Auckland