Les interpolations de mouvement : Partie 1
Sorry, this page is not available
Broken link?
このURLは存在しません。
日本語のホームページにお戻りください。
他のサイトのリンクでこのページにたどりついた場合はそのサイトの
ウェブマスターにリンクが壊れている旨をお伝えください。
Error returned: 404
You may wish to try one of the following links:
Sorry, this page is not available
Broken link?
このURLは存在しません。
日本語のホームページにお戻りください。
他のサイトのリンクでこのページにたどりついた場合はそのサイトの
ウェブマスターにリンクが壊れている旨をお伝えください。
Error returned: 404
You may wish to try one of the following links:
Réalisez des effets complexes en créant des trajectoires de mouvement personnalisées, en ajoutant et en modifiant les propriétés d'images-clés.
This content requires Flash
Conditions requises
Pour suivre ce tutoriel, vous avez besoin des logiciels et des fichiers suivants:
Adobe Flash Professional CS4
Fichiers d'exemple
lrvid4054_fl_fr.zip (ZIP, 495K)
Connaissances à avoir
Niveau intermédiaire pour l’animation dans Flash
Création d’une interpolation de mouvement (partie 1)
Adobe® Flash® CS4 a optimisé la façon de créer des animations et intègre un nouvel Editeur de mouvement. Ce tutoriel vous montre comment utiliser cette nouvelle fonctionnalité de Flash pour créer une animation utilisable sur Internet, périphérique mobile, cinéma etc.
Création d’une interpolation de mouvement
Les versions antérieures de Flash nécessitaient pour la création d’interpolations de mouvement plusieurs étapes qui étaient essentiellement basées sur le scénario. Avec le nouveau modèle d’animation, qui est orienté objet, la réalisation d’interpolations de mouvement est devenue intuitive et rationnelle. Pour créer une interpolation de mouvement dans Flash :
- Faites un clic droit sur un objet de la scène. Un menu contextuel avec la commande Création d’interpolation de mouvement apparait.
Remarque: Une interpolation de mouvement nécessite obligatoirement un symbole.
- Sélectionnez Créer une d’interpolation de mouvement. Flash insère automatiquement suffisamment d’images dans le scénario pour créer une animation d’une seconde. Le nombre exact est dépendant de votre cadence.
Image 1: Création d’une interpolation de mouvement en utilisant le menu contextuel
- Pour vérifier la cadence, choisissez Modifier > Document. La nouvelle fenêtre de dialogue Document apparaît. Vous pouvez modifier la cadence depuis cette fenêtre.
Remarque: La cadence par défaut est de 24 images par secondes (ips). Dans les versions précédentes de Flash, la valeur par défaut était de 12.
Animer un objet
Faire une animation est simple dans Flash CS4. Pour faire une animation de base :
- Glissez votre objet à travers la scène. Vous avez réalisé une animation avec succès. Vous avez créé le tracé du chemin, une ligne courbe définie par 2 points, définissant le parcours de l’objet. Ce chemin est entièrement modifiable.
- Choisissez l’outil de Sélection dans la palette d’outils.
Image 2: L’outil de Sélection
- Cliquez sur le tracé, et tirez-le de haut en bas. En faisant ainsi, vous courbez et rajoutez des points de contrôle au chemin.
Remarque: Si vous observez le scénario, vous verrez que l’objet de la scène suit le chemin du tracé. Vous remarquerez que Flash a automatiquement inséré un point noir au milieu de la dernière image de votre animation. Ce point noir représente une propriété d’image-clé, qui est insérée quand une propriété de l’objet est modifiée, dans ce cas, sa position.
- Positionnez la tête de lecture du scénario au milieu de l’animation.
Image 3: Positionnement de la tête de lecture au milieu de l’interpolation
- Sélectionnez l’outil de transformation libre de la palette d’outils.
- Cliquez sur l’objet de la scène et réduisez-le en ramenant vers le centre de l’objet un des points de contrôle situé sur un angle.
Observer une propriété d’image-clé
- Pour voir une propriété d’image-clé, cliquez l’outil de Sélection de la palette d’outil.
- Faites un clic droit sur l’animation du scénario. Un menu contextuel apparaît.
- Choisissez Afficher les images-clés. Par défaut, Flash affiche toutes les propriétés d’image-clé du scénario, mais depuis ce menu, vous pouvez sélectionner Aucun, et les images-clés disparaîtront. Une autre option est de sélectionner juste une ou deux des propriétés d’image-clé à voir. Rappelez-vous que le réglage par défaut Tous est la meilleure option.
Image 4: Activation de la propriété Position
Modifier des propriétés
Dans Flash CS4, il est possible de modifier un grand nombre de propriétés d’animation telles que rajouter un effet de couleur, changer la position d’un objet, remplacer un objet, et modifier la durée d’une animation
Appliquer un effet de couleur
En plus de la position et de l’échelle, vous pouvez également interpoler la couleur dans Flash. Pour animer la couleur d’un objet :
- Sélectionnez la dernière image de l’animation, puis cliquez l’objet sur la scène. Allez dans le panneau Propriétés.
- Pour appliquer un effet de couleur, ajustez la teinte. Glissez le curseur Teinte jusqu’à la valeur de 100%.
Remarque: N’importe quelle valeur inférieure à 100% produit un mélange entre la couleur initiale de l’objet et la valeur de la teinte sélectionnée.
Image 5: Réglage de la teinte en utilisant le curseur Teinte
- Cliquez sur le contrôleur de couleur à côté du menu Style. La pipette de couleur apparaît. Cliquez pour sélectionner une couleur de teinte.
Remarque: Ce changement affecte seulement l’apparence du symbole à la dernière image-clé.
Image 6: Utilisation de la pipette de couleur pour sélectionner la couleur de teinte
- Activez le scénario. L’objet de la scène change de couleur en même temps qu’il évolue de son point de départ vers son point d’arrivée.
Modifier la position d’un objet
Vous pouvez ajuster la position d’un objet à n’importe quelle image en utilisant la tête de lecture. Pour changer la position d’un objet :
- Allez dans le scénario et bougez la tête de lecture à n’importe quel endroit de votre animation. Sélectionnez le point correspondant sur le tracé du chemin et glissez-le vers le haut ou le bas. Répétez l’opération autant de fois que vous le désirez. En activant le scénario, l’objet suit le nouveau chemin.
Image 7: Activation du scénario pour vérifier l’animation
- Pour peaufiner le chemin, cliquez sur l’outil de Sous sélection, situé directement sous l’outil de Sélection de la palette d’outils comme montré sur l’image n°2.
- Cliquez sur un point d’ancrage du chemin. Des poignées de Bézier apparaissent. Vous pouvez tirer sur ces poignées pour créer des courbes plus précises.
Image 8: Ajustements de points le long d’un tracé en utilisant les poignées de Bézier
Changement de la durée d’une animation
Une autre puissante nouvelle fonctionnalité dans Flash CS4 est la possibilité de modifier la durée d’une animation. Pour changer la durée d’une animation :
- Etirez l’extrémité droite de l’animation, et arrêtez au point désigné dans le scénario. L’animation s’étend pour s’adapter à la nouvelle durée. Vos images-clés se répartissent pour s’adapter à la nouvelle durée.
Image 9: Etirement de l’extrémité de l’animation pour en changer la durée
Permutation d’objet
Si vous avez plusieurs symboles dans la Bibliothèque, vous pouvez permuter un objet de la scène sans pour autant perdre votre animation. Pour permuter un objet :
- Cliquez sur l’objet sur la scène et pressez sur la touche Suppr.
- Sélectionnez le calque du scénario contenant l’animation et activez le panneau Bibliothèque. Le panneau Bibliothèque se trouve à côté du panneau Propriétés dans l’espace par défaut de Flash.
Image 10: Le panneau Bibliothèque
- Positionnez un nouveau symbole de la Bibliothèque vers la scène. Le nouveau symbole apparaît sur la scène et hérite des propriétés d’animation existantes, images-clés, durée..
Astuce: Une autre façon de remplacer un objet sur la scène est de glisser le nouveau symbole directement de la Bibliothèque vers le scénario (sans supprimer l’objet courant). Flash vous demandera de remplacer l’objet d’interpolation cible existant. Cliquez sur OK et le nouvel objet apparaît sur la scène.
L’éditeur de mouvement
Une nouvelle fonctionnalité de Flash CS4 est l’éditeur de mouvement. Pour avoir une bonne visibilité de l’éditeur de mouvement :
- Réduisez les panneaux Propriétés et Bibliothèque.
- Cliquez sur le bord haut du panneau Editeur de mouvement. Etirez le bord supérieur jusqu’à ce que le panneau Editeur de mouvement remplisse le bas de la fenêtre de Flash CS4. L’éditeur de mouvement affiche la liste des propriétés de l’objet et toutes les modifications que vous avez appliquées ainsi que les images-clés.
Remarque: Vous remarquerez que le panneau contient son propre scénario dans la zone graphique.
Image 11: Le panneau Editeur de mouvement
- Cliquez sur le triangle situé à côté d’un type de propriété. Cliquez dessus de nouveau pour réduire la visualisation des propriétés.
Image 12: Déroulement des propriétés d’accélération
Remarque: La vue étendue vous permet d’ajuster les propriétés dynamiquement et affiche une courbe détaillée montrant les valeurs des propriétés évoluant en fonction de l’animation. Par exemple, la position sur l’axe horizontal d’un objet serait affichée en pixels, comme montré sur l’image n°13.
Image 13: Une courbe de l’éditeur de mouvement
- Pour changer la hauteur d’une propriété étendue de l’éditeur de mouvement, activez la valeur soulignée près de l’icône de taille de la courbe dans le coin inférieur gauche du panneau.
- Pour étendre uniquement une ligne de propriété, cliquez sur une zone vide à l’intérieur de la ligne ou activez la valeur soulignée près de l’icône d’agrandissement de la courbe dans le bas du panneau.
- Pour définir le nombre d’images visibles, activez la valeur soulignée près de l’icône du nombre d’images dans le bas du panneau. Vous pouvez également utiliser l’éditeur de mouvement pour peaufiner vos animations. Pour modifier les propriétés de l’éditeur de mouvement, agrandissez une propriété et activez les images-clés depuis la courbe. Par exemple, si vous modifiez la propriété d’image-clé mouvement de base vers le haut ou vers le bas sur la courbe, vous changez la position du point de contrôle correspondant du chemin sur la scène.
- Vous pouvez également faire un clic droit sur une propriété de la courbe et choisir Copier la courbe. Vous pouvez alors faire un clic droit sur une autre propriété, comme Inclinaison, et coller la courbe dans cette propriété.
Image 14: Copie d’une courbe depuis l’éditeur de mouvement
Appliquer des accélérations dans l’éditeur de mouvement
L’éditeur de mouvement vous permet également d’appliquer des accélérations à une ou plusieurs propriétés de votre animation. L’accélération est une technique consistant à diminuer ou augmenter la vitesse dans une animation, pour que le mouvement paraisse plus réaliste. Quand vous accélérez, la vitesse commence doucement puis augmente. La décélération est le contraire, la vitesse commence normalement puis décroît.
- Pour créer une accélération personnalisée, et pour l’appliquer à la totalité de l’animation, cliquez sur le signe Plus dans la rubrique Accélération pour accéder au menu contextuel.
Image 15: Les accélérations disponibles dans l’éditeur de mouvement
- Choisissez Personnaliser dans le bas du menu contextuel. Une ligne Personnaliser apparaît dans l’éditeur de mouvement.
Remarque: En plus de permettre de créer des accélérations personnalisées, ce menu contient également un certain nombre d’accélérations prédéfinies.
- Cliquez sur Accélération personnalisée pour agrandir la ligne.
- Pour que votre objet accélère au début de l’animation et décélère à la fin, commencer par choisir le point de départ sur la courbe d’accélération de l’éditeur de mouvement. Tirez vers le bas. Recommencez la procédure à l’extrémité, cette fois en tirant vers le haut. Vous obtenez une courbe en S.
- Pour appliquez l’accélération à toutes les propriétés de base de l’animation, choisissez Personnalisée depuis le menu Accélération depuis la ligne mouvement de base.
Image 16: Rajout d’une accélération personnalisée
Pour aller plus loin…
- Flash CS4 Assistance et Support
- Apprenez Flash CS4
- Création d’une interpolation de mouvement (partie 2), par Birnou Sébarte
- Les présélections de mouvement, par Birnou Sébarte
- Utilisation de l’Editeur de mouvement, par Birnou Sébarte
- video2brain.fr
Cette oeuvre est placée sous la licence suivante : Creative Commons Paternité-Pas d'Utilisation Commerciale-Partage des Conditions Initiales à l'Identique 3.0 Unported
A propos des auteurs
Sorry, this page is not available
Broken link?
このURLは存在しません。
日本語のホームページにお戻りください。
他のサイトのリンクでこのページにたどりついた場合はそのサイトの
ウェブマスターにリンクが壊れている旨をお伝えください。
Error returned: 404
You may wish to try one of the following links:
Sorry, this page is not available
Broken link?
このURLは存在しません。
日本語のホームページにお戻りください。
他のサイトのリンクでこのページにたどりついた場合はそのサイトの
ウェブマスターにリンクが壊れている旨をお伝えください。
Error returned: 404
You may wish to try one of the following links:
