Share
La clé de l'animation, comme beaucoup d'autres choses, est une approche logique et un bon déroulement du travail. Dans ce tutoriel, Hasier vous guide dans la planification, l’esquisse et le perfectionnement de votre animation pour vous donner le mouvement que vous recherchez..
Au cours de ce tutoriel, nous allons créer l'animation suivante:
Ce tutoriel sera divisé en 4 parties. Dans chaque partie, nous allons passer en revue les différentes étapes de la création d’une animation du début à la fin. Ce sont les parties du didacticiel et leur contenu:
Dans la première partie de ce didacticiel, nous allons passer en revue les éléments à connaître avant de commencer à animer. Ne négligez pas ces choses; planifier votre animation avant de sauter directement dans Flash vous fera gagner beaucoup de temps par la suite.
La première étape de la création d’une animation consiste bien entendu à décider de ce que vous souhaitez animer. Dans ce tutoriel, nous animerons ceci:
C'est un simple personnage d'espionnage que j'ai inventé il y a quelque temps. Parce qu'il est si simple, il est facile de l'animer. Si c'est votre première tentative d'animation, je vous suggère d'essayer mon espion avant de passer à des personnages plus complexes..
Alors, prenez un morceau de papier et dessinez l'espion à quelques reprises. Une animation image par image signifie que vous devez dessiner la même chose encore et encore. Vous devriez donc être à l'aise pour dessiner votre personnage. Voici comment je le dessine:
Une fois que vous connaissez parfaitement votre personnage, il est temps de penser à lui donner vie. Les animations sont planifiées à travers images clés (aussi appelé vignettes). Dans ce tutoriel, je me référerai à eux comme dessins clés afin de ne pas les confondre avec les images clés de Flash. Alors, quel est un dessin clé? Les dessins clés sont des dessins qui racontent l'histoire et définissent le mouvement dans une animation. En d’autres termes, c’est un moyen de résumer l’animation en quelques dessins. L'exemple ci-dessous montre comment une légère différence dans un dessin clé peut avoir un impact important sur l'animation finale:
Un dessin de touche doit être planifié au début et à la fin d'un mouvement et chaque fois qu'un changement de direction ou de rythme se produit dans l'animation. Alors, jetez un autre regard sur l'animation finale et dessinez les dessins clés en gardant à l'esprit ces indications. Ils devraient ressembler à ceci:
Après avoir dessiné votre personnage et planifié l'animation, il est temps de passer à Flash..
Commencez par ouvrir un nouveau document Flash. La valeur par défaut de 12 images par seconde est trop faible pour une animation. Pour ce didacticiel, nous utiliserons donc 15 images par seconde..
Nommez le calque actuel "BG". Sélectionnez une couleur claire et dessinez l’arrière-plan de base de la scène, dans notre cas, une pièce. Ne dessinez rien d'extraordinaire, juste les éléments nécessaires pour créer l'animation approximative: les murs, le sol et la fenêtre.
Pour dessiner dans Flash, je choisis généralement un pinceau de grande taille avec une sensibilité à la pression et ramène le lissage à environ 10. Cela me donne plus de liberté pour dessiner, car je peux faire varier l'épaisseur du trait autant que je veux et avoir plus de contrôle sur les contours nets. angles en raison du faible lissage. Je vous suggère d'utiliser les mêmes paramètres que moi. Ne vous inquiétez pas si vos coups sont irréguliers. nous pouvons résoudre ce problème à la fin.
Nous allons maintenant recréer les dessins clés que nous avons réalisés précédemment. Créez un nouveau calque et nommez-le comme "Espion". Dans le premier cadre, dessinez le premier dessin de touche que vous aviez prévu auparavant. Encore une fois, dessinez simplement les formes de base. Ça devrait ressembler a quelque chose comme ca:
Insérez une image clé vierge (F7) dans le calque "Spy". Allumez la pelure d'oignon afin que vous puissiez voir l'image précédente. Avec le premier dessin comme guide, dessinez le deuxième dessin clé.
Répétez le même processus pour le reste des dessins clés. Lorsque vous avez terminé, vous devez avoir cinq images clés avec cinq dessins de clé différents..
Nous arrivons maintenant à l'étape la plus importante (et probablement la plus difficile) de la création d'une animation: timing; calculer le temps entre nos dessins clés. Ce que nous faisons maintenant déterminera toute l’animation. Il est donc important que cela soit fait correctement..
Sélectionnez la première image du calque "Espion" et ajoutez quelques images clés vierges (F7) entre les premier et deuxième dessins clés. Faites la même chose avec les images clés restantes. Voici à quoi devrait ressembler votre chronologie:
Testez le film (Ctrl + Entrée). Comme vous pouvez le constater, le timing est mauvais, alors retournez dans le fichier .fla pour le réparer. Si le délai entre deux dessins de clé est trop court, ajoutez davantage d'images clés vierges entre eux. si le minutage est trop long, supprimez des images clés.
Après l'avoir légèrement modifié, testez le film pour voir s'il a l'air meilleur qu'avant. Si cela ne semble toujours pas correct, appliquez d'autres modifications. Il est difficile d'imaginer l'animation avec seulement cinq images clés, alors ne vous inquiétez pas si elle n'est pas parfaite à ce stade. nous pouvons modifier le timing plus tard. Jusqu'ici, voici mon résultat:
Le coeur de notre animation est maintenant terminé, mais il reste encore beaucoup de travail à faire. Tout d'abord, nous devons ajouter plus d'images clés pour que l'animation paraisse fluide. Les dessins qui apparaissent entre les dessins clés pour compléter l'animation sont nommés, de manière appropriée, entre deux. Dessiner entre les deux est assez facile, car nous avons déjà effectué la plupart du travail lorsque nous avons fait les dessins clés..
Sélectionnez une image clé entre les deux premiers dessins clés et activez la pelure d'oignon. Avec deux dessins comme référence, tracez l’espion à mi-chemin entre les dessins clés dans le cadre actuel..
Répétez le processus. Dessinez une nouvelle image clé entre chacun des dessins clés. Vous devriez avoir neuf images clés.
Testez le film. Si le timing ne vous convient toujours pas, le moment est venu de le changer. Comme je l'ai déjà dit, le timing est la partie la plus importante de l'animation, alors prenez votre temps pour vous assurer qu'il est correct. Après avoir peaufiné les images clés, l'animation devrait ressembler à ceci:
Il y a peu de choses à expliquer. Continuez à ajouter des entrelacs entre entrelacés pour lisser l'animation jusqu'à ce qu'il ne reste plus d'images clés vides. Testez votre film pour voir si quelque chose doit être corrigé. Ce fut mon résultat jusqu'à ce stade:
L'animation approximative est maintenant terminée. Dans cette partie du tutoriel, nous allons travailler sur la version propre de notre personnage..
Créez un nouveau dossier et nommez-le "brut". Transformez les couches "BG" et "Espion" en couches guides afin qu'elles ne soient pas affichées lors de la publication du film. Verrouillez les deux calques et mettez-les dans le dossier. Créez un nouveau calque et nommez-le à nouveau "Spy". Dans cette couche, nous allons dessiner la version épurée de notre personnage.
Modifiez la couleur de remplissage en noir et définissez les paramètres du pinceau comme décrit à l'étape 4. Supprimez maintenant les dessins que vous avez effectués au début. Utilisez-les comme référence pour attirer l'espion sur le dessin approximatif.
Faites la même chose pour toutes les images clés. Vous pouvez utiliser la peau d'oignon pour utiliser l'image précédente comme référence..
Les choses ont vraiment l'air bien plus propres, mais elles ne sont toujours pas assez propres. Regardez de près les dessins propres. Vous remarquerez que les coups sont déchiquetés. Nous pourrions les laisser tels quels pour cette animation, mais si nous travaillions sur un projet plus vaste, nous devions les optimiser. L’optimisation est une méthode utilisée par Flash pour affiner une forme en réduisant le nombre de courbes nécessaires à sa définition..
Pour optimiser les traits dans l'animation, sélectionnez les dessins dans toutes les images (avec l'option "Modifier plusieurs images" activée), puis cliquez sur Modifier> Forme> Optimiser (Crt + Alt + Shift + C). La boîte de dialogue Optimiser les courbes s'ouvrira. Vous pouvez ajuster la quantité de lissage avec le curseur. Cochez la case "Utiliser plusieurs passes". Cela lissera la forme encore et encore jusqu'à ce qu'aucun lissage ne puisse être obtenu sans affecter la forme. Lorsque vous cliquez sur OK, un message s'affiche indiquant le pourcentage de réduction de la courbe..
Désactivez "Modifier plusieurs images" et examinez vos dessins. Ils sont beaucoup plus lisses maintenant, mais il est probable que l'optimisation ait modifié (au moins légèrement) les formes. Vous pouvez les éditer avec l'outil Free Transform Tool (Q). Assurez-vous que tous les dessins sont fermés et n'ont pas de lacunes.
Il est maintenant temps de donner de la couleur à l'espion. Alors prenez le seau de peinture (K) et remplissez-le! J'ai utilisé # 000033 pour la tête, # 010243 pour le corps et #FFFFFF pour les yeux.
Remarque: Si vous cliquez avec le pot de peinture à l'intérieur du dessin et que rien ne se produit, cela signifie que votre dessin a un espace quelque part. Trouvez-le et fermez-le avec l'outil Free Transform.
L'animation est terminée, mais il reste quelques améliorations à faire. Ce que j’explique ici ne sont que des suggestions que vous n’avez pas à suivre mot à mot, et je ne passerai donc pas beaucoup de temps à chacune d’elles..
Maintenant que nous avons coloré l'espion, nous avons besoin d'un fond tout aussi coloré. Cependant, le but de ce tutoriel était de montrer le processus d'animation, de sorte que la création de l'arrière-plan dépasse le cadre de ce tutoriel. Mais pour ceux qui sont curieux, voici un bref résumé de la fabrication:
J'ai recréé la pièce dans Swift3D, un programme conçu pour incorporer des éléments 3D dans Flash. J'ai exporté la scène en tant que vecteurs et je l'ai ouverte en Flash. Enfin, j'ai modifié la couleur et ajouté une lueur jaune à la lampe..
Vous pouvez créer votre arrière-plan directement dans Flash ou de toute autre manière. Si vous voulez utiliser le mien, vous le trouverez dans les fichiers source.
Comme vous l'avez probablement déjà remarqué, il existe un petit problème que nous devons résoudre. Parce que la couche "Spy" est au-dessus de la couche "BG", nous pouvons voir l'espion quand il est supposé être derrière le mur dans les premières images. Pour couvrir la partie de son corps qui ne devrait pas être affichée, nous utilisons un masque de calque.
Créez un nouveau calque, transformez-le en calque de masque et nommez-le correctement "Masque". Rendre le calque "Spy" masqué. Si vous avez suivi ce didacticiel, vous connaissez probablement suffisamment Flash pour maîtriser les masques de calque, mais je vais les passer rapidement en revue:
Une couche de masque contient une forme remplie qui permet à une couche liée (masquée) d'être vue à travers elle; toutes les zones vides du calque de masque deviennent invisibles dans le calque masqué.
Notre masque doit couvrir tout l’espion (dans tous les cadres où une partie de son corps doit être cachée) à l’exception de la partie qui dépasse de la fenêtre. Ils disent qu'une image vaut mille mots, alors jetez un oeil ci-dessous:
Remarque: Si vous verrouillez le calque de masque et le calque masqué, vous verrez l'effet du masque..
La dernière touche que j'ai ajoutée à l'animation était une ombre douce sous l'espion. Créez un cercle noir dans un nouveau calque. Transformez-le pour qu'il ressemble à l'ombre de l'espion.
Convertissez-le en clip et animez-le pour qu'il suive le mur et le sol sous l'espion (comme je l'ai déjà dit, je n'entrerai pas dans les détails; vous devriez pouvoir le faire vous-même). L'ombre animée devrait ressembler à ceci:
Pour que l'ombre ressemble à une ombre, réduisez son alpha à 25% dans l'inspecteur des propriétés du clip. Pour le rendre doux, ajoutez un filtre de flou dans l'onglet Filtres avec les paramètres indiqués ci-dessous..
Toutes nos félicitations! Testez votre film, asseyez-vous et détendez-vous. Vous pouvez maintenant vous appeler un animateur. Mais gardez à l'esprit que ce n'est que le début! Regarde autour de toi! Il y a une infinité de choses à animer! Créez vos propres personnages, explorez de nouvelles techniques, développez votre propre style et surtout: amusez-vous à animer!
Il y a beaucoup de livres sur l'animation traditionnelle que je vous suggère de regarder. Trois livres qui se démarquent sont:
Si vous êtes intéressé par l'animation Flash, rendez-vous sur biteycastle.com et découvrez les animations primées d'Adam Phillips, ainsi que sa Bitey Castle Academy..
Accentsconagua