--- title: Cours GIF animé description: Réaliser les Gifs lang: FR tags: tutorials,web,gif year: 2022 --- # GIF animé ### Tutoriel ### Hervé Graumann ##### [Contact email](mailto:herve.graumann@hesge.ch) --- ## Gif Art **Tracks ARTE** *Entre Paris, New-York et Londres, lo-tech et repeti-life, ils font bouger les murs et secouent la mode !* {%youtube JOWrgAYxzWA %} [Voici le programme en pdf](https://drive.switch.ch/index.php/s/PTJjyEFwRkhec5w) --- ## Liens, Références ![](https://i.imgur.com/TvYyMeq.gif) [A Gif novel Zac’s haunted house](http://www.kiddiepunk.com/zacshauntedhouse/) --- ![](https://i.imgur.com/NoPOU8u.gif) [Eadweard Muybridge](https://fr.m.wikipedia.org/wiki/Eadweard_Muybridge) chronophotographie Gif art wikipedia https://en.wikipedia.org/wiki/GIF_art ...et le site populaire [giphy](https://giphy.com) --- ![](https://i.imgur.com/LvqUc3E.gif) *Un cinémagraphe est une photographie animée d'un léger mouvement répétitif. https://www.olybop.fr/40-cinemagraph-inspiration/* [Autres exemples](https://www.laboiteverte.fr/photographies-animees-en-gif/) --- ## Pratique Pour réaliser les Gifs nous avons utilisé Photoshop, mais il existe de nombreux logiciels et applications qui peuvent servir à en concevoir. Vous avez un tutoriel sur le site Adobe qui vous indique comment faire ici: https://helpx.adobe.com/ch_fr/photoshop/how-to/make-animated-gif.html Également ici sur la chaîne [YouTube Adobe France](https://www.youtube.com/watch?v=v8lE7Ine2nE) **Résumé pour créer un Gif sur Adobe Photoshop** Créer un nouveau document. Les gifs sont en principe diffusés sur un écran, dès lors privilégiez les mesures en pixels. Définissez une dimension de scène de 800 x 600 pixels La résolution sera la même que celle de l’écran soit 72 dpi Une fois ce nouveau document affiché, allez dans le menu « Fenêtre » et cliquez sur le menu « Montage » Une fenêtre s’affiche au bas de l’écran avec 2 possibilités offertes sur le bouton central: - Créer une animation d’image - Créer un montage vidéo ![](https://i.imgur.com/sxP513n.png) Sélectionner « Créer une animation d’image » et cliquez sur le bouton ![](https://i.imgur.com/mUTfKpq.png) La fenêtre « Créer une animation d’image » apparaît ![](https://i.imgur.com/ipU4Uc9.png) Pour créer de nouveaux photogrammes cliquez sur le bouton « + » en bas de la fenêtre. Vous pouvez dessiner sur un ou plusieurs calques et animer un calque en le faisant bouger dans la vignette désirée ou laisser visible ou invisible un calque en cliquant sur le bouton en forme d’œil dans la fenêtre des calques dans la vignette désirée. En bas de chaque rectangle représentant une image de l’animation vous pouvez régler individuellement le temps d’affichage de l’image concernée. Vous pouvez réarranger l’ordre des images en les déplaçant. Les effacer en cliquant sur l’icône corbeille. Appuyez sur le bouton en forme de flèche ou la barre d’espace du clavier pour lancer l’animation. --- ## Exportation du Gif Accédez au menu « Fichier », « Exportation », « Enregistrer pour le Web » ![](https://i.imgur.com/5jmydyU.png) La fenêtre suivante apparaît: ![](https://i.imgur.com/ORqvKJ5.png) Avant tout, sélectionnez le format Gif dans le menu déroulant. Dans cette fenêtre on peut également modifier le nombre de couleurs, le type de tramage, les dimensions. Cliquer sur Enregistrer et glissez le fichier Gif que vous avez enregistré dans une fenêtre de votre navigateur. Bon travail! --- [Travaux étudiants mars 2021](https://hackmd.io/@poolnumerique/BkHZao-l_)