Économisez jusqu'à 10 € sur votre première commande en vous abonnant à notre newsletter.

Trucs et Astuces

Chaque semaine, Micro Application vous propose une astuce différente choisie parmi différentes thématiques :

Bureautique, Internet et création de sites, Photo et vidéo, Windows, ...

Une astuce gratuite chaque semaine ?

Envie de découvrir une nouvelle astuce chaque semaine ?





L'astuce : Créez un gif animé


Si vous vous êtes toujours demandé comment ces fabuleuses bannières de publicité qui parsèment le web étaient animées, cette astuce est faite pour vous.
Vous devez disposer de Photoshop et de son logiciel annexe, Image Ready.

1. Préparation des calques

Réfléchissez au mouvement que vous souhaitez créer. Décomposez ce mouvement en plusieurs étapes.
Au besoin, faites sur papier un croquis de chacune des étapes.


 
  • Créez un document .psd, aux dimensions de votre gif animé, en mode couleurs RVB.
  • Créez un calque pour chaque étape du mouvement.
  • Classez les calques par ordre chronologique, et nommez-les bien.
    Ici, on souhaite créer un mouvement de rotation dans le sens des aiguilles d'une montre, pour un rectangle blanc.
    On a nommé les claque "1", "2", "3"... et "fond".
  • 2. Lancement d'Image Ready

    Si, à l'installation de Photoshop, vous avez demandé une installation complète, alors, vous devez disposer d'un logiciel annexe, Image Ready, qui vous permettra de créer des gif animés.
    Si ce n'est pas le cas, reprenez votre CD d'installation et suivez les étapes proposées.

    Lancez le logiciel, via Photoshop, en cliquant sur le bouton le plus en bas de la barre d'outils ou avec le raccourci "ctrl + shift + M".


     

    3. Animation

    Ouvrez la palette flottante "Animation", si elle n'est pas déjà ouverte, par le menu Fenêtre > Animation.


     
  • Créez autant de vignettes que vous avez prévu d'étapes (ici, on en a 8), en cliquant sur le bouton "Reproduit l'image sélectionnée" autant de fois que nécessaire.

  •  
  • Dans l'image 1, faites apparaitre seulement le calque "1" et le fond.
    Dans l'image 2, remplacez-les par le calque "2" et le fond, et ainsi de suite pour les autres images...
  • Modifiez la durée de lecture des images, en maintenant le clic sur la durée qui est inscrite au-dessous, et glissez jusqu'à la durée désirée.
    Pour une animation de type dessin animé et un mouvement fluide, on choisira 0.1 secondes.
    Faites-le pour chaque image.

  •  
  • Cliquez sur le bouton de lecture pour vérifier que l'animation se déroule bien comme vous l'aviez prévu.
  • 4. Optimisez et exportez


     
  • Ouvrez l'onglet "2 vignettes".
    Vous avez l'original à gauche, et la version optimisée à droite.
  • Choisissez les paramètres de compression du gif dans la palette "optimiser".
    Moins votre gif comporte de couleurs, plus léger il sera.
    Ici, on choisit 4 couleurs, en palette Sélective.
  • Utilisez le raccourci clavier "ctrl + shift + alt + S" pour enregistrer une copie optimisée de votre gif.
    Nommez-le, et il est prêt à être intégré dans votre page HTML.

  • Vous pouvez ainsi créer des smileys animés personalisés, des bannières animées à échanger, etc...
     


    Un service offert par

    POUR ALLER PLUS LOIN...

    Retouchez vos Photos !
    Améliorez vos clichés et créez des images d’exception !

    Plus d'infos

    19,95 €
    Acheter en téléchargement
    Roman Photo Créateur
    Créez, animez et imprimez en quelques clics vos propres romans-photos !

    Plus d'infos

    34,95 €
    Acheter en boîte
    PhotoPlus X2 Digital Studio
    Retouche, classement et partage

    Plus d'infos

    79,95 €
    Acheter en boîte
    Acheter en téléchargement
     

    Les autres astuces Retouche photo




    Mon projet Maison