Sajjan Ghale
Un site d’expédition en 3D piloté par le défilement pour un guide de haute montagne UIAGM
- Année
- 2026
- Type
- Projet client
- Rôle
- Conception, 3D et ingénierie frontend
- Statut
- En développement
Le site de Sajjan Ghale, guide de haute montagne UIAGM. L’accueil est une seule descente de la voie du col Sud de l’Everest, rendue en WebGL à partir de données topographiques : le défilement conduit la caméra du sommet jusqu’au camp de base, camp après camp. Le site est en français, pour sa clientèle francophone.
Contexte
Sajjan Ghale guide des expéditions himalayennes, pour une clientèle française. Le site d’un guide doit d’abord établir la crédibilité et la sécurité, et donner à voir la montagne elle-même plutôt que des photos d’illustration.
Approche
L’accueil est une descente continue. Le relief est le vrai Khumbu, issu du relevé altimétrique Copernicus et compacté en carte de hauteurs ; le tracé de la voie est calculé sur ces données plutôt que dessiné à la main. Une seule boucle de rendu relie la position de défilement à la caméra et aux uniformes des shaders : la scène ne déclenche aucun rendu React pendant le défilement.
Toutes les autres pages sont légères, centrées sur le texte et sans WebGL : elles se chargent aussi vite qu’un document.
Décisions techniques
Pourquoi de vraies données topographiques plutôt qu’une montagne modélisée ?
- Décision
Le relief est issu du relevé altimétrique Copernicus ; les lieux nommés et la voie y sont positionnés.
- Pourquoi
Le public du site gravit ces montagnes. Un sommet stylisé se lit comme un décor ; la vraie voie, à l’échelle, se lit comme une expertise.
- Alternatives envisagées
Une montagne modélisée à la main ou générée procéduralement.
- Compromis
Une étape de préparation pour la carte de hauteurs et un soin particulier au dégagement de la caméra au-dessus du relief réel. Le relevé ne couvre que le Khumbu : les autres sommets demandent encore des photos.
Performance, sécurité et accessibilité
La scène adapte sa qualité à l’appareil et se dégrade en direct si le rendu ralentit. Les personnes qui réduisent les animations reçoivent le contenu sans déplacement de caméra. Le chargement du relief démarre à l’hydratation, et l’attente est montrée franchement plutôt que masquée par un indicateur.
Technologies
- TypeScript
- Next.js
- Three.js
- React Three Fiber
- GSAP