Ajouter des Effets d'Accélération avec GreenSock

Découvrez comment utiliser les classes GreenSock pour ajouter des effets d'accélération à vos animations dans Edge Animate.

Détails de la leçon

Description de la leçon

Dans cette leçon, nous explorons l'utilisation des classes GreenSock pour ajouter des effets d'accélération à vos animations. Nous commencerons par intégrer les classes Easing permettant de gérer divers effets, tels que les effets de rebond, élastique et linéaire. Ces effets peuvent être ajoutés à n'importe quelle étape de l'animation sans impact sur l'ordre des propriétés. Vous apprendrez comment spécifier le type et l'emplacement de l'accélération grâce aux valeurs Ease, Back, Bounce, etc.

Nous démontrerons également comment tester ces effets dans Edge Animate en utilisant la fenêtre de scénario et les comparerons avec les effets natifs. Enfin, nous publierons une animation avec l’effet Back Ease Out, illustrant le petit rebond à la fin de l'animation, suivi de la comparaison avec d'autres effets comme Bounce et Elastic pour mieux en saisir les nuances.

Objectifs de cette leçon

Les objectifs de cette vidéo sont d'apprendre à :
- Intégrer les classes GreenSock dans Edge Animate.
- Utiliser les différents types d'accélération pour vos animations.
- Tester et comparer les effets d'accélération pour choisir le plus approprié.

Prérequis pour cette leçon

Pour suivre cette vidéo, vous devez avoir une connaissance de base de Edge Animate et des concepts d'animation web.

Métiers concernés

Ces concepts sont particulièrement utiles pour les métiers de développeur front-end, graphiste et animateur numérique.

Alternatives et ressources

Comme alternatives, vous pouvez utiliser des outils comme Adobe Animate ou des bibliothèques d'animations JavaScript telles que Anime.js ou Velocity.js.

Questions & Réponses

Elle permet de gérer divers effets d'accélération pour les animations, tels que les effets de rebond, élastique et linéaire.
En utilisant les valeurs Ease suivies de deux points, puis en indiquant le type d'accélération désiré (Back, Bounce, etc.) et la position (In, Out, InOut).
L'effet Bounce rebondit sans dépasser la valeur de destination, tandis que l'effet Elastic dépasse la valeur de destination avant de revenir en arrière.