Il modello del cubo di Rubik è stato creato con il software Blender, ma per visualizzare il modello GLB sul web è stato utilizzato Three.js.

Animazione 3D

Portare il 3D sul Web

Il progetto 3D su cui sto attualmente lavorando si chiama Diplomacy. La sua storia si riferisce agli eventi dolorosi che accadono nel mondo: quelle tragiche notizie che si ripetono ogni giorno e, a causa della loro costante ricorrenza, perdono il loro valore giornalistico. Tuttavia, nelle regioni dove questi problemi si verificano, le difficoltà persistono quotidianamente e le ferite rimangono aperte. Probabilmente hai già visto un breve frammento di questa animazione nella presentazione sulla homepage di questo sito. Questi frammenti, tuttavia, vengono completati gradualmente e saranno mostrati su questa pagina insieme ad altri miei lavori di animazione 3D.

Ma il mio interesse per il mondo dell’animazione 3D non finisce qui. In effetti, l’inizio di tutto questo è come tenere in mano un Cubo di Rubik all’inizio di un gioco apparentemente semplice. Un cubo al centro dell’universo, dove nascono i più grandi progetti 3D dalla scena iniziale. Pochi istanti dopo, tutte queste idee vengono realizzate in questo mondo apparentemente semplice. Per il mio progetto di tesi di laurea ho utilizzato il software Blender. Naturalmente, ho anche utilizzato vari altri strumenti come Adobe Premiere, Adobe Photoshop, Davinci Resolve, Adobe After Effects e persino Adobe Illustrator per completarlo. Tuttavia, non voglio fermarmi a questo punto. Sento ancora che c’è molto di più da realizzare e, onestamente, mi sento come se fossi solo all’inizio del mio percorso. Questo è un cammino che desidero davvero continuare a seguire.

Dall’animazione al Web: La potenza del 3D

Il 3D può trasformare l’esperienza sul WEB? Ne sono profondamente affascinato. Secondo me, aggiungono qualcosa di unico ai siti web: la profondità. Con i siti web 3D, puoi vedere un oggetto da tutte le angolazioni, navigare attraverso uno spazio tridimensionale o persino progettare un oggetto che entra in scena dall’interno di un ambiente. Questo senso di ambiguità e suspense rende lo spazio più misterioso e, quindi, più affascinante. Gli enigmi risolti, per quanto complessi, non sono così interessanti. Per me, la cosa più importante in ogni progetto è creare e raccontare una storia. Che si tratti di un container in Elementor WordPress, una presentazione, un’animazione o un sito web, ognuno di questi elementi dovrebbe raccontare una storia.

In alto su questa pagina puoi vedere un cubo che emerge da uno spazio galattico. Questo cubo è stato progettato con il software Blender e successivamente caricato su questa pagina in formato glb. Naturalmente, è stato utilizzato anche il caro JavaScript per completare questa scena. Ma qual è la storia dietro quel cubo luminoso? L’idea iniziale era quella di assegnare effetti di emissione ad alcune parti del cubo. Volevo implementare l’effetto di emissione direttamente all’interno del file glb utilizzato nel sito web. Tuttavia, questo processo era molto lungo e complesso, e alla fine ho optato per una versione completamente basata su JavaScript, che è quella che vedi qui. Sia il cubo in alto che quello costruito con JavaScript sono interattivi, e puoi giocarci usando il mouse: un’interazione molto semplice e quasi infantile, vero?

Questa pagina verrà arricchita gradualmente con altri lavori del mio portfolio. Man mano che il progetto Diplomacy progredisce, aggiungerò ulteriori sezioni su questa pagina nel tempo.

Qui sono stati utilizzati Three.js e alcune altre librerie JavaScript per implementare completamente il cubo di Rubik insieme a un effetto bloom.