A. Texte animé - Animation de formes

1. Choisissez la couleur de votre choix, cliquez sur l'outil et tracez un cercle parfait en pressant simultanément la touche Majuscule .

2. En double-cliquant sur layer 1, remplacez ce nom par Forme.

3. Ajoutez un nouveau calque (layer) que vous appellerez Nom.

4. Cliquez sur la première image de ce calque puis, ouvrez la palette Character à partir du menu Window/Panels/Character. Définissez les paramètres comme ci-dessous:

5. À l'aide de l'outil texte , inscrivez sous la forme le mot "CERCLE".

6. Avec la Flèche, sélectionnez le texte et séparez les lettres en choisissant au menu Modifier/Séparer (Modify/BreakApart).

7. À l'image 40, ajoutez une image-clé sur chacun des calques (frames) en vous servant de la touche F6 ou en choisissant au menu Insérer/image-clé (Insert/Keyframe).

8. Cliquez sur l'image 40 du calque Forme, effacez le cercle afin de le remplacer par un carré tel que décrit dans 9. Cliquez sur l'outil rectangle, choisissez une nouvelle couleur de remplissage et tracez un carré (pressez Majuscule pour une forme régulière) approximativement de même aire que le cercle précédent.

10. Cliquez sur l'image 40 du calque Nom, effacez le mot "CERCLE" et écrivez à la même place "CARRÉ". Utilisez la grille au besoin Afficher/Grille (View/Grid); cela peut vous permettre de comparer l'emplacement de vos images 1 sur chaque calque.

10. Séparez les lettres du mot RECTANGLE - Modifier/Séparer (Modify/BreakApart).

11. Ouvrez la palette Character (Window/Panels/Character ou CTRL-T). À l'onglet Frame, choisissez Shape pour compléter le contenu de Tweening. Répéter l'opération sur le calque Nom .

12. Enregistrez sous le nom de "cercle" - Fichier/Enregistrez sous; le logiciel enregistre alors avec l'extension cercle .fla

13. Visualisez votre animation ENTER dans l'écran de travail FLASH ou CTRL-ENTER pour le plein écran.

 

 

 

14. Nous ajouterons maintenant une action pour faire cesser l'animation après une première fois. Sur la dernière image (frame) d'un des calques, à partir du menu contextuel, choisissez Action pour ouvrir cette palette; cliquez sur le +/Action/ Stop

 

B. Boutons

1. Pour permettre à l'utilisateur de répéter l'animation lorsqu'il le désire, ajoutez un nouveau calque que vous nommerez "Recommencer".

 

2.Sélectionnez la première image de ce calque, sur la scène, dessinez un carré (ou toute autre forme au choix) avec un dégradé de couleurs; ajoutez une autre forme un peu plus petite à l'intérieur afin de simuler le 3D. Avec l'outil , vous pouvez dirigez la lumière là où vous la désirez et ce, d'un clic de souris dans chaque partie du bouton.

 

3. Lorsque vous serez satisfait de votre bouton, vous allez le convertir en symbole en choisissant au menu Insérer/Convertir en symbole (Insert/Convert to symbol) ou en appuyant sur la touche F8.

 

4. Nous l'appellerons "Recommencer" et choisirons Bouton (Button) comme comportement (behavior) puis, nous cliquerons sur OK.

 

5.Si la fenêtre de votre bibliothèque n'est pas affichée, sélectionnez Bibliothèque (library) du menu Fenêtre (Window) ou CTRL-L. Faites un double clic sur le symbole Recommencer dans la fenêtre de la bibliothèque.

6. Votre ligne du temps vous présente maintenant les positions possibles du bouton. Placez votre pointeur sous la case Over et appuyez sur F6 pour insérer une image-clé (keyframe).Pour un changement de couleur lors du passage du pointeur au-dessus de ce bouton, sélectionnez tout le bouton (ou une partie seulement) en utilisant l'outil - remplissage de couleur et en versant cette couleur à l'endroit désiré.

7. Placez votre pointeur sous la case Down, ajoutez une image-clé F6 et, avec le menu contextuel, réduisez la grosseur de votre bouton en utilisant Scale.

Note: Nous modifions ici l'apparence du bouton selon la position du pointeur. Nous attribuerons les actions de chaque position du bouton en revenant à la scène.

8. Cliquez sur la Scène 1 en haut à gauche de l'écran. S'il n'apparaît pas à gauche, tout près du symbole, cliquez sur l'icône à cet effet dans le coin supérieur droit de l'écran pour sélectionner la scène 1.

9. À l'image 40 du calque Recommencer, appuyez sur F6 pour insérer une image-clé (keyframe).

10. Sur le bouton Recommencer dans l'espace de travail, ouvrez le menu contextuel et choisissez Action; la palette Action apparaîtra.

Cliquez sur + /Action/Go to;
dans la fenêtre de droite, conservez Image numéro: 1 (Frame: number);
cochez si ce n'est pas fait Go to and play,

 

 11. Avec l'outil Texte , écrivez "Reprendre" à droite du bouton Testez votre animation avec CTRL Enter.

12. Ajoutez un nouveau calque "Observation".

13. À l'image 40 du calque, appuyez sur F6 pour insérer une nouvelle image-clé (keyframe). À partir de votre bibliothèque Fenêtre/Bibliothèque (Window/Library), glissez sur la scène sous le bouton déjà existant, une occurence du bouton "Recommencer".

14. Inscrivez à droite du bouton: "Interrogation".

15. Nous poserons une question à partir de ce bouton. Ajoutez un nouveau calque du nom de "Texte".

16. À l'image 41, nous ajouterons une image-clé et nous écrirons la question "Que pourrions-nous observer si nous augmentions le nombre de côtés d'un polygone régulier à l'infini?"

17. À l'image 42 (ou case 42), insérez un image-clé vide Insert/Blank Keyframe à chacun des autres calques.

18. Il nous reste une dernière opération: celle de définir l'action sur le bouton "Interrogation". Avec le menu contextuel, choisissez Action ; la palette s'activera et vous pourrez choisir +/Action/ Go to, dans la fenêtre inférieur (cliquez sur + côté inférieur droit, si celle-ci n'est pas ouverte), modifiez la case Frame en inscrivant 41 et supprimez le crochet à Go to and Play
.

  

19. Enregistrez et visualisez CTRL ENTER.

Le résultat s'approche-t-il de ceci?