PLAN DE COURS




35 heures - 5 jours
Objectif
Utiliser des dessins Illustrator dans des animations HTML 5 - Rendre interactives des animations de bases - Utiliser des comportements JavaScript et manipuler des bibliothèques jQuery - Utiliser des Web Fonts dans des animations.
Prérequis
Connaissance du monde du Web. La maitrise de Photoshop et/ou d’Illustrator est un plus. Une connexion internet est requise en ADSL mini 2Mega. L’apprenant doit avoir également le logiciel enseigné installé sur son poste de travail.


Contenu pédagogique
Introduction
Présentation de l’interface d’Edge Animate
  • Présentation et personnalisation d’Edge Animate
  • Pour ceux qui connaissent HTML et CSS
Création de contenu avec Edge Animate
  • Utilisation des outils
  • Importation et manipulation du contenu d’Edge
  • Création et application des filtres CSS
Préparation à l’utilisation de contenu
  • Préparation avec Adobe Photoshop, Illustrator et Fireworks
  • Préparation du contenu avec d’autres outils graphiques
Règle de mise en forme dans Edge Animate
  • Création d’une composition
  • Ajouter et disposer des éléments
Animation des éléments
  • Création d’une animation
  • Mode Image-clé auto [K] et mode transition auto [X]
  • Définition des options d’accélération Combinaison de transformations
  • Travailler avec des animations de « sprite »
  • Animation avec les propriétés de filtres CSS
  • Animation d’éléments sur un chemin
  • Effets audio avec l’animation
Ajuster les animations
  • Déplacer un élément sans modifier ses propriétés
  • Réutilisation des propriétés d’une animation
  • Changer l’élément d’une animation par un autre
  • Définition d’une animation en boucle
  • édition et modification de trajectoire
Les symboles
  • Création de symboles d’animés
  • Contrôle de la lecture de symbole
Les actions
  • Qu’est-ce qu’un déclencheur ?
  • Affectation d’actions à des objets
  • Ciblage par actions
  • Fonctions liées au « toucher » sur tablettes
Création de modèles « Responsive »
  • Regroupement d’éléments en symboles
  • Redimensionnement avec ajustement des objets
  • Préréglages de modèles « responsives »
  • Réglages des propriétés d’une scène « responsive »
Paramètres de publication
  • La publication pour le Web
  • Publication d’un package de déploiement La publication pour les iBooks et OS X
Incorporation d’Edge Animate dans du HTML existant