CATALOGUE Code & Data Formation Animate CC Maîtrisez la programmation dans Animate CC - Ateliers créatif avec Create JS

Tutoriel d'animation avec GreenSock

Retour à la formation
Chapitre 8 Leçon 6
Précédent
Suivant

Dans ce tutoriel, nous découvrons comment utiliser GreenSock et l'instruction TwinMax pour animer un élément sur une scène. La leçon se concentre sur les différentes propriétés d'animation et leur syntaxe particulière.

Détails de la leçon

Description de la leçon

Dans cette vidéo, nous explorons les fonctionnalités de GreenSock, plus précisément l'instruction TwinMax. L'objectif est d'animer une boule sur une scène avec des paramètres prédéfinis tels que la durée, la propriété de mouvement et l'accélération. Nous abordons également l'importance de la syntaxe propre à chaque framework d'animation.

Nous commençons par définir une durée de 0,5 seconde pour le mouvement, puis précisons la propriété X pour déplacer l'élément de 500 pixels. Enfin, nous ajoutons une accélération isInOut pour rendre l'animation plus fluide. Une fois les éléments configurés, nous vérifions que tout fonctionne correctement.

Objectifs de cette leçon

Les objectifs de cette vidéo sont de :

  • Comprendre l'utilisation de l'instruction TwinMax de GreenSock.
  • Apprendre à configurer une animation avec une durée et une accélération spécifiques.
  • Maîtriser la syntaxe propre à GreenSock pour animer des éléments sur une scène.

Prérequis pour cette leçon

Pour suivre cette vidéo, vous devez avoir une connaissance de base en :

  • JavaScript
  • HTML/CSS
  • Animation web

Métiers concernés

Les connaissances de cette vidéo sont particulièrement utiles pour les métiers suivants :

  • Développeur front-end
  • Designer web
  • Animateur numérique

Alternatives et ressources

Des alternatives à GreenSock pour créer des animations incluent :

  • Anime.js
  • Velocity.js
  • CSS3 Animations

Questions & Réponses

La propriété X est animée pour déplacer l'élément de 500 pixels sur la scène.
La durée de l'animation est de 0,5 seconde.
L'accélération isInOut est utilisée pour rendre l'animation plus fluide.