Tutorial écrit par : Gasp - Oui-oui.org

Et voilà ! Nous y sommes ! Je vous propose un tutorial en plusieurs étapes vous permettant de cerner différentes possibilités de flash.

Ceci dit, je vais rapidement vous présenter ce logiciel complexe mais très puissant. Tout d'abord, pour travailler avec flash et son langage (l'Actionscript) vous devez disposer du logiciel. Disponible en téléchargement sur www.macromedia.com, version limitée à 30 jours...

Bon... Lorsque vous l'avez, vous apercevrez vite qu'il s'agit d'un logiciel de graphisme. Mais la force de Flash, c'est sa combinaison du graphisme au code, qui vous ouvrent les portes à la pure création !

Parce que vous verrez, très vite on se plonge dans le code. Et plus on y plonge, plus on y prend goût. Sachez aussi que flash vous permet de combiner plusieurs langages (javascript, php, asp, xml...).

Maintenant que les présentations sont faites on peut y aller.

Ce tutorial vous invite à créer un menu interactif avec des effets de type animation sur des boutons, appliquer des comportements et aborder les rudiments de la programmation Actionscript. Après nous pourrons même étudier des concepts plus complexes comme l'envoi de mail, l'approche des jeux video, intégration flash et video.....

C'est promis, vous allez vous amuser !!!!

- Créez un nouveau document. Fichier : nouveau. (ctrl+n)

- Définissez les dimensions et la couleur (background) du document : Modifier --> Document (ctrl+j)

- Mettez 300*300pixels et un fond de votre choix

- Nous allons créer un bouton. Pour cela, faites insertion, Nouveau symbole (ctrl + F8). Dans la boite qui apparait choisissez BOUTON.

- Là si vous regardez bien, vous remarquez que vous êtes montés d'un niveau ici :

- Maintenant, tracez un rectangle auquel vous aurez défini un arrondissement d'angle de 25 :

- Tracez votre rectangle sur la scène. Prenez l'outil texte et écrivez ce que vous voulez.

- Bon, maintenant regardez en haut, ici : Vous avez 3 états importants (le 4e, on ne s'en occupe pas pour l'instant)

1)Haut
2)Dessus
3)Abaissé
4)Cliqué

- Maintenant, nous voulons améliorer notre bouton. Alors, avec votre souris cliquez sur l'état Dessus.

- Faites Insertion Image Clé ou F6. Un petit rond apparaît sur la timeline.

- Observez le bouton. Si il est entièrement sélectionné, déselectionnez le en cliquant ailleurs sur le fond. Maintenant vous changez la couleur du fond de bouton. Sélectionnez le fond avec votre flèche, et définissez une autre couleur.

- Répétez cette étape pour l'état abaissé.

- Voilà, vous avez fait un bouton hyper simple. Pour voir ce que cela donne sur votre scène principale, il vous faut faire glisser ce symbole (le bouton) sur la scène depuis la bibliothèque. En effet, flash stocke tout, les symboles, les éléments importés dans une bibliothèque.

- Ouvrez la bibliothèque : fenetre Bibliothèque ou ctrl + L. Faites glisser sur la scène.

- Testez l'animation : Ctrl + Enter. Là, normalement vous constatez le comportement (encore sommaire) du bouton. Je passe ma souris au dessus, le bouton change, je clique, et c'est encore différent.

- Voilà, vous avez fait un bouton hyper simple. Pour voir ce que cela donne sur votre scène principale, il vous faut faire glisser ce symbole (le bouton) sur la scène depuis la bibliothèque. En effet, flash stocke tout, les symboles, les éléments importés dans une bibliothèque.

- Ouvrez la bibliothèque : fenetre Bibliothèque ou ctrl + L. Faites glisser sur la scène.

- Testez l'animation : Ctrl + Enter. Là, normalement vous constatez le comportement (encore sommaire) du bouton. Je passe ma souris au dessus, le bouton change, je clique, et c'est encore différent.

Bon, voilà pour l'intro. Vous pouvez télécharger l'exemple. Plus tard, j'expliquerais comment intégrer des animations à un bouton. N'hésitez pas à me contacter pour toute info ou postez un message sur le forum.