M2i Formation

Animate CC - Animations publicitaires HTML 5

Par M2i Formation

Objectifs

  • Concevoir et réaliser des publicités au format HTML
  • Utiliser des fichiers Photoshop et Illustrator pour améliorer le workflow
  • Animer textes, images bitmaps et vectorielles
  • Intégrer des médias riches
  • Exporter et optimiser les animations dans le respect des normes de l'IAB (Interactive Advertising Bureau)
  • Publier les animations en HTML 5 dans des pages Web.

Programme

Rappel sur la publicité en ligne

Les normes IAB (Interactive Advertising Bureau)

Les normes Google (DoubleClick)

Types et formats de display

  • Standard
  • Standard +
  • Rich media
  • Rising Stars

Les frameworks JavaScript

  • CreateJS
  • Greensock
  • WebGL
  • jQuery
  • Edge Animate JSAPI...

Recommandations

  • ClickTags
  • Tags d'emplacement
  • Guidelines et bonnes pratiques

Plateformes

Création et publication d'un document HTML 5 Canvas

  • Création d'un document HTML 5 avec l'API Canvas
  • Utilisation des fragments de code JavaScript
  • Migration de contenu existant vers HTML 5 Canvas

Espace de travail et workflow

Flux de travail et espace de travail Animate

  • Flux de travail Animate
  • L'espace de travail : fenêtres et panneaux
  • Import des fichiers Illustrator et Photoshop

Utilisation du panneau Scène et Outils

  • Utilisation de la scène, mise à l'échelle, rotation de la scène
  • Panneau Outils et menus contextuels
  • Pinceaux vectoriels
  • Nanciers balisés

Transformation et combinaison d'objets graphiques

  • Transformation des objets
  • Combinaison d'objets

Utilisation des occurrences de symboles

  • Création de symboles et d'occurrences
  • Propriétés et permutation des occurrences
  • Changement du type d'une occurrence

Utilisation de plusieurs scénarios

  • Clips imbriqués et hiérarchie parent / enfant

Animation et interactivité

Animations interpolées classiques

  • Création et modification d'images-clés
  • Création d'un calque de guide d'animation
  • Guide d'animation basé sur
    • La largeur de trait variable
    • La couleur du trait
  • Accélération / décélération personnalisée

Animation d'interpolation de mouvement

  • Application de présélections de mouvement
  • Création d'une animation interpolée
  • Modification de la trajectoire de mouvement d'une animation interpolée
  • Modification des plages d'interpolation d'une animation dans le scénario

Modification des interpolations avec l'éditeur de mouvement

  • Courbes de propriétés, points d'ancrage et points de contrôle
  • Application des accélérations présélectionnées et personnalisées
  • Contrôle de l'affichage de l'éditeur de mouvement

Interpolation de forme

  • Création d'une interpolation de forme
  • Contrôle des modifications de formes avec des repères de formes
  • Interpolation de forme des traits à l'aide de l'épaisseur variable

Animation de l'outil de segment

  • La cinématique inverse
  • Ajout de segments à des symboles ou à des formes
  • Modification des objets et des squelettes IK
  • Contrainte de mouvement et élasticité à des segments

Caméra

  • Principe de la multiplane
  • Réglage des profondeurs de calques
  • Mouvements de caméra
  • Zoom, rotation et panoramique

Multimédia et vidéo

Importation d'images

  • Matricielles : GIF, JPEG, PNG
  • Vectorielle : SVG

Exportation de fichiers SVG

  • Processus d'exportation SVG dans Animate CC
  • Exportation d'illustrations au format SVG
  • Echange des fichiers SVG avec Adobe Illustrator

Utilisation de sons dans Animate CC

  • Formats audio pris en charge
  • Ajout de sons à un bouton
  • Synchronisation d'un son avec une animation

Ajout de vidéo à Animate

  • Formats vidéo pour le Web
  • Le composant vidéo
  • Intégration d'un fichier vidéo

Exportation et publication

Exportation de graphiques

  • GIF animé, séquence GIF et image GIF
  • Création d'une feuille Sprite

Publication de documents Animate

  • Paramétrage pour la publication d'un document HTML 5 Canvas
  • Création de modèles HTML 5 Canvas personnalisés et annexion aux profils de publication
  • Définition des paramètres de publication pour les fichiers SVG

Pédagogie

L'évaluation des acquis se fait :

  • En cours de formation, par des productions
  • Et, en fin de formation, par un questionnaire d'auto-évaluation ou une certification (M2i ou éditeur)

Partager cette formationTélécharger au format pdf Ajouter à mes favoris

Formations de la même catégories (5)

Ziggourat
Adobe AnimatePar Ziggourat

Cette formation vous permet de créer des animations en utilisant les nouveaux standard HTML5.

Arkesys
Adobe Edge Animate - Créez des animations Web interactivePar Arkesys

A l’issue de cette formation, l’apprenant sera capable de :

  • Créer des pages HTLM responsive ;
  • Créer des navigations interactives ;
  • Créer des animations interactives ;
  • Créer des animations spritesheet ou lipthink ;
  • Intégrer de la vidéo avec balise HTML 5.
M2i Formation
Animate CC - Animations publicitaires HTML 5Par M2i Formation
  • Concevoir et réaliser des publicités au format HTML
  • Utiliser des fichiers Photoshop et Illustrator pour améliorer le workflow
  • Animer textes, images bitmaps et vectorielles
  • Intégrer des médias riches
  • Exporter et optimiser les animations dans le respect des normes de l'IAB (Interactive Advertising Bureau)
  • Publier les animations en HTML 5 dans des pages Web.
Ziggourat
Adobe Animate InteractionPar Ziggourat

Cette formation vous permet de créer des animations en utilisant les nouveaux standard HTML5. Programmer de l'interactivité grâce au langage JavaScript.