M2i Formation

Web et Mobile Design - Animation Web

Edge Animate - Découvrir l'animation HTML 5

Présentiel

3 jours (21 heures) - EDGE

(33)
Accueil  ›  Formations Multimédia  ›  Web et Mobile Design  ›  Animation Web  ›  Edge Animate - Découvrir l'animation HTML 5

Objectifs pédagogiques

  • Utiliser des dessins Illustrator dans des animations HTML 5
  • Créer des animations pour des pages Web
  • Rendre interactives des animations de base
  • Utiliser des comportements JavaScript et manipuler des bibliothèques jQuery
  • Utiliser des Web Fonts dans des animations.

Niveau requis

Avoir une bonne connaissance de l'environnement informatique (pratique courante d'OS X ou de Windows). La pratique courante d'un logiciel de dessin vectoriel et bitmap est souhaitable.

Public concerné

Webmasters, chefs de projets, programmeurs, développeurs et créateurs de sites Internet.

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Suivez, vous aussi ce cours à distance. Consultez-nous pour vérifier sa disponibilité.

Consultez-nous

Introduction à Adobe Edge

  • Format d'export
  • Le principe de l'animation
  • Installation et démarrage
  • Le concept de base
  • L'interface
  • L'espace de travail
  • Les menus
  • Le scénario

Premiers pas dans Adobe Edge

  • Créer un document Edge
  • Définir une police Web (Google Web Fonts)
  • Sauvegarder un document Edge
  • Analyse des fichiers créés
  • Créer des formes
  • Créer des éléments texte
  • Propriétés des éléments

L'import d'images

  • Les formats du Web (bitmap)
  • Le format vectoriel : SVG
  • Sprite sheets
  • Import depuis Flash et Illustrator

Animer une page Web simple dans Edge

  • Animation basique
  • Utilisation de la timeline
  • Les clés d'animation
  • Animation complexe
  • Transitions et clés d'animation
  • Marques et pop
  • Gérer le temps et le rythme
  • Symboles et animations imbriquées

Interactivité et code dans Edge

  • Le principe de l'interactivité
  • Déclencheurs, évènements et actions
  • Les syntaxes possibles
  • JavaScript
  • JQuery
  • Animate
  • Balises et organisation du code
  • Les comportements
  • Code sur la timeline
  • Actions sur les objets
  • Création de comportements personnalisés (snippets)
  • La notion de boutons

Aller plus loin avec Edge

  • Intégration Edge / Muse et Dreamweaver

Intégration de médias

  • Intégrer du son en HTML 5 via Edge Code
  • Intégrer une vidéo via les services de diffusion
  • Encodage d'une vidéo pour HTML 5

Utilisation des fontes Web dans Edge

  • Edge Web Fonts