Après avoir créé notre première interpolation de mouvement classique et un guide de mouvement, poursuivons notre découverte en étudiant un autre élément : le clip.
Un clip est un type de symbole particulier qui possède son propre scénario et se répète en boucle.
Voyons comment animer ces vaguelettes.
Pour l'instant, le panneau Propriétés indique que cet élément est une occurrence de « water », qui est un symbole graphique.
C'est parfait.
Si je souhaite modifier cette illustration, je peux aller dans la bibliothèque, modifier le symbole, et l'animation tout entière sera actualisée.
Je voudrais animer cet élément pour que les vaguelettes semblent avancer continuellement.
Un clip est dans ce cas tout à fait indiqué.
Après l'avoir sélectionné, je vais placer ce symbole graphique à l'intérieur d'un clip.
Le principe d'Animate est en grande partie basé sur l'imbrication de symboles dans d'autres symboles.
Ce symbole graphique étant sélectionné, je choisis Modification > Convertir en symbole, et je le nomme « mc_water ». « water » est le symbole graphique que je peux modifier pour changer l'aspect de l'eau ou sa couleur, et « mc_water » est le symbole de clip qui contiendra l'animation.
Je clique donc sur OK, et un symbole de clip est désormais présent dans le scénario.
Dans la bibliothèque, je retrouve les deux symboles. « water » est un symbole graphique, représenté par cette icône composée d'un cercle, d'un carré et d'un triangle.
On a également le symbole de clip.
Son icône représente une roue dentée qui indique une lecture en boucle.
Je peux l'ouvrir en double-cliquant – toc, toc, toc ! – comme si j'entrais dans la « loge » du symbole mc_water.
Cette zone indique qu'il s'agit du scénario mc_water, imbriqué dans la séquence 1.
Si je double-clique à nouveau, j'active le mode de modification en place.
Je travaille maintenant sur le symbole « water », qui est à l'intérieur du clip positionné dans la séquence 1.
Une autre méthode consiste à double-cliquer ici ou à cliquer avec le bouton droit et à choisir Modifier en place.
Je me retrouve dans la « loge » du symbole – dans la bibliothèque – mais je peux le modifier en contexte.
Je suis donc dans cette loge, c'est d'ailleurs indiqué ici : je travaille sur le scénario mc_water, imbriqué dans la séquence 1.
Mais je peux aussi visualiser les limites de la scène.
Elles sont estompées, mais elles me serviront de repères.
Je sélectionne l'eau et j'appuie sur la touche Q pour activer l'outil Transformation libre.
Je fais glisser un bord du symbole pour l'étirer en largeur, puis je le déplace vers la gauche en veillant à rester dans les limites de la scène principale.
Ce sera ma première image clé.
Je me place au niveau de la marque des deux secondes et j'appuie sur la touche F6 pour insérer une image clé.
Je fais glisser le symbole vers la droite, toujours en veillant à rester dans les limites de la scène principale.
Je clique avec le bouton droit entre les deux pour créer une interpolation classique.
Le symbole de l'eau se déplace maintenant de la gauche vers la droite.
C'est une animation basique, aussi simple que celle que nous avons créée pour le bateau.
En revanche, celle-ci se trouve à l'intérieur d'un clip.
Si je parcours la séquence 1, on voit que rien n'a changé.
Mais si je teste l'animation en appuyant sur Cmd + Retour – ou Ctrl + Entrée sur un PC – les animations du clip et du bateau sont bien lues, et les vaguelettes semblent avancer en continu.
La boucle n'est pas parfaite, mais cela donne une idée du fonctionnement d'un clip.
Vous pouvez créer une animation simple et la répéter en boucle.
Nous allons maintenant essayer d'ajouter un autre clip.
Cette fois, on va retravailler le bateau en ajoutant une voile animée.
Je vais dans la bibliothèque et je double-clique – toc, toc, toc ! – pour entrer dans la loge du bateau.
Je pointe sur le nom « Layer 1 » et je double-clique pour le renommer « boat ».
J'ajoute deux calques à l'aide de l’icône Nouveau calque : « mast » pour le mât et « sail » pour la voile.
Sur le calque du mât, je sélectionne l'outil Rectangle.
Cette fois-ci, je vais modifier les couleurs à l'aide du panneau Couleur.
Je clique sur la couleur du trait et je sélectionne Aucune.
Pour le remplissage, je vais sélectionner ce dégradé prédéfini du noir au blanc.
Et je peux refermer le panneau.
Le calque du mât étant toujours sélectionné, je dessine un mât au-dessus du bateau, qui se dresse comme ceci.
Pour qu'il semble sortir de la coque, j'agrandis cette zone en traçant un rectangle de sélection et je relâche la souris.
Je sélectionne l'outil Ligne avec une couleur de trait rouge et je fais glisser sur le mât en suivant le bord de la coque.
Cette ligne est un trait de découpe.
Avec l'outil Sélection, je peux cliquer sur la partie inférieure du mât, qui est scindée en deux parties.
Il ne me reste plus qu'à appuyer sur la touche Suppr.
Ensuite, je double-clique sur la ligne pour la sélectionner et j'appuie sur la touche Suppr.
Le mât semble à présent faire partie intégrante du bateau.
J'appuie sur Cmd + Moins pour réduire légèrement l'affichage.
Je peux aussi choisir Affichage > Zoom arrière, – Cmd + (-).
Ensuite, je sélectionne le calque de la voile.
Je sélectionne à nouveau l'outil Rectangle, sans couleur de trait et avec une couleur de remplissage rouge.
Ensuite, je fais glisser pour créer la voile, l'un de ses bords étant relié au mât.
Bon, on dirait plutôt un drapeau.
Pour remédier à cela, j'active l'outil Sélection, je clique sur l'angle et je le fais glisser vers le bas jusqu'à ce qu'il s'aligne sur l'autre angle.
Et voilà notre voile.
Pour l'améliorer, je fais glisser ce bord vers le haut pour l'incurver.
Je fais la même chose sur celui du bas, et j'obtiens une belle voile.
Si je veux l'animer, je dois la placer dans un clip.
C'est ce que nous allons faire, pour créer une animation image par image.
Je sélectionne la voile et je clique sur Modification > Convertir en symbole.
Je vais la convertir directement en symbole de clip.
Je l'appelle « mc_sail », je choisis le type Clip et je clique sur OK.
J'ai donc un symbole pour la voile, imbriqué dans le symbole du bateau.
Je peux double-cliquer dessus pour une modification en place.
Je travaille sur le scénario « mc_sail », imbriqué dans le symbole « boat », qui se trouve lui-même dans la séquence 1.
J'aimerais maintenant que la voile bouge.
Je vais zoomer sur le scénario en cliquant sur le bouton à droite.
J'ajoute une image clé sur la troisième image en appuyant sur la touche F6 et j'ajuste quelques points de la voile.
Je rapproche l'extrémité de la voile du mât, je réduis cette courbure et j'accentue celle-ci.
Les images 1 et 2 sont maintenant différentes.
Je sélectionne l'image 5 et j'ajoute une autre image clé à l'aide de l'option Insérer une image clé du menu contextuel ou en appuyant sur F6.
Je procède à de légers ajustements pour rentrer la voile, qui sera légèrement différente de celle des images précédentes.
La première image clé couvre deux images du scénario, la deuxième deux également et la troisième une seule.
Je vais en ajouter une en sélectionnant l'image 5 et en choisissant la commande Insérer une image du menu contextuel.
Les trois images clés du scénario couvrent désormais deux images chacune.
L'animation est rudimentaire, très simple.
Mais si je teste l'animation en appuyant sur Cmd + Entrée, tous les clips sont lus en même temps.
La voile est animée en boucle, dans un clip avec son propre scénario, et semble claquer au vent.
J'espère que vous avez apprécié ces vidéos d'initiation à Adobe Animate.
Je m'appelle Mark et j'espère vous retrouver très bientôt.
Merci de votre attention et à vous maintenant les joies de l'animation !
♪ « Keep on moving, don't stop go » ♪ ♪ « Keep on moving… » ♪
