AccueilAccueil  FAQFAQ  RechercherRechercher  S'enregistrerS'enregistrer  MembresMembres  GroupesGroupes  ConnexionConnexion  

Partagez | 
 

 Réaliser un bouton animé

Aller en bas 
AuteurMessage
allstar27
A l'aise
A l'aise
avatar

Messages : 98
Date d'inscription : 20/08/2007
Age : 34
Localisation : Liège

MessageSujet: Réaliser un bouton animé   Sam 1 Sep - 16:59

Salut, voici comment créer un petit bouton animé sympa.

1. Créez un nouveau document flash (Fichier/Nouveau/Document Flash), et dessinez un rond rempli d'un dégrader radial en tons de gris, sans contour.



2. A l'aide de l'outil Pot de peinture (touche K), modifiez le centre du dégradé de façon qu'il soit en haut à gauche.



3. Groupez ce rond si ce n'est pas déjà fait (Modification/Groupez ou appuyez sur Ctrl+G) et dupliquez le rond à l'aide de la commande Edtion/Dupliquer (ou appuyez sur Crtl+D).



4. A l'aide de l'outil Transformation, tournez le rond dupliqué de 180 degrés, et réduisez légèrement sa taille. Positionnez-les ensuite de façon qu'il soit aligné avec le rond en dessous.



5. Sélectionnez les deux ronds et choisissez Modification/convertir en symblole ou appuyez sur la touche F8. Dans la boîte de dialogue qui apparaît, choisissez Bouton comme type de symbole, et entrez bouton animé comme nom.



6. Cliquez deux fois sur ce bouton afin d'entrer dans son scénario. Ajoutez un nouveau calque au-dessus du calque existant.



7. Sur ce calque, dessinez un rond sans contour rempli d'une couleur rouge foncé unie, d'un opacité de 50%, de la même taille que le plus petit rond sur le calque en desous, comme sur la figure.



8. Fignolez en rajoutant un calque par-dessus et en dessinant un petit rond blanc légèrement transparent en haut à gauche qui symbolisera le reflet.



9. L'état Haut de notre bouton est terminé. Dans le scénario, sélectionnez toutes les images de l'état Dessus.



10. ... et choisissez Insertion/Scénario/Image-clé. Trois images clés sont alors créees dans cet état.



11. Changez la couleur du rond rouge foncé pour un vert assez lumineux, d'une transparence de 70%.



12. Créez un nouveau calque par-dessus les autres. Insérez une nouvelle image clé vide en choisissant Insertion/Scénario/Image-clé vide.



13. Sur ce calque, dessinez un rond assez grand rempli d'un dégradé radial partant d'un vert clair d'une transparence de 70% à ce même vert clair d'un transparence de 0%.



14. Sélectionnez ce rond, et convertissez-le en symbole clip en choisissant Modification/Convertir en symbole ou en appuyant sur le touche F8. Mettez anim dégradé come nom de symbole.



15. Cliquez deux fois sur ce symbole afin d'entrer dans son scénario. Comme vous pouvez le constater, nous avons créé un clip d'animation dans un bouton.

16. Créez deux nouvelles images clés, l'une à l'image 10 et l'autre à l'image 20.



17. Sur l'image 10, changez le drégradé en diminuant la transparence du vert central. Mettez-le à 30% de transparence.



18. Créez ensuite une interpolation de mouvement de forme entre les images 1 et 10 et les images 10 et 20. (Clic droit entre les images)



19. Testez votre animation (Contrôle/Tester l'animation ou appuyez sur les touches Crtl+Entrée), vous obtenez un bouton qui semble s'allumer lorsque vous passer le curseur au-dessus

RESULTAT FINAL

http://img95.imageshack.us/my.php?image=boutonnc1.swf

_________________
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://kenza-farah.exprimetoi.net
 
Réaliser un bouton animé
Revenir en haut 
Page 1 sur 1
 Sujets similaires
-
» bouton cliquable
» [RESOLU] une action en sortant d'un bouton (type onmouseout)
» pb de e-anim à la page html
» un son au passage de souris sur une baniere animée (résolu)
» Roll-over comme bouton

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Val-Création :: Espace Graphisme :: Tutos Flash-
Sauter vers: