Mo.js - Een complete Motion Graphics-bibliotheek voor het web

Animatie op internet is er om te blijven zoals JavaScript wordt alleen maar krachtiger en browserondersteuning groeit met elk voorbijgaand jaar.

De meeste van de bekende animaties concentreren zich op de interface: vervolgkeuzemenu's, tabbladen en diavoorstellingen zijn veelvoorkomende voorbeelden.

Maar Mo.js is anders. Dit is een JavaScript-bibliotheek gemaakt voor aangepaste bewegende beelden om ontwerpers te helpen geweldige geanimeerde functies te maken die verder gaan dan eenvoudige UI / UX-trucjes.

Als u de startpagina van Mo.js bezoekt, vindt u de volledige documentatie samen met een geweldige tutorial voor beginners.

Let op dit bibliotheek is best lastig om mee te werken. U moet bekend zijn met elementaire frontend-codering voordat u zelf met Mo.js aan het knutselen bent. Er is echter veel dat u kunt ophalen door de live demo's te bestuderen en in een deel van de broncode te graven.

Neem een ​​kijkje in de hoofdrepos van GitHub als je demo's in actie wilt zien.

Er is een hele lijst met links van CodePen die allemaal live Mo.js demo's bevatten. Waaronder fullscreen pagina animatie laders, click-to-animate microinteracties, en tonnen vormmanipulaties.

Deze pen zorgt bijvoorbeeld voor een behoorlijk gekke microinteractie door gebruikersinvoer (klik gewoon ergens binnen in de pen om deze te zien).

Sommige van deze pennen voelen misschien overdreven, maar dit zijn niet alleen JS-animaties. Ze zijn echt als kunstwerken.

Deze demo's bewijzen hoe ver we zijn gekomen met animatie op internet. Het feit dat iedereen deze effecten kan maken met alleen de frontend-code is gewoon ongelooflijk.

Als je meer wilt zien van Mo.js, bekijk dan de demo's op GitHub. Misschien vind je het ook leuk dat deze zelfstudie stap voor stap leert hoe je met de Mo.js-bibliotheek kunt werken.

Hoe dan ook, dit is het een van mijn favoriete animatiebibliotheken daten. Het biedt zoveel controle dat je het nergens anders kunt vinden. En het helpt microinteracties van mobiele apps naar webontwerp te brengen.