Adobe Edge Animate (Html5/Css3) - Niveau 1 (animations HTML5 & CSS3 pour pc, tablettes, smartphones)
Formation
À Marseille
Avez-vous besoin d'un coach de formation?
Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.
Description
-
Typologie
Formation
-
Lieu
Marseille
-
Heures de classe
14h
-
Durée
2 Jours
-
Dates de début
Dates au choix
-
Stages en entreprise
Oui
La formation que vous propose Mandyben vous permettra de maîtriser Adobe Edge pour la conception d’animations qui utilisent les nouveaux standards HTML 5 et CSS3. Vous pourrez réaliser des animations de qualité, complètes et rendant l’expérience utilisateur sur le site web agréable et cohérente. La maîtrise de ces nouveaux standards vous assurera de nouvelles opportunités professionnelles.
Cette formation de 21 heures réparties sur 3 jours vous permettra de connaître Adobe Edge. Vous connaîtrez ses principales fonctionnalités et serez en mesure de créer une animation. Vous la rendrez interactive et gérerez le « responsive design ». Vous serez en mesure d’exporter cette animation au format HTML5 pour ensuite l’intégrer à un site internet. La formation base une grande partie de sa pédagogie sur des exercices pratiques. Cette approche garantit à tous les stagiaires une bonne maîtrise des fonctionnalités du programme.
Les formateurs ont une connaissance accrue du terrain et pourront vous prodiguer de nombreux conseils pratiques pour vous aider à progresser. Cette formation est ouverte à toutes les personnes travaillant dans le secteur du web et souhaitant élargir leurs compétences. Des connaissances des logiciels de bureautique sont requises.
Précisions importantes
CIF: Formation éligible au CIF (Congé individuel de Formation)
DIF: Formation éligible au DIF (Droit individiuel à la Formation)
Les sites et dates disponibles
Lieu
Date de début
Date de début
À propos de cette formation
Connaissance de logiciels bureautiques.
Les Avis
Les matières
- Adobe
- HTML 5
- Adobe Edge
- Création d'une animation HTML 5
- Animation vectorielle
- CSS 3
- Maîtrise de l'interface d'Adobe Edge
- Utilisation de la timeline dans Adobe Edge
- Exportation d'une animation en HTML 5
- Gestion de l'interactivité avec Adobe Edge
- Gestion des évènements dans Adobe Edge
- Responsive Design
- Gestion de la fluidité d'une animation HTML 5
Professeurs
Benoit MARAVAL
Gérant
Le programme
- Les concepts de bases de l’animation vectorielle
- Les plus de HTML5 dans la diffusion de contenus multiplateformes (Iphone, Ipad ...)
- Présentation des logiques d’animation HTML5 (CSS, JavaScript, SVG)
- Format de fichiers, poids de fichiers
- Edge et le HTML5 par rapport à Flash
Les fonctions
- Découverte de l’environnement de travail
- L’espace de travail et le panneau propriétés
- le panneau bibliothèque, actifs, symboles et polices
- Créer un nouveau document (taille, background ...)
- Pré-visualisation d’une animation
- Importer des images et autres médias
- Utiliser les outils de forme et de texte
L’animation
- Utiliser la ligne de temps
- Paramétrer la timeline (zoom, Auto-keyframe, Smooth Transition)
- Animation d’objets avec les images clés et les transitions
- Copier/coller une transition d’un objet à un autre
- Animation avec trajectoires de mouvement
- Animation de masque d’écrêtage (clipping)
- Utilisation de commandes de lecture avec les symboles
- Créer des déplacements d’objets
- Modifier les apparences d’un objet (couleurs, formes ...)
- Animer les éléments d’une page web existante
- Intégrer une animation de preloading (gifs de preloading par défaut / gif personnalisés)
- Exporter une animation en HTML5
- Publier vers indesign
L’interactivité dans Edge
- Le principe de l’interactivité
- Le balisage
- Le JavaScript et jQuery
- La gestion des événements
- Les comportements et boutons
- Insertion de code sur la timeline
- Actions sur les objets
Responsive Design - gérer la fluidité
- Redimensionnement / positionnement élastique d’objets sur la scène
- Propriétés d’alignement et de centrage des images dans un bloc div
- Taille de redimensionnement min et max
- Options de redimensionnement des symboles
- Centrer parfaitement un élement dans la scène
- Centrage global d’une animation EA dans la page html
- Utiliser un motif répété en background
Les options supplémentaires
- Propriété Curseur
- Code sur la time line
- Utiliser les fonctions de réorganisation d’objets
- Modifier l’opacité, les couleurs (contours, fond) d’un objet
- Redimensionner ou déformer un objet
- Utiliser la fonction de rotation ou d’inclinaison d’un objet
Avez-vous besoin d'un coach de formation?
Il vous aidera à comparer différents cours et à trouver la solution la plus abordable.
Adobe Edge Animate (Html5/Css3) - Niveau 1 (animations HTML5 & CSS3 pour pc, tablettes, smartphones)