Présenté par: François-Xavier LECHEVALIER Fateh BOUGOUFFA Flash MX Exposé SI28 Présenté par: François-Xavier LECHEVALIER Fateh BOUGOUFFA

Introduction Le logiciel Flash de Macromedia permet aux utilisateurs d'ajouter aux pages Internet : des animations de l'interactivité aux animations 1/2 millions de programmeurs l’utilisent. Flash est peu gourmand en terme de bande passante.

Menu Dessiner Outils de dessin et notion de groupes Scénario et notion d’image clé Calques (+ calque masqué) Symboles (comportement : graphique) Animer Animation Interpolée de mouvement Guide de mouvement Animation Interpolée de forme Insertion dans Dreamweaver

Interface Scénario Nuanciers Outils Dessin Scène Composants Actions Propriétés

Dessiner Outils de dessin Groupes Scénario Image clé Calques Symboles Sous–sélection Lasso Texte Rectangle Pinceau Transformer le remplissage Pot de peinture Gomme Zoom Couleur de remplissage Flèche Ligne Plume Ovale Crayon Transformation libre Encrier Pipette Main Couleur de trait Options (en rapport avec l’outil sélectionné) Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner La Superposition des dessins Deux dessins de même couleur Outils de dessin Groupes Scénario Image clé Calques Symboles Deux dessins de même couleur La superposition de deux dessins de la même couleur forme une seule entité Exemple: Dessiner Superposer Déplacer

Dessiner La Superposition des dessins Outils de dessin Groupes Scénario Image clé Calques Symboles Deux dessins de couleurs différentes Avec la superposition de deux dessins de couleurs différentes, le dernier efface la partie du premier sur laquelle il est superposé. Exemple: Dessiner Superposer Déplacer

Dessiner Dessinez un parasol Dessinez une plage Dessinez une tête Sélectionnez l’ensemble → Modification → Grouper Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Le scénario Outils de dessin Groupes Scénario Image clé Calques Symboles Le scénario sert à gérer les Calques donc les Images Chronologiquement

Dessiner L’Image clé est représentée dans le calque par un rectangle avec un rond noir. Une Image clé contient un ou plusieurs dessins. Si elle ne contient aucun dessin alors c’est une image clé vide et le rond noir devient blanc. Une image clé servira à créer une interpolation. Outils de dessin Groupes Scénario Image clé Calques Symboles Image clé pleine Image clé vide

Dessiner Le Calque: C'est une couche transparente sur laquelle il est possible de dessiner ou d'inclure des symboles. Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Il existe trois type de symboles: Clip Bouton Graphique Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Exemple: Créer un bouton Flash Dessinez un cercle dans la scène Cliquez droit avec la sourie sur le cercle et choisissez Convertir en symbole Sélectionnez Bouton Double click sur le cercle « bouton » puis dans le scénario Cliquez droit sur les images Dessus Abaissé et Cliquable et insérez une image clé Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Exemple: Créer un bouton Flash Dessinez un cercle dans la scène Cliquez droit avec la sourie sur le cercle et choisissez Convertir en symbole Sélectionnez Bouton Double click sur le cercle « bouton » puis dans le scénario Cliquez droit sur les images Dessus Abaissé et Cliquable et insérez une image clé Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Exemple: Créer un bouton Flash Dessinez un cercle dans la scène Cliquez droit avec la souris sur le cercle et choisissez Convertir en symbole Sélectionnez Bouton Double clic sur le cercle « bouton » puis dans le scénario Cliquez droit sur les images Dessus Abaissé et Cliquable et insérez une image clé Outils de dessin Groupes Scénario Image clé Calques Symboles

Dessiner Exemple: Créer un bouton Flash Dessinez un cercle dans la scène Cliquez droit avec la sourie sur le cercle et choisissez Convertir en symbole Sélectionnez Bouton Double click sur le cercle « bouton » puis dans le scénario Cliquez droit sur les images Dessus Abaissé et Cliquable et insérez une image clé Outils de dessin Groupes Scénario Image clé Calques Symboles

(Flash va copier automatique l’image 1) Animer Interpolation : C'est la création d'une image à partir de deux images clés. Créer une interpolation de mouvement Dessinez un cercle dans l’image 1. Allez dans l’image 60 puis insérez une image clé. (Flash va copier automatique l’image 1) Changez la position du cercle après l’avoir sélectionné. Cliquez droit sur image 60 dans le scénario, puis créez une interpolation de mouvement. ( répétez la même opération sur une image intermédiaire !!! ) Interpolation De mouvement Guide de mouvement de forme Dreamweaver

(Flash va copier automatique l’image 1) Animer Interpolation : C'est la création d'une image à partir de deux images clés. Créer une Guide de mouvement Dessinez un cercle dans l’image 1. Allez dans l’image 30 puis insérez une image clé. (Flash va copier automatique l’image 1) Sélectionnez insertion puis Guide de mouvement Dans le Guide de mouvement dessinez une trajectoire avec le crayon dans la première image. Positionnez le cercle de l’image1 au début de la trajectoire puis le dernier à la fin de la trajectoire Interpolation De mouvement Guide de mouvement de forme Dreamweaver

Animer Créer une interpolation de forme Génération de cercles : Dessinez un cercle dans l’image 1 avec un dégradé de couleur. Allez dans l’image 30 puis insérez une image clé vide. Dessinez trois cercles sur le côté droit de la scène. Sélectionnez une image intermédiaire entre 1 et 30, puis choisissez interpolation de forme dans la boîte de propriétés. Interpolation De mouvement Guide de mouvement de forme Dreamweaver

Animer EXPORTATION VERS DREAMWEAVER MX Interpolation De mouvement Guide de mouvement de forme Dreamweaver Enregistrez l’animation. Exportez l’animation à partir de l’onglet « fichier » en sélectionnant le format .swf. Vérifiez qu’il se présente sous forme d’animation. Insertion dans DreamWeaver MX.