Objectifs de la formation Greensock GSAP
Cette formation Greensock vous apprendra à utiliser la librairie Greensock GSAP pour étendre les propriétés d’animation et d’interactivité du logiciel Hype Pro. Hype pro est utilisé pour la création d’animation vectorielles ou typographiques, des glisser-déposer avancés, du flat 3D.
Concrètement, à l’issue de ce cours, vous aurez acquis les compétences et connaissances nécessaires pour:
- Animer les objets vectoriels SVG
- Réaliser des glisser-déposer avancés
- Spatialiser l’affichage des éléments de la scène.
À qui s’adresse cette formation ?
Public :
Ce stage Greensock s’adresse aux utilisateurs de Hype Pro.
Prérequis :
Etre familier de l’environnement de Hype Pro et du langage HTML est recommandé pour suivre ce cours.
Contenu du cours Greensock GSAP
Introduction à Greensock
Présentation des options disponibles à travers les librairies Greensock Installer l’extension dans l’environnement de Hype Pro
Configurer un espace 3D via GSAP
Gérer la déformation 3D par défaut
Gérer le positionnement 3D par défaut
Gérer la 3D des éléments imbriqués
Animer les propriétés
Position et rotation 3D
Echelle, torsion, opacité
Gérer le temps
Apprendre à invoquer une action avant, pendant et après la transition
Temporiser la transition à l’aide d’un délai
Animer à partir d’effets
Les filtres
Les trajectoires
Les clips (masques)
Animer les propriétés vectorielles SVG
Animer un tracé vectoriel
Animer une interpolation de formes SVG, importées d’Illustrator
Gérer le glisser-déposer
Organiser les éléments d’un dispositif de glisser-déposer
Gérer le type de déplacement (translation, rotation)
Gérer l’inertie et les limites du déplacement
Gérer les collisions
Animer les caractères typographiques
Gérer l’animation par bloc, ligne ou caractère
Gérer les effets de physique sur le texte animé
Animer l’affichage des caractères (façon panneau d’affichage d’un hall de gare)
Mettre en pratique l’animation à travers différentes études de cas, au choix
Mur d’images flat 3D
Cube animé
Coverflow flat 3D
Palette flottante
Curseurs et effet parallaxe
Dataviz basée sur un graphique vectoriel SVG.
Travaux Pratiques
Cette formation alterne exercices pratiques et théorie pour une meilleure validation des acquis.
Mise à jour : 29 octobre 2026