Animate : niveau 1

Définir les caractéristiques d’une animation HTML5

• Utiliser ActionScript 3 ou HTML5 Canvas
• Décrire le rôle de la balise Canvas et des fichiers : .fl a, .HTML, .js
• Distinguer les formats d’images (SVG, JPG, PNG) pour améliorer la qualité
• Acquérir un vocabulaire technique pour se repérer dans l’interface

Quiz de compréhension

Comprendre les contraintes de production

• Comprendre le rôle des symboles : clip, graphique, bouton
• Utiliser des occurrences pour réduire le poids du fi chier
• Structurer son fi chier pour un gain de temps en production
• Tester une animation dans l’environnement Web

Exercice : préparer un gabarit d’animation / Travailler avec des occurrences de symbole

Animer avec les symboles sur les différents scénarios

• Obtenir des rendus saccadés : image par image
• Obtenir une fluidité : interpolation classique, mouvement, forme
• Animer des éléments sur des trajectoires
• Améliorer la fluidité par des courbes d’accélération
• Ajouter des effets de couleur et des filtres
• Palier les contraintes d’affichage des navigateurs
• Dévoiler un élément via un masque animé
• Associer une police pour le Web (Typekit) aux animations
• Importer du son

Exercice : créer des animations pour maîtriser chaque fonctionnalité découverte

Développer une méthode de travail efficace

• Élaborer un storyboard graphique et technique
• Estimer le temps de réalisation
• Préparer les médias figurant dans l’animation
• Modifier rapidement le rythme d’une animation
• Mettre à jour efficacement les éléments : image, texte, vecteur
• Choisir la publication : Web, plasma, digital publishing, bannières
• Décliner les formats publicitaires

Exercice : apporter des modifications (rythme, mise à jour d’éléments) sur des animations conçues pendant la formation

Produire et publier des bannières ou des animations interactives

• Évaluer les contraintes des régies publicitaires : formats et poids des bannières
• Créer des boutons
• Contrôler une animation avec des actions de base en JavaScript
• Affecter un lien URL
• Ajouter la variable clickTAG
• Gérer le nombre de boucles
• Rendre les mentions légales accessibles
• Préparer un GIF ou un JPG de backup
• Régler les paramètres de publication
• Créer un diaporama
• Publier l’animation
• Optimiser le poids du fichier pour la livraison
• Exporter l’animation au format vidéo
• Gérer l’affichage responsive

Exercice : réaliser et publier une série de bannières publicitaires à partir d’un storyboard