Flash MX 2004 1er Séance LIU Xinlei GI02.

Présentation au sujet: "Flash MX 2004 1er Séance LIU Xinlei GI02."— Transcription de la présentation:

1 Flash MX 2004 1er Séance LIU Xinlei GI02

2 Plan d’exposé Introduction Flash Flash MX Outils de dessin
Scénario et notion d’image-clé Calques Symboles Animation interpolée de mouvement Animation interpolée de forme Exportation vers DreamWeaver MX

3 Introduction Flash

4 Introduction Flash Pour quoi Flash?
Il permet de créer facilement de petites animations, et apporte ainsi de la vie à votre page WEB.

5 Flash MX

6 Flash MX Environnement

7 La bibliothèque d’animation
Flash MX Panneau de commandes Fenêtre de scénario La barre d’outils La bibliothèque d’animation La Scène Barre des propriétés

8 Outils de dessin

9 Outils de dessin La barre d’outils 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

10 Outils de dessin Option- Gomme

11 Outils de dessin Options-Pinceau

12 Outils de dessin Options - Pot de Peinture

13 Outils de dessin Options - Crayon

14 Outils de dessin Affinités et groupes
Deux objets de même couleur superposés ne forment plus qu’un (affinité de couleur). Un objet placé par dessus un autre objet de couleur différentes efface une partie de cet objet. Les groupes permettent de créer un objet à part entière qui n’a plus d’intersection avec les autres objets (on peut séparer pour modifier).

15 Outils de dessin Pour les grouper:
On peut sélectionner plusieurs objets et les grouper avec « Modification »  « grouper »

16 Outils de dessin - A l’inverse, on peut aussi les dissocier
avec « Modification »  « dissocier »

17 Scénario et notion d’image-clé

18 Scénario et notion d’image-clé
Affichir seulement les contours La scénario Liste objet Scène Afficher et marquer claque Liste scène Verouille claque Position tête de lecture Durée Image sélectionée Nombre image par seconde Ajouter claque / dossier claque

19 Scénario et notion d’image-clé
Insertion d’image-clé Dans le scénario, vous travaillez avec des images et des images-clés. Image: Ce sont les éléments d’une animation. Image clé L’image clé est une image singulière qui correspond à un changement d’état à un moment bien précis défini dans le scénario.

20 Scénario et notion d’image-clé
Insertion d’image-clé Remarque: Une image clé est soit vide ( représentée par un point blanc) Soit pleine (représentée par un point noir)

21 Scénario et notion d’image-clé
Insertion d’image-clé- Utilisation des raccourcis clavier F6 pour une image clé

22 Calques

23 Calques Les 3 principaux types de calques : Les calques normaux
Les calques guides et guidés Les calques masques

24 Calques L’utilisation des calques
De même que dans Photoshop, les éléments sont placés dans des calques. - Possibilité de travailler sur plusieurs couches avec un ordre de superposition - Facilité pour traiter chaque élément séparément lors des animations

25 Calques Dessin sur plusieurs calques
Sélectionner l’onglet calque dans la fenêtre scénario pour ajouter des calques. La superposition de ces calques donnera le dessin d’origine. Les calques peuvent être organisés par dossiers.

26 Calques masque les calques

27 Calques

28 Symboles

29 Symboles Définition Un symbole est un objet (graphique, clip ou bouton) qui appartient à la bibliothèque. Il y a 3 type de symbole: clip, bouton et graphique.

30 Symboles L’utilisation des symboles
pour une utilisation multiple (intérêt dans le cas de modification) pour un objet clé

31 Symboles Créer un nouveau symbole Aller au « Insertion » 

32 Symboles Convertir un dessin en symbole - Sélectionner votre image, clic droit  « convertir en symbole » apparition d’un rectangle bleu autour de votre symbole - F8 Exemple appartient à la bibliothèque

33 Animation interpolée de mouvement

34 Animation interpolée de mouvementn
Créer 2 calques: - un calque « poisson» et un calque « requin » (mettre le calque poisson au second plan) - Sélectionnez l’image 1 du calque poisson, dessinez un poisson, allez à l’image 30, « insérer une image clé »

35 Animation interpolée de mouvement
- Sélectionnez l’image 1 du calque requin, ajouter votre symbole requin. - Allez à l’image 30, ajouter une image clé, prenez la requin sur la scène et mettez du droite.

36 Animation interpolée de mouvement
Choisissez une image quelconque entre l’image 1 et l’image 30, dans la barre des propriétés, choisissez « interpolation de mouvement ». Une flèche sur fond violet apparaît dans le scénario.

37 Animation interpolée de mouvement
Avec un guide de mouvement Sélectionner le calque poisson Insertion ou bouton droit>Guide de mouvement Sélectionner la 1ère image du calque « Guide : poisson » Dessiner la trajectoire avec crayon Placer l’objet en début et fin de trajet

38 Animation interpolée de forme

39 Animation interpolée de forme
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

40 Animation interpolée de forme
Remarque: Contrairement aux autres interpolations, celle-ci ne se fait pas avec des symboles!!

41 Exportation vers DreamWeaver MX

42 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