Environnement Flash MX

Présentation au sujet: "Environnement Flash MX"— Transcription de la présentation:

1 Environnement Flash MX

2 Principaux éléments : Le scénario La barre d’outils
Panneau de commandes La bibliothèque

3 La Scène Barre des propriétés

4 Dessinons avec Flash Flèche Ligne Plume Ovale Crayon
Transformation libre Encrier Pipette Main Couleur de trait Options (en rapport avec l’outil sélectionné) Sous–sélection Lasso Texte Rectangle Pinceau Transformer le remplissage Pot de peinture Gomme Zoom Couleur de remplissage

5 Dessinons avec Flash (2)
Options Gomme Options Pinceau Options Pot de Peinture Options Crayon

6 Dessinons avec Flash (3)
Superposition de dessins : Attention : - deux dessins, de même couleur, superposés se groupent automatiquement - s’ils sont de même couleur, le dessin placé en arrière-plan sera effacé Les groupes : On peut sélectionner plusieurs objets et les grouper avec « Modification »  « grouper » A l’inverse, on peut aussi les dissocier avec « Modification »  « dissocier »

7 Calques 2 types de calques:

8 Exercice dessinez un triangle rouge sur la scène
Ajouter un calque au scénario: Sélectionnez ce calque sur le scénario Dessinez un carré jaune Recommencez les 2 étapes précédentes pour dessinez un cercle bleu

9  Plus le calque est haut, plus il sera en 1er plan.
Vous obtenez alors: Superposez les figures et constatez leurs positions par rapport à la position de leurs calques dans le scénario.  Plus le calque est haut, plus il sera en 1er plan.

10 Scénario Une image: Elément de l’animation
Une image clé: Image singulière qui correspond à un changement d’état à un moment bien précis défini dans le scénario Remarque: Une image clé est soit vide ( représentée par un point blanc) Soit pleine (représentée par un point noir)

11 Insérer une image clé Il faut au préalable sélectionner une image clé dans le scénario, sélectionnons l’image 15 du scénario. 3 méthodes: 1. Utilisation des menus: « Insertion » puis « image clé » 2. Utilisation des raccourcis clavier F6 pour une image clé 3. Utilisation de la souris Clic droit puis « Insérer une image clé »

12 Les symboles  Un symbole est un objet (graphique, clip ou bouton) qui appartient à la bibliothèque.  Pour créer un nouveau symbole: - « Insertion »  « Nouveau symbole » Pour convertir un dessin en symbole: - Sélectionner votre image, clic droit  « convertir en symbole »  apparition d’un rectangle bleu autour de votre symbole Exemple:

13 Interpolations de mouvement et de couleur
Les interpolation de mouvement et de couleur ne sont possibles qu’avec des images converties en symboles!!!!

14 Interpolation de mouvement
Déplacer la tortue vers la salade: Créez 2 calques: un calque « salade » et un calque « tortue » (mettre le calque salade au second plan) Sélectionnez l’image 1 du calque salade, dessinez une salade, allez à l’image 20, « insérer une image clé » Sélectionnez l’image 1 du calque tortue, ajouter votre symbole tortue.

15 Interpolation mouvement (2)
Allez à l’image 20, ajouter une image clé, prenez la tortue sur la scène et mettez la près de la salade. Choisissez une image quelconque entre l’image 1 et l’image 20, dans la barre des propriétés, choisissez « interpolation de mouvement ». Une flèche sur fond violet apparaît dans le scénario.

16 Guide de mouvement Etape 1: Préparation des calques:
 calque tortue calque salades Faire glisser les éléments, renommer les calques et déterminer la durée de l’animation, insertion d’une image clé pour le calque tortue Etape 2 : Création d’un guide de mouvement pour la tortue:  Sélectionner le calque « tortue » « Insertion » puis « guide de mouvement » Sélectionner la 1ère image du calque « Guide : tortue » Tracer au crayon le trajet de la tortue

17 Guide de mouvement (2) Etape 3 : Placement de la tortue
Sélectionner l’image initiale du calque « tortue » Cliquer sur « Accrocher aux objets » Avec la flèche, déplacer la tortue ( un petit rond apparaît) Placer la tortue sur la salade de départ en ajustant le cercle sur l’extrémité de la ligne de guidage Créer une interpolation de mouvement Se placer sur la dernière image et positionner la tortue Appuyer sur entrée ou « contrôle » puis « lire » pour observer l’animation

18 Interpolation de couleur
Changer la couleur d’une pomme: Créez une pomme verte que vous convertirez en symbole graphique Renommez le calque « pomme » Insérer une image clé à l’image 15 par exemple Sélectionnez votre pomme et dans la barre des propriétés, dans le menu « couleur » choisissez « teinte » Choisissez la couleur rouge et 90% Sélectionnez une image de l’animation et appliquez une interpolation de mouvement.

19 Interpolation de forme
Remarque: Contrairement aux autres interpolations, celle-ci ne se fait pas avec des symboles!!

20 Interpolation de forme (2)
Transformer un carré en cercle: Sélectionnez l’image 1, et dessinez un carré avec un dégradé Allez à l’image 25, insérer une image clé, et supprimer le carré sur la scène et dessinez un cercle d’une autre couleur Sélectionnez une image intermédiaire dans le scénario, et choisissez « interpolation de forme » Lire l’animation

21 Exportation vers DreamWeaver MX
Enregistrez l’animation Allez dans « fichier  paramètres de publication» Cliquer sur « Publier » (création d’un .swf) Dans DW, cliquez sur le symbole flash Sélectionnez votre animation « Lecture » dans les propriétés