( caso studio /19 )R&D · WebGL

Oltre le Nuvoleesperienza 3D

Un portfolio può essere un viaggio invece che una lista? Un unico scroll: dalle nuvole all'alba fino a una galleria di quadri celebri che rivelano i progetti.

1scroll continuo, nessun click
4quadri-progetto in galleria
2modalità: giorno e notte
/01

La domanda di ricerca

Le esperienze 3D nel browser sono spettacolari nei demo e spesso ingestibili in produzione: pesanti, scattose, incompatibili. Oltre le Nuvole esplora fino a dove si può spingere la narrazione tridimensionale mantenendo fluidità su hardware normale.

/02

Il viaggio

Tutto accade in un unico scroll: si sale tra le nuvole all'alba, si attraversa una finestra sospesa nel cielo, un tunnel di parole giganti, e si atterra in una galleria d'arte dove quadri celebri reinterpretati rivelano i progetti — ogni tela è un lavoro reale, ridipinto nello stile di un maestro. Un toggle trasforma l'intera scena da giorno a notte: luci, cielo, atmosfera.

/03

Sotto il cofano e lezioni

React Three Fiber e Three.js per la scena, GSAP per legare la timeline allo scroll, texture ottimizzate e caricamento progressivo. Le tecniche di scroll-orchestration sviluppate qui sono le stesse che portiamo nelle hero cinematografiche dei siti clienti — come lo scroll-film di NOVE Milano. Stato avanzato, in rifinitura di contenuti.

/ST

Scheda tecnica

React Three FiberThree.jsDreiGSAPViteVercel