3D Commerce / 2025
Balcony Configurator
A custom interactive balcony configuration experience — visually configure balcony systems while managing product options, configuration rules and delivery-related requirements.
- Status
- Production
- Systems
- Three.js · Shopify · Configuration Engine · Delivery Logic
- Stack
- Next.js · TypeScript · Three.js · React Three Fiber · Shopify · Vercel
Project screenshot · 2026-10-17
Overview
A balcony system with real configuration logic: dimensions, glazing, finishes and delivery constraints. The configurator encodes product rules so customers can only build valid combinations, and delivery-related requirements are captured up front.
Scope
- 3D Product Configurators
- 3D Modeling & Animation
- Shopify Development
Challenge
Balcony systems have interdependent options — sizes constrain glazing, finishes constrain pricing, delivery constrains feasibility. Static product pages pushed all of that complexity onto the customer or the sales team.
Solution
An interactive 3D configurator with a rules engine underneath. Options update the model in real time, invalid paths are closed off, and Shopify carries the configured product through to checkout or enquiry.
System
How this product is wired.
Flow
- 01
SHOPIFY
- 02
CONFIGURATION ENGINE
- 03
3D EXPERIENCE
- 04
DELIVERY CALC
- 05
QUOTE
Experience
- 01
Interactive 3D balcony model with dimension and finish controls
- 02
Dynamic product configuration with rule enforcement
- 03
Delivery calculation inputs in the configuration flow
- 04
Responsive UI that works on site visits
Features
- Interactive 3D
- Dynamic product configuration
- Shopify integration
- Responsive UI
- Delivery calculations
- Configuration logic
Implementation
- Parametric Three.js model driven by configuration state
- Rule evaluation layer separating product logic from rendering
- Shopify integration for configured line items
- Lazy-loaded 3D with graceful fallback when WebGL is unavailable
Mobile
The full configuration flow works on mobile with step-based navigation and a compact 3D viewport, so measurements taken on site can be entered directly.
Outcome
- 01
Created a configuration workflow that lets customers build valid balcony systems visually
- 02
Reduced back-and-forth by capturing delivery requirements during configuration
- 03
Product rules live in one place, making future option changes straightforward