Description

Ce cours vous permettra de concevoir des contenus interactifs pour tous types de terminaux mobiles compatibles avec les systèmes iOS et Android, ainsi que pour tous navigateurs d'ordinateurs modernes. Vous mettrez en oeuvre des fonctionnalités HTML5, JavaScript et CSS3 sans avoir à manipuler de code.

À qui s'adresse cette formation ?

Webmasters, graphistes, maquettistes ou toute personne en charge de la communication de sites Internet.

Les objectifs de la formation

Personnaliser et enregistrer son espace de travail
Ajouter des animations à une page HTML existante
Créer une mise en page adaptative
Utiliser la timeline pour créer des animations
Gérer la typographie au sein des animations

Programme de la formation

• Présentation de l'interface
  • Installation et démarrage du logiciel.
  • Créer un espace de travail.
  • La barre d'outils, le panneau Éléments et la scène.
  • Le panneau Propriétés.
  • Les panneaux Bibliothèque, Actifs, Symboles et Polices.
  • Les panneaux Scénario et Code.
  • La timeline : aperçu général.
  • Etude de cas Personnaliser et enregistrer son espace de travail.
• Créer et sauvegarder un document Edge
  • Les outils Rectangle, Rectangle Arrondi et Ellipse.
  • L'outil Texte.
  • Placer une image.
  • Créer du contenu pour Edge Animate avec Photoshop, Illustrator et FW.
  • Formats et poids d'image pour Internet.
  • Prévisualiser un document.
  • Travaux pratiques Créer trois versions de sites, petit, moyen et grand.
• Modifier, enrichir et réutiliser
  • Manipuler des objets sur la scène.
  • Réorganisation, alignement et distribution.
  • Fonction de hiérarchisation, de groupes d'objets et de débordement.
  • Modifier l'opacité et les couleurs d'un objet.
  • Exporter/Importer des symboles .
  • ansym.
  • Travaux pratiques Ajouter une animation à un HTML existant.
• Typographie et mise en page proportionnelle
  • Ajouter des Webfonts à une composition animée.
  • Polices en ligne libres d'accès.
  • Polices téléchargeables, locales et CSS.
  • Polices par abonnement.
  • Options de redimensionnement.
  • Guides en pourcentages et en pixels.
  • Mise à l'échelle des symboles.
  • Travaux pratiques Créer une mise en page adaptative.
• Animer
  • Utiliser la timeline (règles de base, player).
  • Créer une animation (déplacement, apparence, rythme, accélération).
  • Transitions et clés d'animation.
  • Copier/coller des transitions.
  • Marque de verrouillage et pop.
  • Utiliser la fonction de rotation ou d'inclinaison d'un objet.
  • Affichage de symboles, d'étiquettes, et insertion du texte en mouvement.
  • Travaux pratiques Réaliser une animation.
• Interactivité
  • Ajouter de l'interactivité.
  • Code sur la timeline.
  • Actions sur les objets.
  • Propriété Curseur.
  • Exercice: Exercice: sur l'interactivité.
• Exporter / diffuser
  • Présentation de l'anatomie d'un projet Edge Animate.
  • Exporter une animation.
  • Scène de niveau inférieur (IE 6, 7 et 8).
  • PreLoader, Affiche.
  • Publier sur le web.
  • Publier vers InDesign et Digital Publishing Suite ou iBooks Author.
  • Travaux pratiques Exporter son projet.