Guide de l'Animation avec Animate CC et Create.js

Découvrez comment créer un twin pour animer un objet dans Animate CC en utilisant Create.js.

Détails de la leçon

Description de la leçon

Dans cette leçon, nous abordons la création d'une animation dans Animate CC en utilisant la classe twin de Create.js. Nous verrons comment mémoriser le scénario principal dans une variable pour y accéder dans nos fonctions, cibler un élément sur la scène, et définir une animation pour cet élément. Nous discuterons également des propriétés de l'animation, y compris la position, la temporisation, c'est-à-dire la vitesse du mouvement, ainsi que l'accélération utilisant la classe Create.js Easing. Enfin, nous effectuerons une vérification pour nous assurer que toutes les instructions fonctionnent correctement et que la classe twin est correctement appelée pour l'élément sélectionné. Cette leçon est essentielle pour ceux qui souhaitent approfondir leurs compétences en animation dans Animate CC en utilisant des bibliothèques JavaScript modernes.

Objectifs de cette leçon

Les objectifs de cette vidéo sont :
- Apprendre à créer et manipuler des twins pour animer des objets
- Comprendre l'importance de la mémorisation du scénario principal pour les interactions
- Maîtriser les propriétés d'animation comme la position, la temporisation et l'accélération dans Create.js

Prérequis pour cette leçon

Pour suivre cette vidéo, il est recommandé d'avoir des connaissances de base en :
- Utilisation de Animate CC
- Syntaxe JavaScript et manipulation du DOM
- Notions élémentaires de la bibliothèque Create.js

Métiers concernés

Les compétences abordées dans cette leçon peuvent être utiles pour plusieurs métiers, notamment :
- Développeur front-end spécialisé en animations web
- Designer interactif pour la création d'expériences utilisateur engageantes
- Animateur numérique travaillant sur des projets web et multimédias

Alternatives et ressources

Comme alternatives à Animate CC et Create.js, vous pouvez explorer :
- Adobe After Effects pour des animations plus complexes
- GreenSock Animation Platform (GSAP) pour des animations JavaScript avancées
- Anime.js comme autre bibliothèque JavaScript pour les animations web

Questions & Réponses

Il est crucial de mémoriser le scénario principal dans une variable pour pouvoir y accéder facilement depuis les différentes fonctions de script. Cela permet d'optimiser la gestion des animations et des interactions sur la scène.
La classe twin dans Create.js est utilisée pour animer des propriétés d'objets graphiques. Elle permet de définir des mouvements, des transitions et des interpolations de manière fluide et contrôlable.
Pour définir l'accélération d'un mouvement dans Create.js, on utilise la propriété easing de la classe twin. Il existe plusieurs types d'accélérations comme 'quad in', 'quad out', et 'quad in out' qui permettent de contrôler la vitesse de l'animation au début, à la fin, ou tout au long du déroulement.