Share
Flash CS4 est arrivé avec de gros changements et des fonctionnalités qui nous émerveillent même après la dernière version de Flash CS5. Flash a maintenant la possibilité de travailler avec des objets dans un espace 3D directement dans l'environnement de travail.
Bien que ce soit toujours une fonctionnalité de base comparée à ce que vous pouvez faire avec la 3D dans les classes ActionScript, cet outil ouvre la porte aux concepteurs et aux animateurs qui ne connaissent pas grand chose au code. Cela leur permet de commencer à déplacer leurs objets dans un espace 3D sans avoir à utiliser d'anciennes méthodes (telles que l'importation d'animation 3D dans des images de séquence, etc.).
Parallèlement à l'outil 3D, Flash a changé la façon dont nous comprenons l'interpolation de mouvement en ajoutant le nouveau style d'interpolation de mouvement, qui s'apparente davantage à la clé automatique d'animation dans After Effects. Parallèlement aux modifications de l'interpolation de mouvement, Flash est fourni avec l'éditeur de mouvement. Ce panneau présente de nombreuses fonctionnalités et fonctionnalités qui permettent à l'animateur de mieux contrôler l'animation dans Flash à l'aide de courbes d'animation..
Le panneau Editeur de mouvement améliore non seulement l'animation en offrant davantage d'options via le contrôle des courbes, mais également le contrôle de la facilitation de l'animation, ce qui lui confère un aspect plus réaliste. Le concept d'accélération est connu dans de nombreuses applications d'animation telles que After Effects, mais il était auparavant très basique et limité à une modification de la valeur d'accélération de 100 à -100. Les nouvelles fonctions d'accélération vous permettent de contrôler davantage l'animation, comme nous le verrons dans les étapes ci-dessous..
Dans ce didacticiel, nous allons fusionner les fonctionnalités 3D et d'accélération en créant une animation 3D dans Flash et en appliquant les courbes d'accélération..
Jetons un coup d'œil au résultat final sur lequel nous allons travailler:
La première partie de notre didacticiel consiste à créer la scène du dessin animé pour une pièce avec une porte..
Ouvrez un nouveau document Flash de 600px X 450px et commencez à dessiner les contours de la pièce illustrés dans la figure ci-dessous..
Notez que l'outil 3D n'est disponible que lorsque vous avez défini les paramètres de publication de document pour ActionScript 3 et Flash Player 10 ou version ultérieure. De plus, il ne peut être appliqué qu'aux symboles de clip. Vous devez vous assurer que vos paramètres de publication de fichiers (trouvés dans Fichier> Paramètres de publication, étonnamment) sont définis sur Action Script 3 et Flash Player 10 ou supérieur.
Découpez la zone de la porte et placez-la sur un nouveau calque pour pouvoir la contrôler à l'aide des outils 3D..
Ajoutons maintenant quelques détails à l'arrière-plan pour lui donner un véritable aspect de dessin animé. Nous allons également ajouter des ombres et des textures au sol et à la porte.
Convertissez le symbole de la porte en clip et donnez-lui le nom "Porte".
La ressource de navigation 3D comprend quatre cycles. Glisser sur chaque cycle vous permet de faire pivoter le symbole dans l’une des directions suivantes:
Pendant que le symbole de la porte est sélectionné, choisissez l'outil 3D. Les cycles de ressources 3D apparaissent au milieu du symbole de clip.
Cliquez sur le point central des cycles 3D et faites glisser la ressource de navigation vers le centre à droite de la porte pour en faire le point central de rotation de la porte. Le look final pour le fond devrait être comme ci-dessous.
Dans les étapes ci-dessus, nous avons préparé l'arrière-plan du dessin animé pour l'animation 3D par interpolation de mouvement. Dans cette animation, nous allons animer l'ouverture et la fermeture de la porte à l'aide de l'outil 3D. Faites glisser l'indicateur de scénario sur la première image du panneau Montage pour lancer l'animation..
Cliquez sur l'outil Rotation 3D et cliquez sur le symbole de la porte. Notez que l'actif de navigation 3D apparaît sur le côté droit de l'objet..
Cliquez sur le cycle vert et faites glisser pour ouvrir la porte dans la direction à l'extérieur de la pièce, comme indiqué dans la figure ci-dessous..
Déplacez l'indicateur de la timeline sur l'image 50. Utilisez ensuite l'outil Rotation 3D pour faire pivoter la porte de l'autre côté de la pièce, comme indiqué dans la figure ci-dessous..
Nous avons maintenant créé l'animation 3D pour la porte sur la scène Flash. Nous allons ensuite utiliser l'éditeur de mouvement pour créer des effets d'animation plus réalistes à l'aide des courbes Accélération du panneau de l'éditeur de mouvement. Bien que cette fonctionnalité d'accélération améliorée ait été ajoutée à Flash CS4 et aux versions plus récentes, les anciennes versions de Flash comportaient une fonctionnalité d'accélération simplifiée via la valeur Accélération du panneau des propriétés. Vous pouvez toujours trouver cette valeur lorsque vous cliquez n'importe où dans l'interpolation en mouvement, mais cette méthode n'a jamais donné beaucoup d'options autres que la détente progressive..
Le panneau de l'éditeur de mouvement se compose de courbes d'animation qui contrôlent les propriétés de l'objet via une animation sur une période donnée. Chaque courbe représente une propriété spécifique pour l'objet et est responsable de son évolution dans le temps et le niveau du changement. Par exemple, la courbe en X représente l'animation de l'objet sur l'axe des X. Cette valeur devient active lorsque vous créez une interpolation de mouvement qui lui est associée..
Les courbes d'accélération du panneau Mouvement sont similaires au reste des courbes d'animation de l'éditeur de mouvements, car elles vous permettent de mieux contrôler le mouvement réaliste des animations..
Il existe deux méthodes principales pour créer la courbe d’assouplissement. La première consiste à utiliser le menu déroulant des préréglages Ease, qui comprend des options d’accélération immédiate. La deuxième méthode consiste à créer la courbe d'accélération personnalisée. Dans ce tutoriel, nous allons essayer les deux méthodes.
Avant de commencer, voici un bref aperçu des courbes d’atténuation dans le panneau Motion..
Dans la partie Accélération du panneau de l'éditeur de mouvement, vous pouvez ajouter / supprimer et modifier les courbes d'accélération en sélectionnant simplement la courbe souhaitée. Avant de voir comment appliquer l'effet d'accélération à l'animation 3D, nous verrons brièvement comment fonctionne la courbe Accélération dans le panneau de l'éditeur de mouvement..
La courbe d'accélération est une méthode complète permettant de contrôler l'accélération de l'animation lors de l'interpolation de mouvement afin de créer une animation plus réaliste. il montre la valeur d'accélération ou de décélération de l'animation à travers le temps.
Le panneau Editeur de mouvement vous permet de créer de nombreuses courbes d’atténuation, d’affecter différentes courbes à chaque propriété de mouvement et d’appliquer différentes atténuations à chaque fonction. Dans les étapes suivantes, nous commencerons par appliquer un préréglage d'accélération à l'animation d'ouverture de porte..
Sélectionnez le clip ou cliquez n'importe où sur l'interpolation de mouvement, accédez au panneau de l'éditeur de mouvement et accédez à la section Facilité..
Cliquez sur l'icône Plus dans la section Facilité pour faciliter la navigation dans les préréglages d'accélération déroulants. Choisissez l'assouplissement du printemps.
Accédez à la courbe de rotation en Y qui affiche l'animation de la porte. Dans la liste déroulante Accélération, choisissez Printemps. Appuyez sur Ctrl + Entrée pour tester l'animation..
Vous remarquerez que l'animation de la porte est passée d'une simple animation de deux images clés à une animation complexe avec effet de ressort. Vous pouvez également ajouter d'autres préréglages d'accélération et les essayer pour voir comment cela affecte l'animation de la porte. L'animation devrait être comme suit:
Dans les étapes suivantes, nous allons créer une courbe d'accélération personnalisée et l'appliquer à l'animation d'ouverture de la porte. Nous examinerons de plus près le fonctionnement de la courbe et découvrirons comment l'utiliser..
Commençons par supprimer l’accélération précédente en sélectionnant Aucune facilité dans la liste déroulante d’assouplissement ou en cliquant sur l’icône Moins dans la section Accélération, puis en choisissant l’assouplissement que vous souhaitez supprimer. Dans cet exemple, nous allons supprimer l'assouplissement Spring..
Cliquez sur l'icône plus en regard de la section Facilité, puis choisissez Personnaliser dans la liste déroulante. Cela créera une nouvelle courbe d'accélération personnalisée avec une courbe verte pour indiquer qu'elle est modifiable. Si vous créez des courbes d'accélération personnalisées supplémentaires, chaque couleur est associée à une couleur unique..
La courbe d'aisance fonctionne de la même manière que les chemins de dessin. Vous pouvez créer des points dessus; ces points représentent les images clés ou les points indiquant les modifications apportées à l'animation d'accélération. Chaque point a deux poignées pour modifier l'apparence des parties droite et gauche de la courbe. Maintenant, nous allons créer des points sur la courbe d’assouplissement qui affecteront l’animation de la porte:
Cliquez avec le bouton droit sur la courbe d'accélération et créez des images clés sur les images 10, 20, 30 et 40.
La courbe d'accélération est comprise entre zéro et 100. Lorsque la courbe se rapproche de la valeur zéro, l'animation se déplace vers la première image et son déplacement à la valeur 100 signifie qu'elle se déplace jusqu'à la fin de l'animation. Notez également que la courbe de glissement difficile signifie une accélération plus rapide et que le glissement lent signifie une accélération lente de l’animation..
Nous modifierons la position et la courbe des points pour affecter l'accélération de l'animation. Sélectionnez le premier point et déplacez-le sur la valeur d'accélération 100. Cela signifie que l'animation atteindra sa fin à cet endroit et que le glissement difficile signifie que l'animation s'accélérera rapidement..
Déplacez le deuxième point à la valeur zéro, le troisième point à la valeur 50 et le quatrième point à la valeur 50.
Utilisez les gestionnaires de points sur les deux derniers points pour créer un glissement incurvé et lisse qui ralentira l'animation de la porte à la fin de l'animation. La courbe d’assouplissement finale devrait ressembler à la figure ci-dessous:
Appuyez sur Ctrl + Entrée pour tester l'animation et voir comment la nouvelle courbe d'accélération affecte l'animation de la porte. L'animation finale de l'accélération personnalisée doit être la suivante:
C'est la fin du tutoriel. Il visait à vous aider à comprendre comment utiliser les outils 3D de Flash pour créer une animation dans un espace 3D et à appliquer les fonctionnalités d'accélération complètes du panneau Mouvement à l'aide des courbes d'accélération..
Comprendre l'assouplissement des courbes peut vous aider à créer plus facilement et plus efficacement une animation complexe et réaliste en appliquant des courbes d'assouplissement à l'animation au lieu de créer de nombreuses images clés dans l'interpolation de mouvement..
.
Accentsconagua