Three.js From Zero · Article s12-12
S12-12 Cabinet Configurator
Skip to demo
Season 12 · S12-12 · Specialized Production Patterns
Cabinet Configurator — modular logic, snap rules, and SKU sanity
Furniture configurators look visual, but their hardest work is logical: snap rules, invalid combinations, and making sure the pretty composition still maps to a shippable SKU.
industryfurniturerules
1. Why this article exists
This article extends the S11 furniture story into the logic-heavy side that Roomle-style systems actually live or die on.
2. What we are building in the demo
- A modular cabinet wall with snap-aware blocks.
- A width/height system that shows how rule engines shape visual freedom.
- A tiny example of “nice-looking but invalid” versus “actually sellable.”
3. Live demo
The demo below is a compact study model, not a full production system. The goal is to make the article’s mental model tactile: what changes, what matters, and what you would keep when the codebase graduates into a real project.
booting...
Season 12 is deliberately less single-vertical than Season 11. The throughline is still applied production: every demo is framed as a pattern you could reuse in paid work.
4. Implementation sketch
if (module.width + currentRowWidth > maxWidth) {
return { ok: false, reason: 'Row exceeds merchandised width.' };
}
attachAtSnap(module, targetCell);5. Production notes
Useful companion articles from earlier seasons:
What usually goes wrong first:
- Unbounded freedom usually creates unsellable output.
- Logic rules need to surface clearly in the UI, not hide in silent failure.
- A good modular system expresses constraints without feeling punitive.
6. Takeaways
- Furniture configurators are as much rule systems as render systems.
- Clear constraints make buyers feel guided, not restricted.
- Snap logic is a commerce feature, not merely a 3D interaction trick.