Informatique

Concevoir et réaliser des animations interactives en utilisant les nouveaux standards HTML5.
Être visible sur toutes les plateformes : desktop, smartphones et tablettes.

Introduction

• Rôle des langages HTML5, CSS3, JavaScript, SVG
• Comprendre la structure HTML5 avec Edge Animate

Prise en main du logiciel

• Interface et environnement de travail
• Les outils et le texte
• Paramétrage d'un nouveau document
• Créer, enregistrer et utiliser des gabarits
• Gérer le temps et l'espace
• Transition et images-clés
• •Utilisation des symboles

Optimisation des médias

• Formats, résolutions, préparation des fichiers

Mise en place

• Importer des images
• Définir une police Web (Typekit et Google Web Fonts)
• Affecter une balise HTML5 à un élément

Animation

• Gérer les transitions, les fondus, les masques, les accélérations, les filtres
• Ajouter une ombre portée
• Activer le verrouillage
• Transformation : échelle, rotation, inclinaison, déformation et déplacement
• Gestion des effets et des dégradés
• Créer des trajectoires de mouvement
• Animer le contenu d'une page HTML existante
• Ajouter un préchargement prédéfini et personnalisé
• Créer un bouton animé

Interactivité

• Organiser son code
• Ajouter du code sur le scénario et sur les objets
• Ajouter des actions temporelles
• Définir des événements à un élément et à la Scène
• Déclencher et arrêter une animation
• Afficher et masquer des éléments
• Travailler avec des étiquettes
• Cibler des symboles imbriqués
• Obtenir une animation en boucle
• Déclencher la tête de lecture en sens inverse
• Ajouter du code HTML et des règles CSS

Responsive Web Design

• Comprendre le mécanisme d'une mise en pages fluide
• Créer un diaporama extensible

Son, vidéo et plan

• Intégrer du son en HTML5
• Intégrer une vidéo via les services de diffusion
• Intégrer et afficher un plan d'accès Google Maps

Publication

• Intégrer une animation au sein d'une page HTML existante
• Définir une scène de niveau inférieur
• Publier pour différents supports
• Installer le widget dans le Dashboard
• Vérifier la publication sur toutes les plates-formes