Donnez du dynamisme à vos page web en y insérant des gifs animés.
Graphisme
Recherche :   
Actualité Système Salon Concours Outils Programmation Devparadise Programmation HTML .Net JavaScript VBScript ASP PHP Visual Basic Perl Java Active X SQL XML WAP Delphi Graphisme Flash Web Design Promotion Référencement Publicité Valeur de votre site Outils Systèmes Windows Unix Linux Benchmark Hardware Réseaux locaux Droit Sécurité
Gif animé sous Image Ready
  Auteur : Arnaud DESFONTAINES

Donnez du dynamisme à vos page web en y insérant des gifs animés.

Publicité 
Marche à suivre :

- Dans Photoshop, préparez les différentes images qui composeront votre animation sur des calques séparés.
- Dans la palette des calques, masquez les éléments qui n'apparaîtront pas sur la première image.

- Sauvegardez, puis tout en bas de la barre d'outil de Photoshop, cliquez sur l'icône suivante ce qui vous permettra de passez à Image Ready.

- Affichez la palette d'animation, dans laquelle apparaît la première image.
- Sur cette même palette, vous devez ajouter la seconde image, pour cela, il vous faut cliquez sur l'icône de duplication (comme ci-dessous).

- Sur cette seconde image, dans la palette des calques, masquez le calque nommé "etoile 1" puis affichez le calque "etoile 2".

- Ajoutez maintenant une troisième image en cliquant sur l'icône de duplication dans la palette animation.
- Sur cette troisième image, dans la palette des calques, masquez le calque nommé "etoile 2" puis affichez le calque "etoile 3".

- Ajoutez une quatrième image en cliquant sur l'icône de duplication dans la palette animation.
- Dans cette quatrième image, masquez le calque nommé "etoile 3" puis affichez le calque "etoile 4".

- Voici ce que vous devez obtenir dans la palette animation (voir ci-dessous).

- Il ne vous reste plus qu'a choisir le temps de diffusion de chaque image. (dans notre exemple, nous allons attribuer le même temps pour les quatre images). Pour cela, sélectionnez les toutes en cliquant dessus et en maintenant la touche (Maj) enfoncé.
- Une fois les quatre images sélectionnées, effectuez un clic droit sur l'une d'entre elle. Choisissez le temps qui vous convient (pour notre exemple, 0.1)

- Pour notre exemple, nous souhaitons que cette animation tourne en boucle. Dans la palette animation ci-dessus, il nous faudra sélectionner l'option "toujours".

- Voilà ! il vous faut maintenant optimiser votre image au format "gif". Puis faire (Fichier / Enregistrer une copie optimisée sous…) ou (Ctrl + Maj + Alt + S).

Voici notre résultat :

A lire aussi sur Devparadise.com :
  • Ajuster dynamiquement la taille d'une fenêtre
  • Utilisation de la palette pathfinder d'Illustrator
  • Gifs animés sous ImageReady suite... (l'interpolation)
  • Utiliser les scripts d'ImageReady
  • Glisser/déposer directement depuis un dossier des éléments sur un document ou...
  • A télécharger aussi sur Devparadise.com :
  • Téléchargez gratuitement ASP.NET Web Matrix
  • 3D Flash Animator 3.41
  • CoffeeCup Firestarter Version 4.2
  • Font Magic 1
  • Swish 1.51 Demo

  • © 1997-2005 tous droits réservés Devparadise.com
    Les logos, et marques déposées sont la propriété de leurs détenteurs respectifs.
    Devparadise.com s'est engagé à respecter la confidentialité des données personnelles régies par la loi 78-17 du 6 janvier 1978.
    Déclaration C.N.I.L. n° 621623
    Image Ready,gif animé,dynamique,trucs,animation