Chi siamo

Animorio raccoglie animazioni e componenti di interfaccia pronti da usare nei siti: 492 animazioni, 468 componenti e 3 oggetti 3D. Ogni pezzo ha l’anteprima dal vivo, il codice completo da copiare, uno zip che funziona da solo e un Playground dove si cambiano valori, colori e testi e si vede subito il risultato. È tutto gratis.

Le animazioni più belle si vedono nei siti premiati, ma studiarle è difficile: il codice è compresso, mescolato con tutto il resto del sito, e nessuno spiega le scelte. Animorio fa il contrario. Ogni movimento sta in una cartella che funziona da sola, con il codice leggibile e commentato, e una scheda che racconta come è costruito e perché.

L’idea è che chi fa siti possa prendere un’animazione, capirla e adattarla al proprio progetto in pochi minuti, invece di copiare qualcosa che non sa modificare.

La libreria divide le animazioni per famiglia: scroll, testo, hover, SVG, transizioni, fisica, WebGL, 3D e immagini. I componenti sono i pezzi di interfaccia di tutti i giorni (pulsanti, menu, barre di navigazione, schede, campi dei moduli) con un movimento curato. I pacchetti li raccolgono per tipo di progetto.

Il Playground di ogni pezzo mostra i suoi «valori da cambiare» come manopole: durate, colori, distanze, testi. Gli oggetti 3D si scaricano come modelli pronti per il web. Per chi lavora con un assistente di programmazione c’è il connettore per Claude, che cerca nella libreria e porta il codice direttamente nel progetto.

Per chi costruisce siti: sviluppatori front-end, designer che scrivono codice, studenti che vogliono capire come si muove un’interfaccia. Non serve conoscere GSAP o WebGL per usare un pezzo; per capirlo fino in fondo basta leggere la sua scheda.

Ogni animazione è disegnata e scritta da zero: niente template, niente codice preso da altri. Usiamo strumenti standard del web (GSAP, CSS, SVG, canvas e WebGL), e ogni pezzo viene provato sul computer, sul telefono e con il movimento ridotto attivo, per chi preferisce meno animazioni.

Nella scheda di ognuno spieghiamo cosa fa, come funziona passo per passo, quali valori si possono cambiare e quali problemi abbiamo trovato costruendolo.

Le regole valgono per ogni pezzo: le stesse animazioni sul telefono, con le misure adattate; con il movimento ridotto niente spostamenti, solo dissolvenze o il risultato già al suo posto; prima di pubblicare, l’anteprima registrata dalla demo vera, dall’inizio alla fine.

In «Com’è fatto» smontiamo i siti animati che ci piacciono. Leggiamo il loro codice pubblico per capire come sono fatti, lo raccontiamo in un articolo e rifacciamo da zero le animazioni più belle, con testi, immagini e codice nostri. Gli articoli sono in italiano e in inglese.

Le animazioni si possono usare nei propri progetti e in quelli dei clienti, anche commerciali; non si possono rivendere o ridistribuire così come sono. I dettagli sono nella licenza d’uso. GSAP, la libreria su cui si basano molte animazioni, dal 2025 è gratuita anche per uso commerciale.

Le anteprime, il codice, il Playground e il giornale sono aperti a tutti, senza account. Per scaricare lo zip basta un account gratuito.

Animorio è gratis e vuole restarlo. Per sostenerlo, in futuro alcune pagine potranno mostrare annunci, solo in spazi dedicati fra le schede o fra gli articoli, mai a tutto schermo.

Dietro Animorio c’è il team di Animorio: un piccolo gruppo che disegna, scrive e prova ogni pezzo prima di pubblicarlo, e che sceglie i prossimi anche dalle richieste di chi usa il sito.

Per domande, proposte o segnalazioni c’è la pagina Contatti. Per chiedere un’animazione che non trovi, o un sito da smontare nel giornale, c’è il questionario «Chiedi tu».