Expérience web interactive 3D pour Prescott & Davies Law

Ce projet intègre une statue de Thémis modélisée sous Blender dans une scène three.js afin de transformer le site classique d'un cabinet d'avocats en une expérience 3D interactive pensée pour ordinateur. Au chargement de la page, les utilisateurs sont accueillis par des animations de caméra et d'éclairage autour de la statue, avant de passer à des scènes 3D distinctes liées à chaque domaine d'expertise.

Danslescoulisses:lastack3DetlepérimètreduprojetpourPrescott&DaviesLaw

Un aperçu des outils que nous avons utilisés et des livrables concrets, de la modélisation 3D sous Blender à l'implémentation three.js en production dans le navigateur.

Scène héro avec Thémis en 3D

Une statue de Thémis modélisée sous Blender trône au centre de la section héro, rendue avec three.js et animée d'une rotation subtile qui ancre toute l'expérience.

Scènes 3D dédiées à chaque domaine d'expertise

Chaque domaine juridique (conseil, contrats, pénal, droit du travail, immobilier) déclenche son propre modèle GLTF et son contenu, avec des transitions animées entre les objets.

Configuration three.js à double scène

Une scène est dédiée à la Thémis principale du héro, tandis qu'une seconde gère les modèles propres à chaque service, chacune disposant de sa propre caméra et de son propre moteur de rendu.

Animation d'introduction synchronisée pour la caméra et l'éclairage

Au premier chargement, la caméra remonte de la base de la statue jusqu'au visage, pendant que la rotation du modèle et les lumières s'animent sur une timeline de tween partagée.

Éclairage réactif à la souris et curseur personnalisé

Les lumières directionnelles et d'appoint réagissent en douceur aux mouvements de la souris, et un curseur personnalisé à traînée ajoute une couche d'interaction subtile sur l'ensemble de la mise en page.

Expérience pensée pour ordinateur et parcours de chargement

Les modèles compressés en Draco sont chargés via un gestionnaire de chargement et un overlay personnalisés, et les visiteurs mobiles voient un message dédié les informant que l'expérience est optimisée pour ordinateur.

Construisons ensemble

Développez votre activité avec les solutions de dodbyte creative studio en nous contactant dès maintenant

Contact