Auteur: 希彼赫
Essayer en direct À propos de ce projet
FLORA installe les nations de la Coupe du monde et leurs fleurs emblématiques dans une galerie à la lumière chaude : le jacaranda argentin, la tulipe néerlandaise, le chrysanthème japonais, la cattleya colombienne — chaque fleur est un modèle 3D généré par Tripo sur un plateau tournant, à manipuler et examiner de près.
Des fiches d'archive en verre liquide détaillent pour chaque fleur le nom scientifique, la famille, la période de floraison, la symbolique et des notes culturelles ; une barre de drapeaux change de pays en un clic, ou activez la caméra et feuilletez par gestes. Les assets suivent un protocole de livraison unique (orientation +Z, origine à la base de la tige), et des substituts procéduraux comblent automatiquement les emplacements manquants.
Points forts
- Faites glisser pour faire tourner chaque spécimen sur son plateau, double-cliquez pour un gros plan
- Changez de pays en un clic depuis la barre de drapeaux, ou feuilletez par gestes de la main devant la caméra
- Des fiches d'archive en verre liquide présentent nom scientifique, famille, période de floraison, symbolique et notes culturelles
- Les assets manquants sont remplacés automatiquement par des substituts procéduraux au même protocole — aucun socle ne reste vide
Analyse technique
Spécimens 3D · Tripo text-to-3D
Les six fleurs nationales de la galerie — cattleya, dahlia, oiseau de paradis, chrysanthème, jacaranda et tulipe — sont toutes l’œuvre de Tripo text-to-3D, exportées en GLB puis chargées à la demande par GLTFLoader.
Chaque fleur suit la même convention : face vers +Z, origine à la base de la tige, environ une unité de haut. Et si un spécimen vient à manquer, le code fait pousser un substitut procédural selon la même convention et le pose sur le socle — aucune vitrine ne reste vide.
Lumière chaude · IBL RoomEnvironment
Pas une seule lampe posée à la main dans la galerie : toute la lumière chaude vient de RoomEnvironment de Three.js, qui génère une environment map grâce à laquelle les matériaux PBR des modèles Tripo révèlent naturellement leurs reflets et leur diffusion douce. Pas de réglage lampe par lampe — une seule environment map, et l’éclairage est en place.
Cartels de musée · CSS3DRenderer
Les noms scientifiques, familles et notes culturelles des cartels sont de vrais éléments DOM, qui tournent en synchronisation avec la scène 3D via CSS3DRenderer. Les bénéfices sont très concrets : le texte reste net à toute distance, on peut le sélectionner et le copier, et même l’effet verre liquide est écrit en simple CSS.
Tourner les pages d’un geste · MediaPipe Hands
En plus de la barre de drapeaux en bas, la galerie se feuillette aussi sans contact : MediaPipe Hands lit votre main à travers la caméra, un geste suffit pour passer au stand du pays suivant — on visite toute la galerie sans toucher la souris.
