Client workReal-time 3D on the web· 2026

Scroll-driven 3D narrative

A scroll-driven walk down an abandoned railway in a rainforest, rendered live in the browser at 60fps.

Scroll-driven 3D narrative

The hard part

Holding 60fps through volumetric fog, rain and a kilometre of procedurally placed forest — on a laptop, in a browser tab, with no loading screen.

Measured

Frame rate
60fps median, 56fps at p95
First paint
836ms
Total transfer
434KB
Scene length
10,350px of scroll, 5 chapters
Renderer
WebGL2

Taken on the live build, 1440×900, cold cache. Reproduce them yourself.

A narrative piece built as one continuous 3D scene. There are no images and no video — every tree, sleeper, rail and raindrop is geometry, rendered live in the browser as you scroll. The camera walks a disused forest railway through five chapters and ends at the locomotive still sitting in the rain where it stopped.

What made it hard

  • Fog that has depth. The forest reads as deep because light scatters through it volumetrically rather than fading to a flat colour. That effect is usually where frame rate goes to die.
  • A forest that isn't a forest. Placing thousands of trees individually would not survive a mobile GPU. The canopy is instanced and placed procedurally along the route, so the scene stays inside budget however far you walk.
  • Scroll as a camera track. Scroll position drives a spline the camera rides, damped so a trackpad flick reads as a walk rather than a teleport.
  • Nothing to wait for. The whole experience transfers in 434KB and paints in under a second. A 3D piece that needs a loading bar has already lost most of its audience.

Open it and scroll. That is the whole proof.