Grâce à Lottie, insérez des animations plus fluides et réactives qu’un format GIF pour vos applications iOS, Android et vos sites web. Exportez directement au format JSON depuis After Effects et créez des interactions avancées dans vos applications à l’aide de PandaSuite.

Les animations ont un impact considérable sur vos utilisateurs. Grâce à vos animations, passez d’une interface bien conçue à une expérience attractive mémorable. Que ce soit pour transformer un moment d’attente, expliquer un process ou apporter une touche de fun, vous ne pouvez passer à côté de l’animation.

Des animations plus fluides et légères grâce au format JSON

Auparavant, réaliser une animation complexe était un process long et difficile. Il était nécessaire d’utiliser des formats d’images volumineux ou alors des gifs animés, ce qui alourdissait le poids d’une page et ralentissait le chargement. Ou de coder l’animation à partir d’une animation créée par un designer.

Développée par les équipes Airbnb, Lottie est une librairie open source iOS, Android et React Native qui génère les animations After Effects en temps réel, ce qui permet aux applications d’utiliser les animations aussi facilement qu’elles utilisent des images statiques. Au final, les animations sont plus fluides, plus légères et plus facilement contrôlables.

Nul besoin de savoir coder ! Bodymovin est le plug-in original depuis After Effect pour exporter les animations en JSON. Développé plus récemment le plug-in Lottiefiles offre des fonctionnalités supplémentaires pour optimiser le workflow des designers.

Le plug-in Bodymovin publié par Hernan Torrisi, l’inventeur du format Lottie

Grâce à PandaSuite, vous pouvez ajouter des actions sur ces animations comme le survol de la souris, jouer une fois, faire une boucle ou même être créatif et jouer les icônes une fois qu’elles ont défilé dans une section. Et encore une fois, sans une ligne de code.

Créez vos animations avec After Effects et Bodymovin / LottieFiles

Quel que soit le plug-in retenu, exportez directement vos animations After Effect dans le bon format.

• Préparez les ressources à importer dans After Effects

• Créez votre animation dans After Effects

• Exportez le fichier JSON à l’aide du plugin Bodymovin ou Lottiefiles

Vidéo de présentation du plug-in Lottiefiles

• Importez dans le composant After Effect de PandaSuite. Découvrez notre tutoriel : Animations After Effect

Créez des marqueurs, des déclencheurs et des actions sur votre animation JSON depuis PandaSuite

• Visualisez et tester l’animation sur un appareil avec l’application PandaSuite Viewer

Des collections d’animations gratuites

Vous ne savez pas utiliser After Effect ? Au sein de Lottiefiles, découvre une collection d’animations JSON gratuites, prêtes à être intégrées dans vos produits digitaux.

D’autres sites existent :

https://icons8.com/animated-icons

https://useanimations.com/