Un outil qui permet de créer des animations très simplement en utilisant des formes simples. J'ai testé très rapidement, et c'est très bien fait !
Via https://korben.info/trangram-plateforme-creer-animations-graphiques-animes-facilement.html
Un tuto simple qui aborde l'animation d'un SVG simple avec des transitions CSS.
Uploadez un dessin de personnage, ce service utilise l'IA pour l'animer.
Une lib JavaScript pour créer des animations. Son poids est très réduit mais elle semble complète en terme de fonctionnalités. Elle possède en outre des helpers pour Vue et Solid.
Une lib JavaScript qui permet d'animer automatiquement (et avec une seule ligne de code) les changements appliqués à une collection d'éléments (ajout, suppression, tri).
En gros, ça permet de rendre les ajouts ou suppression d'éléments du DOM plus visibles pour vos utilisateurs, sans trop se prendre la tête à gérer l'animation à la main.
Je n'ai pas encore creusé pour voir comment ça fonctionne mais les exemples sont assez convainquant.
Et il existe des directives pour React, Vue et Svelte.
Une autre lib Vue pour effectuer une transition animée d'un composant entre deux pages.
Une lib Vue qui permet de créer des transitions pour un composant entre son affichage dans une page A et son affichage dans une page B. Un peu à la manière de ce que préconise Material Design, pour conserver un maximum de contexte lors d'une navigation.
Un outil pour générer des animations CSS3 via une interface graphique. Il existe aussi une lib JS qui permet de faire la même chose dynamiquement en JS.
100 animations hover en CSS. Histoire de change du classique changement de couleur ou soulignement.
Tout est dans le titre :)
Cet article est très didactique, parfait pour bien comprendre les transitions CSS. Il n'aborde cependant pas les animations CSS à proprement parler.
Une chouette introduction aux animations CSS en utilisant des path SVG.
Une grosse liste de librairies pour gérer les animations CSS.
Une introduction à Animate.css.
Si dans Vue.js vos animations CSS clignotent dans IE 11, pensez à ajouter animation-fill-mode: forwards; sur l'élément auquel l'animation est affecté.
Des animations de menu hamburger absolument délicieuses. Le tout sans Javascript (si on omet le simple onclick dans le HTML). Merci SVG.
Un retour d'expérience sur une migration de React vers Vue.js (et accessoirement de GSAP vers anime.js).
Comment des petites animations permettent d'améliorer l'expérience.
Un outil en ligne pour facilement animer du SVG.