Les animations Lottie, un plus pour votre site Internet ?

Son nom est un hommage à Charlotte « Lotte » Reiniger, réalisatrice allemande pionnière dans l’animation de silhouette dans les années 1900, elle a d’ailleurs réalisé l’un des premiers longs métrages d’animation « Les aventures du prince Ahmed » sorti en 1926.

Lottie est un open source d’animation vectorielle qui fonctionne grâce à JavaScript Object Notation (JSON), un format de données textuelles qui résulte de JavaScript. Ces animations ont été créées par l’une des branches du service de plateforme de location de logements de particuliers, Airbnb.

Lottie est un format de fichier d’animation qui permet aux concepteurs d’envoyer des animations sur différentes plateformes et qui fonctionne sur tous les appareils, ceci en conservant un ratio d’affichage responsif !

Visuels animations lottie site web

La petite histoire de Lottie sur le Web…

Dans les années 2010, avant Lottie, les créateurs concevaient les animations vectorielles et les développeurs les implémentaient. Cependant, motion designers et développeurs étaient confrontés à un problème : la conception et l’animation était assez limitées et la qualité très faible.

En 2015, Hernan Torrisi souhaitait trouver un format qui pouvait remplacer le format Adobe Flash, dont la fin était proche. Il a donc eu l’idée d’exporter la représentation d’une animation Adobe After Effects et de rendre l’image active. À la suite de sa découverte, il a publié un plugin nommé Bodymovin pour exporter la description au format JSON. Il a également édité le premier moteur de rendu pour ce format vectoriel avec un lecteur basé sur JavaScript pour les navigateurs et pour que les animations soient visibles de tous les internautes.

En 2017, des ingénieurs d’Airbnb ont compris le potentiel de ce nouveau format basé sur JSON et ils ont décidé de nommer les animations « Lottie » pour rendre hommage à la pionnière de l’animation graphique. Par la suite, ils ont créé des bibliothèques d’animations JSON pour iOS et Android.

Depuis 2021, Lottie est devenu le standard de référence dans l’animation graphique, il est donc essentiel pour les entreprises souhaitant utiliser des animations de connaître et d’utiliser ces nouvelles animations afin de rester compétitif. Pas de panique ! Younicom est spécialisé en animations vectorielles, alors contactez-nous pour avoir un aperçu de nos compétences.

Comment Lottie permet à un site Internet de se démarquer ?

Les Lottie sont des images vectorielles, concrètement, cela signifie que les visuels peuvent être redimensionnés à volonté sans que cela nuise à sa qualité. Quand les internautes se rendent sur le site Web, des images de bonne qualité sont affichées, garantissant ainsi une image positive de l’entreprise.

De plus, les images sont ultralégères, permettant ainsi d’optimiser au maximum la page Internet. En effet, les images vectorielles sont en moyenne 600 fois plus légères qu’un fichier PNG, JPEG ou GIF et du coup se chargent là encore en moyenne 10 fois plus vite. Pour le bon fonctionnement d’un site, il est plus que fondamental que celui-ci soit rapide, c’est donc le cas avec ces images animées, et ce, même plusieurs créations animées sont exposées sur la page.

Exemple d’animation pour du marketing social !

Quand l’internaute se rend sur une page web, il aime en général voir du contenu impactant. L’œil humain est plus rapidement attiré par les visuels que par le texte, car celui-ci assimile mieux les images. Les animations Lottie sont animées, ce qui attire la curiosité et donnera l’envie de connaître plus l’entreprise.

En outre, les animations sont compatibles avec plusieurs systèmes tels qu’iOS et Android évoqués plus haut, mais aussi avec React Native, un framework d’applications open source Facebook.

Enfin, Lottie est SEO-friendly notamment en raison de son chargement ultra rapide, mais aussi de sa responsivité. De nos jours, les sites se doivent d’être responsives (c’est le fait que le contenu affiché s’adapte parfaitement au device utilisé) quand on sait que près de 75 % de la population française utilise un mobile pour surfer sur Internet !

Quand on pense référencement naturel, il faut penser aussi expérience utilisateur (UX) ! D’ailleurs, nous avons déjà abordé l’importance de l’UX Design dans la conception d’un site Internet lors d’une précédente news, pour en savoir plus, rendez-vous ici !

Alors Lottie, un véritable allié pour votre référencement naturel ?

Les images Lottie favorisent une expérience utilisateur positive, car les internautes ne sont pas dérangés par des chargements longs, des images de qualité médiocre ou encore un visuel qui ne se charge pas lors de leur navigation. Il faut savoir que pour Google, l’UX est important et est au cœur des algorithmes du moteur de recherche afin garantir une meilleure visibilité aux sites web qui pensent UX.

Enfin il ne faut pas oublier le point le plus essentiel quand on intègre des animations vectorielles animées Lottie dans un site web : tout de suite, la vie s’installe, c’est tellement agréable de parcourir des pages plus vivantes !


Vous souhaitez insérer des animations Lottie sur votre site Internet ou sur vos publications à destination des réseaux sociaux ? Pensez à Younicom, nous sommes spécialisés en format vectoriel Lottie et passionnés de motion ! Alors pour en savoir plus, contactez-nous nous vous proposerons des formats d’animations uniques.

Younicom décrypte l'actualité digitale

À propos des auteurs

L'équipe Younicom décrypte pour vous toute l'actualité du digital ! Passionné(e)s de nouvelles technologies, nous aimons transmettre notre amour du web au travers d'articles que nous espérons agréables à parcourir !