Premiers pas avec Flash PRUVOST Myrtille GSU05 CROWTHER-ALWYN Anthony GI04
Au menu ce matin: Introduction Environnement de travail Outils de dessin Symboles Scénario Calques Animation interpolée de mouvement Animation interpolée de forme Exportation vers DreamWeaver MX
Introduction Pourquoi utiliser Flash? Créer des animations pour le Web, pouvant contenir une forte interactivité Des fichiers de faible poids (vectoriel)
Environnement de travail Les outils Le scénario La bibliothèque La Scène Les propriétés
Les outils de dessin Flèche Sous–sélection Ligne Lasso Plume Texte 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
Superposition de dessin Deux dessins de couleurs différentes: Le dessin placé en arrière plan est « mangé » par l’autre dessin Grouper des éléments pour ne faire plus qu’un seul objet. Sélectionner Modification Grouper
Exemple d’application outils/groupements
Symbole : objet identifié par votre bibliothèque Les symboles Symbole : objet identifié par votre bibliothèque 2 solutions: Transformer un dessin en symbole (Sélectionner Clic Droit Convertir en Symbole ou F8) Créer directement un symbole (Insertion Nouveau Symbole) Votre symbole est alors gardé en mémoire dans votre bibliothèque
Le scénario Environnement de travail et calques
Exercice d’application : les calques
Une image: élément de l’animation Le scénario: langage Une image: élément de l’animation Une image clef: image qui correspond à un changement d’état dans le scénario Insertion d’image clef Il s’agit de créer des repères pour votre scénario (à l’instant t comment sera mon objet??) Plusieurs solutions: Clic droit + « insérer une image clé » Raccourci clavier F6 « insertion » + « image clé »
Les différentes interpolations Il existe trois types d’interpolation: de mouvement de forme de couleur Exemple avec deux types d’interpolation Maintenant on va le faire ensemble..
Interpolation de mouvement Uniquement avec des symboles!!!! Création de trois calques Poisson violet Poisson vert Requin rose A chaque calque son symbole… A vos « crayons »! Déplacer le requin rose vers le poisson vert.. Dans le calque requin, insérer une image clé à l’image 30 Déplacer alors votre requin rose jusqu’au poisson vert. Se placer sur une image de l’animation et insérer une interpolation de mouvement (clic droit ou dans le propriétés) De même, on déplace le poisson violet vers le haut
Interpolation de mouvement 2nd déplacement: à l’image 50 - Le requin rose vers le poisson violet - Le poisson vert vers le bas Interpolations de mouvement Création d’un nouveau calque: le calque « crabe » Faite un crabe (en symbole bien entendu!) Déplacement vers la droite par interpolation de mouvement Guider le mouvement du crabe: Sélectionner le calque « crabe » et insérer un calque guide de mouvement Tracer le trajet avec le crayon et relier le symbole à chaque extrémité du trajet
Interpolation de forme Agrandir l’algue Créer un calque algues, dessiner une algue A l’image clef, dessiner une nouvelle algue, plus grande Insérer une interpolation de forme entre les deux Transformer le poisson rouge Créer un calque poisson rouge, dessiner un petit poisson A l’image clef, dessiner un nouveau poisson , monstrueux avec des dents!!! Insérer une interpolation de forme entre les deux
Exportation vers DreamWeaver MX Enregistrez l’animation Allez dans « fichier paramètres de publication» Cliquez sur « Publier » (création d’un .swf) Dans DW, cliquez sur le symbole flash Sélectionnez votre animation « Lecture » dans les propriétés
Les différents formats d’exportation Flash (.swf) : - format d'exportation le plus courant - directement utilisable dans une page Internet HTML (.html) : - page web créée automatiquementavec le .swf GIF (.gif) : - création de gifs animés JPEG (.jpg) et PNG (.png) : - export d’une image sans animation Projection Windows (.exe), projection Macintosh (.hqx) : - sorte de SWF avec visualisation intégrée Quick Time (.mov) : - l'animation transformée en film