Waarom jij Lottie animaties moet inzetten

29 mrt 2021 | Alles over animatie

Lottie? Is dat een persoon die ik moet volgen op Instagram? Nee joh! Het is een soort GIFje, maar dan met veel meer voordelen! In deze blog leg ik je uit wat een Lottie animatie is en wat je ermee kan doen.

Wat is een Lottie animatie?

Lottie animaties zijn korte animaties die JSON-based zijn. Ehm ja, oke? Simpel gezegd houdt dit in dat je het bestand kan schalen, zonder dat het gaat pixelen. Je kan het vergelijken met een GIFje, maar dan van veel hogere kwaliteit.

Hier zie je het verschil tussen een GIF en een Lottie:

GIF

Lottie

Lottie animaties kan je heel goed inzetten op jouw website. Het trekt echt de aandacht van de bezoeker naar datgene wat jouw klant moet lezen. Je kan het gebruiken voor bewegende iconen om jouw werkwijze uit te leggen, maar bijvoorbeeld ook voor geanimeerde buttons. Lotties zijn ook in te zetten op interactieve omgevingen en in apps, zoals Telegram.

Wat zijn de voordelen van een Lottie animatie?

Een Lottie is een heel klein bestand, waardoor de laadtijd van jouw site veel sneller zal zijn met GIFjes of grote PNG bestanden.

Een Lottie is een vector bestand, waardoor je de animatie zo groot (of klein) kan schalen als je wilt. Dus zeg maar daaaag tegen die vervelende pixels!

Een Lottie kan je helemaal aanpassen naar jouw wensen. Je kan de afspeelsnelheid veranderen en instellen hoe een Lottie moet afspelen. Denk aan een mouse-over-effect, scroll-effect of gewoon in een constante loop.

Zelf een Lottie animatie maken

Kan jij animaties maken in After Effects? Dan kan jij ook Lotties maken! Op de site van Lottie kan je een plugin downloaden, waardoor jij heel makkelijk Lotties kan uploaden. Pluspunt: Je kan ze ook verkopen!

Je kan ook een bestaande Lotties heel makkelijk aanpassen naar jouw huisstijl! Hoe werkt dat? Je gaat naar de site van Lottie, kiest een leuke animatie uit en past de kleuren naar wens aan. Je hebt de keuze uit betaalde en gratis Lotties, dus neem zeker een kijkje 🙂

Zijn er ook nadelen?

Helaas wel! 🙁

Lotties werken (nog) niet op Instagram. Maar niet getreurd: Je kan een Lottie exporteren als GIF. Deze kan jij wel gebruiken op Instagram. Wil je weten hoe jouw GIFjes zichtbaar worden op Instagram? Lees het in deze blog: Eigen Instagram GIFjes: Hoe werkt dat?

Omdat Lotties JSON based zijn, kan je niet met foto’s, photoshop of illustrator bestanden werken. Wat wel werkt, is als je van je illustrator laag een shape layer maakt in After Effects.

Bij het maken van een Lottie heb je een paar technische issues waar je tegenaan kan lopen. Zo werkt het nog niet optimaal met bepaalde plugins en effecten.

Kortom, de nadelen zijn vooral voor de animatie-nerds onder ons. 😎