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.

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-nous

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-nous

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-nous

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-nous

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-nous

Ce cours est exclusivement proposé en intra-entreprise. Pour en connaître le prix et les modalités, contactez-nous.

Contactez-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