Grâce aux leçons précédentes, nous avons appris à créer des animations à l'aide de transitions d'images clés et de calques indépendants. Ils peuvent être utilisés pour créer des animations simples sur un seul objet et ont longtemps été le seul moyen de créer des animations dans Photoshop. Aujourd'hui, nous allons apprendre une nouvelle façon d'animer en utilisant la timeline . La méthode de la chronologie est largement utilisée dans de nombreux logiciels de production cinématographique et télévisuelle, tels que Premiere, AfterEffects, etc., y compris Flash, qui utilise également cette méthode.
Il existe de nombreuses opérations dans l'animation de transition d'images clés que nous n'avons pas mentionnées, car elles n'ont rien à voir avec la méthode de la chronologie, et la chronologie sera notre principale méthode de création d'animations à l'avenir, nous les ignorerons donc.
Pour unifier les matériaux, veuillez cliquer ici pour télécharger le fichier de matériau , décompressez le fichier PSD et ouvrez-le dans Photoshop. Il s'agit d'un fichier sans paramètres de cadre (vous pouvez également utiliser le vôtre à la place). Comme indiqué ci-dessous. En raison de l'utilisation de calques de texte, l'option de remplacement peut apparaître en raison de polices manquantes après son ouverture. Choisissez simplement de la remplacer par la police par défaut. Bien que la police par défaut ne soit pas assez belle, l'effet pédagogique est le même.
Le fichier PSD contient 3 calques (sans compter le calque d’arrière-plan), dont deux sont des calques de texte et un est un calque de forme vectorielle. Si vous ne savez pas ce qu’est un calque de forme vectorielle, cela signifie que vous ne maîtrisez pas bien les bases.
Cliquez dans le coin inférieur droit de la palette Animation
pour passer en mode chronologie, comme indiqué dans la figure ci-dessous. Les lecteurs attentifs remarqueront que le nom de la palette a changé pour "Animation (Timeline)", alors que le précédent était "Animation (Frame)". Le bouton dans le coin inférieur droit devient
, en cliquant, vous passerez au mode cadre d'origine.
Il convient de noter que ces deux méthodes sont incompatibles entre elles, ne changez donc pas pendant le processus de production. Si vous changez par erreur, vous pouvez utiliser la commande d'annulation [CTRL+ALT+Z] pour le restaurer.
Dans la chronologie, nous voyons des noms de calques similaires à ceux de la palette des calques, et leurs positions hautes et basses sont également les mêmes que celles de la palette des calques. Cliquer sur la flèche sur le côté gauche du calque développera tous les éléments d'animation du calque, c'est-à-dire les éléments pouvant être animés. Dans des couches de natures différentes, leurs éléments d'animation sont également différents. Les soi-disant propriétés différentes font référence aux calques ordinaires, aux calques ordinaires avec masques, aux calques de texte, aux calques de réglage, etc. Ce sont tous des calques de propriétés différentes. Comme le montre l'image de gauche ci-dessous, le projet d'animation après le calque de texte « Go and Stay » et le calque de forme vectorielle « Forme 1 » sont développés respectivement. Ce qu’ils ont tous en commun, c’est la position, l’opacité et le style. La différence est que le calque de texte comporte un élément de « déformation du texte » supplémentaire et que le calque de forme vectorielle comporte deux éléments supplémentaires liés au masque.
La production d'animation ne peut pas dépasser le projet d'animation du calque lui-même. Par exemple, la "déformation du texte" ne peut pas être effectuée sur le calque de forme. Cependant, certains éléments d'animation peuvent être ajoutés ultérieurement. Par exemple, après avoir ajouté un masque à un calque de texte, celui-ci aura un élément d'animation masqué.
Il y a un ensemble de nombres 0:00:00:00 dans le coin supérieur gauche de la palette, qui correspond au code temporel actuel. À partir de l'extrémité droite, il s'agit des millisecondes, des secondes, des minutes et des heures. Généralement, seules les secondes sont utilisées. Il y a également 30,00 images par seconde après le code temporel, qui est la fréquence d'images, indiquant le nombre d'images par seconde. Généralement, la valeur est un nombre entier et les fréquences d'images décimales ne sont utilisées que dans le montage cinématographique et télévisuel.
Cliquez dans le coin supérieur droit de la palette Animation Cliquez sur le bouton et sélectionnez « Paramètres du document », et les paramètres de la chronologie affichés à droite ci-dessous apparaîtront. Ici, vous pouvez spécifier la durée totale de l'animation et la fréquence d'images. Selon les paramètres par défaut, la durée totale est de 10 secondes et 30 images par seconde, donc le nombre total d'images est de 300 images. Il s'agit d'une valeur assez importante pour une animation Web. Elle occupera un grand nombre d'octets lors de sa production. n'est pas propice à la transmission réseau. Maintenant, nous modifions la durée à 5 secondes et la fréquence d'images à 5 images par seconde. Une fois confirmé, vous verrez le nouvel indicateur de fréquence d'images dans la palette d'animation.
Comme le montre l'image ci-dessous, si vous développez la palette d'animation horizontalement, vous verrez des marques temporelles telles que 01h00 et 02h00, en secondes. L'extrémité la plus à droite de la chronologie correspond à la durée totale de 5 secondes que vous venez de définir. Faites glisser le curseur pointé par la flèche rouge vers la droite pour agrandir les détails de la chronologie. La chronologie agrandie se trouve dans la zone du cadre rouge. Vous pouvez voir qu'il y a des signes comme 01f et 02f entre les secondes. C'est le cadre. Le paramètre que nous venons de définir était de 5 images par seconde, il y a donc 5 images toutes les deux secondes. Bien que nous ne voyions que le 04f maximum, il faut savoir que 05f chevauche en réalité 01h00. Par conséquent, il est exprimé par 01:00f, ce qui signifie qu’il s’agit à la fois de la première seconde et d’une image.
Notez qu'il y a une fine ligne moins visible entre les deux flèches orange. Il s'agit de l'indicateur de tampon de rendu. D'autres logiciels de montage de films et de télévision disposent également de cet indicateur, mais son rôle n'est pas très important dans Photoshop. .