Configurateur 3D d’escaliers « WEBA »

Configurateur 3D WebGL, accessible en ligne.

Développé sur framework PHP Symfony et Unity

Un configurateur 3D de très haute technicité, complet, allant de la définition du projet en 2D/3D jusqu’à la CRM intégrée.

« Le studio 3D at Home nous a accompagné dans toute la réalisation de notre projet de configurateur d’escalier, depuis sa définition jusqu’à son déploiement chez nos distributeurs.

Merci à toute l’équipe pour leur professionnalisme et leur disponibilité. »

Stéphane Gautier, Escaliers Bois de l'Aubrac

Fonctionnalités du configurateur 3D

  • 100% en ligne – Aucun téléchargement

  • Connexion d’un utilisateur

  • Identification d’un revendeur

  • Statuts Commercial/ADV/BE/Administrateur

  • Droits spécifiques selon statut

  • Secteurs géographiques

  • Enregistrement des projets/devis

  • Gestion des préférences personnelles

  • Demandes d’assistance technique

  • Visionneuse 3D mobile du projet (QR Code)

  • Back-office : conversion d’un client en revendeur

  • Back-office : gestion des utilisateurs

  • Saisie des dimensions de trémie

  • Choix d’une forme d’escalier

  • Calcul automatique des dimensions

  • Dessin 2D avec cotes

  • Vue 3D du modèle d’escalier

  • Choix d’essence de bois et teinte

  • Choix de peinture

  • Garde-corps, main courante et soubassement

  • Nombreuses options techniques

  • Back-office : gestion des tarifs

  • Back-office : gestion de l’offre

  • Véritable CRM intégrée

  • Groupes avec taux de remise spécifiques

  • Gestion des prospects, comptes et contacts

  • Génération de devis PDF

  • Gestion automatique des statuts de projets

  • Recherche par étape, client, produits ou secteurs

  • Bon de commande PDF

  • Validation de commande en 1 clic

  • Gestion des tarifs revendeurs

  • Transfert référence SAGE (ERP)

  • Statistiques et indicateurs commerciaux

Le besoin client

L‘histoire de ce projet est très particulière, car la SCOP EBA était un ancien client pour qui nous avions réalisé des images de synthèse photo-réalistes afin de les intégrer dans leur catalogue papier et leur site web. En difficulté en 2017, la SCOP a été sauvée par un entrepreneur désireux de conserver cette activité industrielle locale, tout en conservant l’esprit familial qui la caractérisait.

Devenue une SAS, EBA et son nouveau dirigeant ont souhaité moderniser leurs outils de communication et de vente. Liés historiquement à un éditeur de logiciel de devis de menuiserie, ils ont eu la volonté de devenir autonomes en investissant, et en proposant gratuitement à leur réseau de distribution ainsi qu’à leurs commerciaux un configurateur 3D innovant, simple, et complet.

L’idée d’un configurateur 3D associé à une CRM est donc née, et leur expérience passée avec 3D at Home sur d’autres prestations leur a donné l’envie de poursuivre la collaboration sur un projet plus ambitieux. Nous avons donc rapidement pu poser les premières pierres permettant d’analyser le besoin réel de notre client, et lui proposer une solution complète et sur mesure.

Le déroulement du projet

Comme bien souvent, l’histoire a débuté par un fichier Excel… Notre client a eu beaucoup de difficultés à formaliser son offre de manière exhaustive, celle-ci étant très spécifique et riche d’une évolution de leur offre depuis plusieurs dizaines d’années.

Il aura fallu plusieurs mois pour analyser, simplifier, et ordonner les produits du catalogue sur des critères qui étaient exploitables par un logiciel. Le calcul des tarifs a également été totalement revu sur des critères nouveaux, ce qui a demandé à EBA une remise en question profonde.

Une analyse technique fine des calculs spécifiques aux escaliers a été réalisée ensuite. Il paraît qu’il n’y a rien de plus complexe qu’un escalier dans le monde de la menuiserie…. Nous confirmons en tous cas que ce n’est pas simple !

La trémie, les faux-aplombs, les virages en « marches balancées », les marches de départ et d’arrivée : tous ces termes techniques, nouveaux pour notre équipe, ont été intégrés et pris en compte dans l’ensemble des calculs.

Lorsque les aspects techniques sur la conception d’un escalier ont été maîtrisés, notre équipe a pu analyser les autres aspects de l’application.

Les mêmes questions se posent pour chaque projet, mais sont essentielles pour construire une application solide : qui va utiliser l’application, comment, dans quel but, etc. On se rend compte rapidement que plusieurs types d’utilisateurs vont coexister, et que leurs attentes ne sont pas les mêmes : revendeurs, commerciaux EBA, ADV, BE, Administrateur : tous ces profils doivent pouvoir utiliser l’application avec des droits et objectifs différents.

Ces questions, complétées par les modes de calcul des tarifs et la formalisation de l’offre produit (gammes, options, etc.), permettront à terme de réaliser le modèle de base de données qui constituera le squelette du configurateur 3D. Vous pouvez avoir un aperçu de la V13 de ce modèle ci-joint ! 😉

Pour réaliser un configurateur 3D complet, de multiples compétences spécifiques sont requises : la formalisation du besoin est la première étape, puis viendra très rapidement la phase de développement, mêlant des compétences graphiques (UI/UX Design), 3D (modélisation, shading, lighting), et de développement web (html, css, PHP, SQL, etc.).

Nous avons opté pour le framework Symfony car celui-ci est très ouvert, et sa souplesse permet de faire évoluer le configurateur relativement facilement. La 3D a été développée sur 3D Studio Max, puis intégrée dans Unity afin d’y appliquer des scripts C# et de permettre l’export en WebGL.

La phase d’analyse étant achevée, nous pouvons entrer dans une phase de production pure, avec la réalisation des modèles 3D, du design de l’interface, et de l’intégration du code informatique.

La production

La modélisation 3D des éléments du projet a été relativement complexe compte-tenu de la multitude de formes et de gammes d’escaliers, ainsi que des garde-corps.

Notre équipe a créé ces modèles en prévoyant de pouvoir y appliquer tous types de matériaux (différentes essences de bois, sur lesquelles sont appliquées des teintes, et parfois des parties métalliques peintes).

L’ensemble des modèles 3D a été validé par le BE d’EBA. Cette étape de validation a permis de corriger les premières erreurs et de partir sur des choix de conception réalistes.

Une fois que nous avons les idées claires sur le besoin et que les difficultés techniques « métiers » sont levées, il est temps de passer à la phase de conception graphique de l’application.

Nous nous sommes inspirés des recommandations de Google Material Design pour la création de l’interface du configurateur 3D. Des maquettes animées (prototypes) ont été réalisées sur l’application proto.io, ce qui a permis de valider le parcours utilisateur avant de commencer la conception des pages web.

La phase de codage des plans 2D a été particulièrement difficile, car il n’existe aucune trame prédéfinie, et la position de chaque trait doit être codé individuellement en fonction des calculs issus des données d’entrée et des algorithmes créés pendant les phases préliminaires.

Chaque ajustement doit être répercuté dans tous les cas de figure : orientation de l’escalier, du dessin, type de limon, cotes, etc. C’est pour cette raison que la définition du besoin était si précieuse !

Les briques du configurateur 3D commencent à prendre forme : une interface, un outil de dessin 2D, la visualisation 3D, une base de données pour gérer l’offre, les clients et les projets… Il n’y a plus qu’à !

Enfin le projet abouti : l’interface permet de saisir les données d’entrée, qui sont interprétées sous forme de dessin 2D, et permettent de générer une visualisation 3D réaliste. Nous devons avouer que ce moment précis où tous les blocs communiquent entre eux est terriblement exaltant !

La dernière étape est le calcul du prix, mais tout avait été construit pour cela. Le client peut administrer ses tarifs depuis un back-office dédié, et les calculs sont réalisés en temps-réel par l’application, pour être ensuite présentés sous la forme d’un devis.

La finalité

Le configurateur 3D permet enfin de générer des devis PDF, et à l’administration des ventes de suivre les étapes de l’évolution d’un projet (Devis, commande passée, commande refusée, commande validée) en 1 clic.

Tout ceci est intégré dans la même interface, où se mêlent les clients, comptes, groupes, revendeur et commerciaux de manière fluide et organisée.

Le petit « plus » : le devis intègre un QR Code que les clients finaux peuvent scanner depuis leur smartphone pour avoir une vue 3D interactive de leur futur escalier sans aucune autre manœuvre, et la présenter à leurs proches !

Ce projet de configurateur 3D a constitué une expérience incroyable et unique pour toute notre équipe, avec ses difficultés et ses réjouissances pendant de nombreux mois. Celle-ci a soudé l’équipe encore un peu plus, et a permis de nouer des liens forts avec notre client et ses équipes.

Ce projet nous a aussi appris à exploiter de nouveaux outils, et a mûri notre expertise technique. Désormais, 3D at Home peut développer n’importe quel configurateur 2D/3D adossé à un site e-commerce ou à une CRM, le tout dans un environnement ultra évolutif.

Aujourd’hui, plusieurs dizaines de devis sont réalisés quotidiennement sur l’application, dans des centaines de points de vente partout en France. C’est une réelle satisfaction pour notre client, et une immense fierté pour notre équipe !