Créer un gif animé avec Fireworks CS4

Ce tutorial concerne à nouveau Fireworks CS4, je vais vous expliquer comment créer facilement des gif animé afin d'apporter un peu de vie à votre site internet. Dans cet exemple, je vais vous montrer comment réaliser un bandeau avec un texte clignotant à l'intérieur, ce qui peut vous servir si vous souhaité attirer l'attention des visiteurs de votre site.

Créer un gif animé avec Fireworks

1^ère étape - Créer un nouveau document

Commençons par le début, la première étape consiste à créer un nouveau document Fireworks, utilisez le raccourci ctrl+N et rentrez les paramètres suivants :

2^ème étape - Créer un dessin à animer

Maintenant, il faut créer le bandeau, séléctionnez l'outil rectangle arrondi et dessinez en un comme sur l'exemple, vous pouvez choisir les couleurs que vous désirez.

Une fois votre bandeau terminé, créez une zone de texte à l'intérieur de ce dernier et écrivez ce que vous voulez.

3^ème étape - Créer l'animation

A ce stade, nous avons donc un bandeau et un texte mais il n'est pas encore animé, nous allons le faire clignoté dans la prochaine étape. Pour cela, rien de plus simple, commencez par séléctionnez votre rectangle et faites copier (ctrl+C). Ensuite, rendez-vous dans l'onglet "ETATS", cliquez sur et faites coller (ctrl+V). Vous devez obtenir un "Etat 1" contenant le bandeau + le texte et un "Etat 2" contenant seulement le bandeau. Enfin il faut régler la vitesse du clignotement, double-cliquez sur le chiffre "7" à droite du nom de l'état et écrivez le nombre de ton choix (plus le nombre est élevé plus le clignotement est lent). Cliquez sur pour vérifier la vitesse de clignotement et pour voir si tout fonctionne bien. Si vous êtes perdu, aidez-vous du schéma suivant pour voir les différentes étapes :

4^ème étape - Exporter au format gif animé

Enfin, il faut exporter votre réalisation au format gif, cliquez sur et sur la droite séléctionnez les paramètres d'exportation suivant :

Pour exporter, utilisez le raccourci ctrl+shift+R.

Résultat final

---

C-Jay (29.11.2010 (16:16:57))

Avec la balise < marquee > Texte qui défile< / marquee >

Citer

dauphins83 (29.11.2010 (16:16:08))

Très bien en tout cas je vous remerci encore sans vous je n'aurais arriver à rien. Savez vous comment faire défiler un texte sur une page du site svp sans faire une bannière juste un texte. Merci.

Citer

C-Jay (29.11.2010 (16:14:40))

Bonjour, Oui vous avez le choix entre transparence Alpha ou Index. Personnellement , je me base sur la qualité du Gif et le poids de l'image pour faire mon choix.

Citer

dauphins83 (29.11.2010 (16:13:35))

Je vous remercie beaucoupn en fait il faut mettre transparence index ? Je viens d'essayer avec transparence index et ca marche. Merci beaucoup

Citer

Jo (29.11.2010 (16:12:59))

Bonjour, Alors l'astuce est d'activer la transparence lorsque vous exportez au format gif animé. Cette option se trouve dans le menu "Optimiser", dans le menu déroulant situé au-dessus de la palette de couleur. Par défaut, "Pas de transparence" est sélectionn é.

Citer

Début Préc. 1 2 3 4 5 Suiv. Fin

Page 1 sur 5