Grâce au boom technologique que nous vivons en ce moment, le monde de la photographie professionnelle n’a jamais été aussi satisfait. Avec les retouches photographiques, le vecteur et la création graphique, Photoshop n’a jamais été aussi efficace. Mettre à jour la plus fine technologie de pointe, créer des bannières animées avec cet outil numérique est juste satisfaisant.


Bien qu’il n’y ait pas de règle stricte définis dans la conception de bannières web animées, un concepteur digne de ce nom peut le faire avec aisance. Pour les moins expert d’entre nous, il faut savoir que recourir à l’aide de Photoshop pour effectuer cette tâche est plus simple et plus pratique surtout avec la dernière version disponible.


Nous allons vous montrer les étapes simples et sans complication pour réaliser votre bannière publicitaire avec Photoshop en bonne et due forme.

Les étapes de création d’une bannière animée avec Photoshop

Les prochaines marches à suivre vont vous montrer comment créer et configurer une bannière animée assez simple grâce à Photoshop.


La configuration du document

Cette étape consiste à lancer l’application Photoshop pour accéder à File & GT. Ouvrir un nouveau dossier et sélectionner classement, ensuite choisissez personnaliser pour entrer manuellement les dimensions de vos pixels.

Les éléments graphiques

Choisir où placer les éléments de conception essentiels et les coller de manière à ce qu’ils s’infiltrent facilement dans les limites du document. Une fois collé dans un graphique de flèche, utiliser l’outil « type définir votre message » pour la première diapositive et la coller sur toutes les images à utiliser avant de renommer vos calques de manière appropriée.

Les diapositives secondaires

Il suffit simplement de copier la couche type et de taper la prochaine étape du message. Ensuite, fusionner autant de couches possible ce qui au fur et à mesure que l’arrière-plan et l’image de couverture restent statiques, ne nous laissera que quatre couches. C’est-à-dire l’arrière-plan, les couches type et la couche de flèches.

Créer l’animation

D’abord, cliquer sur l’onglet « Timeline » en bas de la fenêtre et appuyer sur la flèche du milieu pour accéder à « Créer une animation de cadre », puis cliquer. C’est-à-dire cliquer sur l’arrière-plan, les couches type et la couche de flèches. Ensuite, poser un deuxième retard sur le menu déroulant de l’animation et appuyer sur « Dupliquer cadre  » dans la chronologie. Et enfin, désactiver le premier message pour allumer le second et répéter pour toutes les couches jusqu’à la couche de flèche.

Enregistrement web

Après avoir réglé l’heure à 0,5 seconde et tourner la flèche pour répéter la démarche, il faudrait éteindre le panneau Calques pour qu’il apparaisse comme s’il clignotait. Ensuite, vous pouvez aller sur « enregistrer sur le web » dans le menu déroulant. Réduire la qualité du fichier pour obtenir sa taille en bas et il ne reste plus qu’à économiser l’animation et la faire glisser dans un navigateur web pour la tester.


Même s’il est conseillé d’utiliser la dernière version disponible de l’application. Nous vous avons démontré à l’aide de cet article la manière la plus simple de créer votre bannière animée avec Photoshop. Mais le plus important est de faire appel à une agence professionnelle pour créer vos bannières animées comme My Flow