Room planner 3D per officine e spazi tecnici

Obiettivo

Realizzare un room-planner 3D B2C da integrare nell'e-commerce esistente che permetta al cliente finale di calcolare in autonomia la quantità di piastrelle da officina necessarie per pavimentare il proprio spazio, visualizzando in tempo reale le colorazioni e disegnando aree di indicazione e disegni con le piastrelle multicolore. Il room-planner deve integrarsi con il configuratore dedicato all'arredo modulare e permettere di comporre anche l'illuminazione LED disponibile a catalogo.

La sfida

Creare un room-planner intuitivo e performante in grado di essere utilizzato con diversi flussi UX dedicati a intenzioni d'acquisto diverse: isole di pavimentazione centrali, stanze standard o planimetrie custom, intenzione di acquisto su luci e arredo. Il sistema deve gestire vincoli fisici come la direzione di posa delle piastrelle e la collisione tra elementi, calibrando il trade-off tra complessità dell'esperienza utente e completezza delle possibilità reali di configurazione.

La soluzione

Nel configuratore web 3D hostato su sottodominio dedicato sono state realizzate due routes separate dedicate rispettivamente a isole di pavimentazione con rampe perimetrali e room planner completo.

Il room planner è stato strutturato con una struttura a step progressiva per mantenere il focus dell'utente sulle decisioni chiave da prendere:

  • Disegno stanza: rettangolare, a L o disegno a mano libera con suggerimenti automatici
  • Inserimento aperture: porte e portoni
  • Selezione della categoria di piastrelle, con dimensioni differenti
  • Scelta del verso di posa
  • Configurazione e disegno pavimentazione
  • Inserimento arredo con integrazione e redirect andata e ritorno verso il configuratore arredo
  • Configurazione luci LED

Il room planner è dotato di:

  • Drawer planimetria 2D con diverse modalità e funzionalità
  • Sistema di interazione on-click/tap con la pavimentazione 3D: paint-mode, single tile-select, logiche di override, etc.
  • Rendering 3D della stanza con algoritmo per gestire la vista attraverso le pareti in maniera automatica
  • Drag real-time per posizionare arredi e luci
  • Sistema anti-collision per arredi e luci
  • Motore CPQ per il calcolo delle diverse scontistiche
  • Checkout API custom e logiche di cross-sell
  • Landing routes per ripristinare le configurazioni già trasmesse al carrello e per la condivisione tra utenti
  • Integrazione con il configuratore arredo sviluppato nello stesso programma