MACs: Showers Configurator Previewer
2025
A configurable configurator: a single engine that drives both the options flow for custom showers and a real-time previewer that reacts to every choice the customer makes. The twist? The previewer isn’t 3D. It’s a layered SVG + modern CSS rendering pipeline. Faster, lighter, infinitely themable, and honestly, kind of a flex.
The HausFux configurator is fully data-driven. Every shower model, every option, every constraint and every dependency lives in a schema that non-engineers can edit. From that single source of truth the app generates the step-by-step purchase flow, the validation rules, the price logic and the visual preview. Adding a new product line or a new option doesn’t require a release, just a content update.
The previewer is the part I'm proudest of. Instead of reaching for Three.js or a heavy 3D pipeline, I built a layered SVG renderer driven by modern CSS (custom properties, masks, filters, container queries) that composes the shower in real time as the user picks profiles, glass, hardware and finishes. It loads instantly, renders crisply on any screen, themes itself for different shops, and proves you don't always need WebGL to deliver a delightful product visualization.
