CATALOGUE Design et Infographie Formation Photoshop Apprendre Photoshop CC pour le Web - Photoshop orienté Web et mobile

Intégration d'images et d'animations avec Edge Animate et Dreamweaver

Retour à la formation
Chapitre 15 Leçon 4
Précédent
Suivant

Apprenez à gérer automatiquement les images dans une page HTML en utilisant Edge Animate et Dreamweaver.

Détails de la leçon

Description de la leçon

Dans cette leçon, nous explorons comment utiliser Edge Animate en conjonction avec Dreamweaver pour gérer des images automatiquement dans un projet HTML. La vidéo guide sur la manière de créer un dossier images contenant les documents Photoshop et les assets générés par Générator, permettant ainsi de synchroniser les modifications d'images dans le projet Edge Animate.

Vous apprendrez à adapter le chemin des images dans Dreamweaver, à ouvrir et animer une page HTML dans Edge Animate et à effectuer des modifications en temps réel dans Photoshop, lesquelles sont instantanément mises à jour dans l'animation Animate. Cette méthode permet de simplifier la gestion des ressources graphiques et d'automatiser le processus de mise à jour des animations.

En conclusion, cette leçon propose une vue d'ensemble des fichiers générés par Edge Animate, y compris les fichiers JavaScript nécessaires et l'intégration de la bibliothèque jQuery, assurant une transition fluide de l'animation dans la page HTML.

Objectifs de cette leçon

Les objectifs de cette vidéo sont de :

  • Comprendre comment gérer automatiquement les images dans des projets HTML.
  • Savoir utiliser Edge Animate pour créer des animations à partir de gabarits HTML existants.
  • Apprendre à synchroniser les modifications d'images en temps réel grâce à Photoshop et Générator.

Prérequis pour cette leçon

Pour suivre cette vidéo, il est nécessaire d'avoir des connaissances de base en HTML, CSS, JavaScript ainsi que des notions de design graphique avec Photoshop.

Métiers concernés

Les compétences développées dans cette leçon sont particulièrement utiles pour les métiers de développeur web, designer graphique, intégrateur web, et animateur numérique.

Alternatives et ressources

En alternatives à Edge Animate, vous pouvez utiliser des logiciels comme Adobe Animate, Tumult Hype ou des bibliothèques JavaScript comme GreenSock Animation Platform (GSAP).

Questions & Réponses

Dreamweaver est utilisé pour modifier le chemin des images et gérer le projet HTML avant de l'importer dans Edge Animate.
Edge Animate identifie les images mises à jour grâce à Photoshop et Générator, permettant ainsi une intégration instantanée dans l'animation.
Edge Animate génère des fichiers JavaScript nécessaires pour structurer le document et la bibliothèque jQuery utilisée par le moteur d'Animate.