// case study
Custom 3D Door Configurator
7-step guided wizard for premium slimline glass doors with live 3D preview, live pricing, and a full admin dashboard for an Australian door manufacturer.
- year
- 2025
- type
- 3D configurator
- stack
- React, React Three Fiber, Express.js
Built a custom 3D door configurator for a premium Australian manufacturer of slimline glass doors. Customers walk through a 7-step guided wizard (location, style, handing, colour, size, hardware, and glass) with a live 3D preview and pricing updating at every step. A full admin dashboard lets the client team manage products and pricing without developer involvement.
Technical Implementation:
- Built frontend with React and Vite; 3D rendering via React Three Fiber (Three.js)
- 7-step wizard flow: Location → Style → Handing → Colour → Size → Hardware → Glass
- Express.js backend connected to a database for product and pricing data
- Live pricing recalculated on every configuration change
- Admin dashboard for managing door products, variants, and pricing rules independently
- Deployed as a standalone web app embedded in the client’s website
Key Features:
- Live 3D door preview updating with every option selection
- Dynamic pricing at every wizard step
- Full admin panel for product and pricing management
- Clean guided UX reducing decision paralysis for a premium product
The project is completed and live in production.