Atelier Volume — Configurateur 3D interactif

Le point de départ

Atelier Volume est une application web que j'ai conçue et développée pour rendre un projet d'aménagement lisible par tous. La démonstration s'appuie sur la maquette d'un immeuble existant : sa géométrie est conservée telle quelle, seules les informations d'identité et les métadonnées du dossier en ont été retirées.

Le problème

Autour d'un bâtiment, les échanges passent par des plans, des photos annotées et de longs messages : chacun se représente l'idée à sa façon. La maquette 3D, quand elle existe, reste dans un logiciel que seuls les spécialistes savent utiliser. Il manquait un outil simple pour voir le bâtiment, y essayer une modification et la transmettre sans ambiguïté.

La réponse

J'ai transformé le modèle architectural en outil interactif, utilisable sans installation sur ordinateur comme sur téléphone. On fait tourner le bâtiment, on sélectionne un élément, on le modifie, puis on transmet sa version par un simple lien ou dans un rapport imprimable.

• 485 éléments du bâtiment sélectionnables et éditables : fenêtres, balcons, toitures…
• Déplacement, rotation, dimensions et couleur de chaque élément, à la souris ou dans le panneau
• Ajout de volumes et d'équipements illustratifs pour tester une idée
• Commentaires sur la proposition, annuler et rétablir pour comparer ses essais
• Sauvegarde locale dans le navigateur et partage d'un instantané par lien
• Export et import JSON, export du modèle 3D (GLB) et de l'image de la vue
• Rapport imprimable en PDF, interface pensée pour l'ordinateur et le mobile

La démo en images

Essayer la démo ↗︎

Sous le capot

Le bâtiment est affiché et modifié directement dans le navigateur grâce à Three.js ; l'application, écrite en JavaScript et assemblée avec Vite, se charge sans compte ni installation. Des scripts Python préparent le modèle publié : ils retirent les métadonnées du dossier sans toucher à la géométrie. Avec Higgsfield 3D Jutsu, j'ai travaillé les matériaux et le rendu — textures génériques d'enduit, de tuiles et de fenêtres, éclairage retravaillé — pour que la maquette se lise d'un coup d'œil. Le site est déployé sur Vercel.

Le défi notable

Rendre la maquette plus réaliste sans perdre l'édition : textures et éclairage devaient s'ajouter sans modifier la géométrie ni casser la sélection des 485 éléments. Une toiture faite de plusieurs matériaux, par exemple, devait rester un seul élément que l'on déplace d'un geste. À chaque étape, j'ai vérifié que le modèle exporté, rouvert dans un logiciel 3D, retrouvait tous ses éléments à leur place.

Mon rôle

J'ai mené le projet de bout en bout : analyse du besoin, conception de l'interface, développement de l'application et de l'éditeur 3D, préparation du modèle, travail des matériaux et de la lumière, tests sur ordinateur et sur mobile, puis mise en ligne.

Où en est le projet ?

La démonstration est en ligne et ouverte à tous. Les dimensions et les emplacements y restent indicatifs : l'outil sert à visualiser et à discuter une idée ; il ne remplace ni un relevé ni une étude technique, et la qualité du rendu ne garantit pas la précision des mesures. L'édition porte sur les éléments ; le travail fin sur leur forme se poursuit dans un logiciel 3D après export.

Et pour votre projet ?

Le même principe s'adapte à d'autres métiers et à d'autres objets : il suffit d'un modèle 3D et d'une idée claire de ce que l'utilisateur doit pouvoir faire. Je peux réaliser pour vous :

• des configurateurs 3D, pour choisir et visualiser une option avant de la commander
• des outils de simulation visuelle, pour tester une modification avant de la réaliser
• des présentations de projets interactives, à partager par un simple lien
• des rapports interactifs adaptés à votre métier, imprimables en PDF

Quelques repères

Les outils du projet

Affichage et édition 3D

Three.js, JavaScript

Application web

Vite, interface ordinateur et mobile

Préparation du modèle

Python

Matériaux et rendu

Higgsfield 3D Jutsu

Mise en ligne

Vercel