3D in the browser · Five demos
Product configurator
The product, built as you choose it.
Five made-up products, each rebuilt in the browser from the choices you make: the shape changes, not just the colour. The parts list and the link follow every choice.
- Products
- Five, all made up
- Runs on
- Desktop and phone
- Gives you
- A parts list and a link
Polička
Parts 4 sides · 15 shelves · 3 doors · 8 feet
…/configure/shelving?bays=3&height=tall&finish=oak&doors=base
Made-up products and brands.
What it does
- 01
Built from the choices.
Three bays are three bays: the geometry is worked out from the answers, the way a real configurator works from a catalogue.
- 02
A parts list that adds up.
Every choice updates what the product is made of: sides, shelves, doors, windows, batteries.
- 03
A link per configuration.
The configuration lives in the address, so a customer can send exactly what they chose, and the shop can open it.
- 04
Materials you can judge.
Oak, charred wood, ruby glass, wool: the light and the plinth stay the same, so only the product changes.
How it's built
Each product is a set of rules, not a library of models.
- 01
Rules, not models.
A product is a function of its choices: bays, height, finish and doors make the shelf. Add a choice, and every combination exists at once.
- 02
Words without 3D.
The choices, the parts list and the link work even where the 3D can't run; the scene joins where it can.
- 03
Drawn only while it moves.
One 3D context for all five products, drawn only while something changes and the demo is on screen.
Under the hood.What was hard, and what we did about it.
Glass that refracts.
The glass is real refraction against a lit room, and the flutes are ground into the shape itself, not painted on.
A camera that fits.
Each product's camera fits its size, so a goblet and a cabin both fill the frame.
Where it is now
Five demos with made-up brands. For a real product, the rules come from your catalogue.
If this is your problem
Your product comes in more combinations than you can photograph.
We would start with a sprint: one of your products, its rules taken from your catalogue, configurable in a browser within four weeks, at a fixed price agreed in writing.
Next from the workshop · Neural interfaces
Reading commands from brain signals. In 2012.