Détails du projet
Point de départ
VCGI regroupe une dizaine de métiers : topographie, géotechnique, ingénierie, environnement, matériel, terrassement, techniques, génie civil, assainissement, et son outil maison Linaster. Il fallait les présenter sur une seule page, à des clients et partenaires qui parlent trois langues, sans en faire une liste de services de plus.
La problématique
Trois contraintes guidaient le projet. Le visiteur ne devait jamais se perdre dans la scène. Les animations des engins, préparées par Simon dans Blender (27 animations : pelles, bulldozers, compacteur, tombereau, drone, trains…), devaient tourner sur le site exactement comme dans Blender. Et la scène devait rester vivante sans alourdir encore la géométrie.
Conception
Caméra isométrique fixe, déplacement limité au glisser et pas de zoom : on garde toujours une vue d'ensemble. Chaque métier est un point blanc sur la carte ; au clic, la caméra se pose sur la zone et un panneau s'ouvre avec le contenu. Les animations de Simon sont jouées telles qu'il les a faites : j'ai écrit le lien entre chaque engin et son animation, et nous avons itéré ensemble jusqu'à ce qu'elles fonctionnent toutes dans le navigateur. La vie de la scène passe par des shaders plutôt que par plus de modèles.
Mise en œuvre
Le site est construit en Vue 3 avec Three.js (r163). Les engins sont animés par un AnimationMixer qui associe chaque objet à son animation Blender. Les points cliquables passent par un Raycaster qui déplace la caméra et ouvre le panneau du métier. Les shaders modifient les matériaux de Three.js (onBeforeCompile) pour le vent dans les arbres, les ombres des nuages qui passent sur le chantier et les ondes émises par les antennes radio et le drone. Le chargement se fait en trois niveaux de priorité (essentiel, secondaire, complémentaire) derrière un écran qui affiche la progression. GSAP et Swiper complètent l'interface, et le contenu est disponible en français, anglais et allemand.
Un projet comme celui-ci ?
contact@valentingassend.comEssayez-moi 3 jours au forfait sur un composant ou un prototype de pitch : non facturé si le résultat ne convient pas. Réponse sous 72 h.
Voir les offres et les tarifs