3D room planner for workshops and technical spaces

Objective

Build a B2C 3D room planner integrated into the existing e-commerce flow, allowing end customers to independently calculate the quantity of workshop tiles needed to cover their space, preview colors in real time and draw indication areas and patterns with multicolor tiles. The room planner must integrate with the configurator dedicated to modular furniture and also allow users to compose the LED lighting available in the catalog.

The challenge

Create an intuitive, high-performance room planner that supports distinct buying journeys: central flooring islands, standard rooms, custom floor plans, and projects focused on lighting or furniture. The system must enforce physical constraints such as tile laying direction and collisions between elements, while balancing ease of use with the range of real-world configurations available.

The solution

Inside the web 3D configurator hosted on a dedicated subdomain, we created two separate routes dedicated respectively to flooring islands with perimeter ramps and the complete room planner.

The room planner was structured with a progressive step flow to keep the user's focus on the key decisions to make:

  • Room drawing: rectangular, L-shaped or freehand drawing with automatic suggestions
  • Opening placement: doors and shutters
  • Tile category selection, with different dimensions
  • Installation direction choice
  • Flooring configuration and drawing
  • Furniture insertion with integration and round-trip redirect to the furniture configurator
  • LED lighting configuration

The room planner includes:

  • 2D floor plan drawer with multiple modes and features
  • On-click/tap interaction system with the 3D flooring: paint mode, single tile select, override logic, etc.
  • 3D room rendering with an algorithm that automatically manages the view through walls
  • Real-time drag for positioning furniture and lights
  • Anti-collision system for furniture and lights
  • CPQ engine for calculating the different discounts
  • Custom checkout API and cross-sell logic
  • Landing routes to restore configurations already sent to the cart and share them between users
  • Integration with the furniture configurator developed in the same program