Autore: 希彼赫
Provalo dal vivo Su questo progetto
FLORA porta le nazioni dei Mondiali e i loro fiori simbolo in una sala espositiva dalla luce calda: la jacaranda argentina, il tulipano olandese, il crisantemo giapponese, la cattleya colombiana — ogni fiore è un modello 3D generato con Tripo su una piattaforma girevole, da trascinare ed esaminare da vicino.
Schede d'archivio effetto vetro liquido riportano per ogni fiore nome scientifico, famiglia, fioritura, simbologia e note culturali; una barra delle bandiere cambia paese con un clic, oppure accendi la camera e sfoglia coi gesti. Gli asset seguono un unico protocollo di consegna (orientamento +Z, origine alla radice dello stelo), e i sostituti procedurali riempiono in automatico gli slot mancanti.
Punti salienti
- Trascina per ruotare ogni esemplare sulla sua piattaforma, doppio clic per il primo piano
- Cambia nazione con un clic dalla barra delle bandiere, o sfoglia coi gesti della mano davanti alla camera
- Schede d'archivio effetto vetro liquido presentano nome scientifico, famiglia, fioritura, simbologia e note culturali
- Gli asset mancanti si riempiono in automatico con sostituti procedurali sullo stesso protocollo, così nessun piedistallo resta vuoto
Analisi tecnica
Esemplari 3D · Tripo text-to-3D
I sei fiori nazionali della sala — cattleya, dalia, uccello del paradiso, crisantemo, jacaranda e tulipano — sono tutti opera di Tripo text-to-3D, esportati in GLB e caricati su richiesta da GLTFLoader.
Ogni fiore segue la stessa convenzione: fronte verso +Z, origine alla base dello stelo, circa un’unità di altezza. E se un esemplare dovesse mancare, il codice genera un sostituto procedurale con la stessa convenzione e lo mette sul piedistallo — nessuna teca resta mai vuota.
Luce calda · IBL con RoomEnvironment
Nella sala non c’è una sola lampada piazzata a mano: tutta la luce calda viene da RoomEnvironment di Three.js, che genera una environment map con cui i materiali PBR dei modelli Tripo mostrano in modo naturale riflessi e diffusione morbida. Niente regolazioni lampada per lampada — una environment map e la luce è fatta.
Cartellini da museo · CSS3DRenderer
Nomi scientifici, famiglie e note culturali sui cartellini sono veri elementi DOM, che ruotano in sincronia con la scena 3D grazie a CSS3DRenderer. I vantaggi sono concreti: il testo resta nitido a qualsiasi distanza, si può selezionare e copiare, e perfino l’effetto liquid glass è scritto in CSS normale.
Sfogliare con i gesti · MediaPipe Hands
Oltre a cliccare la barra delle bandiere in basso, la sala si sfoglia anche senza contatto: MediaPipe Hands legge la mano attraverso la fotocamera, un gesto e si passa allo stand della nazione successiva — puoi girare tutta la sala senza toccare il mouse.
