Skip to content
Lumina

Product pages you can turn the chair on

A 40-piece furniture catalogue where every product rotates, in a page that still loads in under two seconds.

Client
Brackett Furniture
Year
2025
Discipline
3D web experience
Our role
Design, WebGL, front-end, performance

The challenge

The challenge

Returns were running high because customers could not judge proportion from three-quarter photography. The brief was to put the real object on the page without turning a catalogue of forty pieces into forty heavy WebGL builds.

The approach — 3 moves

What we did

  • 01

    One canvas per page, loaded on demand and disposed on route change. Forty products share a single renderer rather than each shipping their own.

  • 02

    Geometry is quantised and Draco-compressed at build time; the largest piece is 480KB, which is smaller than the hero photograph it replaced.

  • 03

    Every product page still renders and ranks without JavaScript. The 3D view is an enhancement over a complete HTML page, not a replacement for one.

Product page with the lounge chair mid-rotation
Material swatches applied live to the frame
Dimension overlay called up from the toolbar

Outcome

What changed

LCP on 4G
2.1s
Returns on seating
−28%
Lighthouse mobile
94

Built with

  • Next.js
  • React Three Fiber
  • Draco
  • Sanity

Next project

A portfolio built around the drawings

Ansel & Roe / 2024 / Brand website