Mo.js - Una libreria di Motion Graphics completa per il Web

L'animazione sul web è qui per rimanere come JavaScript sta diventando sempre più potente e il supporto del browser sta crescendo con il passare degli anni.

La maggior parte delle animazioni con cui abbiamo familiarità si concentra sull'interfaccia: menu a discesa, pulsanti a schede e presentazioni sono esempi comuni.

Ma Mo.js è diverso. Questo è un Libreria JavaScript creata per la grafica animata personalizzata per aiutare i designer a creare incredibili funzionalità animate che vanno oltre semplici trucchi UI / UX.

Se visiti la homepage di Mo.js, troverai il documentazione completa insieme a un ottimo tutorial per principianti.

Nota questo la biblioteca è piuttosto dura con cui lavorare. Dovresti avere familiarità con la codifica di base del frontend prima di armeggiare con Mo.js da solo. Tuttavia, c'è molto che puoi raccogliere solo studiando le demo live e scavando in alcuni dei codici sorgente.

Dai un'occhiata al principale repo di GitHub se vuoi vedere alcune demo in azione.

C'è un intero elenco di link da CodePen tutti con demo live di Mo.js. Questi includono caricatori di animazioni di pagine a schermo intero, microinterazioni click-to-animate, e tonnellate di manipolazioni di forme.

Ad esempio, questa penna crea una microinterazione piuttosto pazza dall'input dell'utente (basta cliccare ovunque all'interno della penna per vederla).

Alcune di queste penne potrebbero sembrare esagerate, ma queste non sono solo animazioni JS. Sono davvero come opere d'arte.

Queste dimostrazioni dimostrano fino a che punto siamo arrivati con animazione sul web. Il fatto che chiunque possa creare questi effetti usando solo il codice frontend è semplicemente incredibile.

Se vuoi vedere altro da Mo.js, dai un'occhiata alle demo su GitHub. Ti potrebbe piacere anche questo tutorial che spiega come utilizzare la libreria Mo.js passo dopo passo.

Ad ogni modo, questo è una delle mie librerie animate preferite ad oggi. Offre così tanto controllo che non puoi trovare da nessun'altra parte. E aiuta a portare le microinterazioni dalle app mobili al web design.