Modifier un GIF ou un MP4 existant

Chargez un GIF ou un MP4, puis redimensionnez, transformez, raccourcissez, modifiez le timing et exportez l’animation avec TinyImage.

Utilisez GIF Editor dans l’onglet GIF de TinyImage pour modifier un GIF animé ou un MP4 existant sans le reconstruire à partir de calques Figma séparés.

Tutoriel vidéo : modifier des GIF animés directement dans Figma

Cette vidéo montre comment modifier, combiner, raccourcir, transformer et exporter des GIF animés avec TinyImage.

Charger un GIF ou un MP4 ​

Dans Figma Design, sélectionnez l’un des éléments suivants :

  • un calque qui contient un remplissage GIF animé ;
  • un frame qui contient un ou plusieurs calques GIF, à n’importe quel niveau d’imbrication.

Si vous ouvrez GIF Editor avec l’un de ces calques sélectionné, TinyImage le charge automatiquement. Sinon, choisissez Use selected Figma GIF layer. Vous pouvez aussi choisir Choose file from your computer pour charger un GIF ou un MP4 local.

Lorsque vous chargez un frame, TinyImage fusionne la pile de calques visibles du frame dans chaque image de l’animation. Cela comprend le contenu, les masques, les effets et les autres calques situés au-dessus ou en dessous des calques GIF imbriqués. Le frame Figma d’origine et ses calques ne sont pas modifiés.

Si le frame contient plusieurs GIF, TinyImage synchronise leurs changements d’image dans une seule timeline modifiable. Pour des raisons de stabilité, une animation de frame combinée peut durer jusqu’à deux minutes et contenir jusqu’à 500 images combinées.

Sélectionnez Reset à tout moment pour revenir au GIF chargé à l’origine.

TinyImage vous avertit avant de remplacer un GIF dont les modifications n’ont pas été exportées. Les GIF volumineux affichent aussi un avertissement de traitement. Les GIF peuvent contenir jusqu’à 2 000 images, mesurer jusqu’à 8 192 px et peser jusqu’à 100 Mo pour le fichier source.

Les fichiers MP4 peuvent durer jusqu’à 60 secondes et peser jusqu’à 100 Mo. TinyImage échantillonne la vidéo à 10 images par seconde et réduit automatiquement les dimensions des vidéos très grandes lorsque c’est nécessaire pour une retouche fiable.

Redimensionner et transformer l’animation ​

Saisissez une largeur ou une hauteur de sortie et laissez Lock ratio activé pour conserver les proportions d’origine. Sélectionnez Apply size pour redimensionner toutes les images.

Les commandes de transformation permettent de :

  • faire pivoter toutes les images de 90 degrés vers la gauche ou vers la droite ;
  • retourner toutes les images horizontalement ou verticalement ;
  • recadrer toutes les images à l’aide d’une sélection visuelle ou de valeurs X, Y, largeur et hauteur exactes.

Raccourcir le GIF et modifier son timing ​

Utilisez les poignées de la timeline pour choisir la première et la dernière image à conserver. Utilisez la liste déroulante Speed pour ralentir toute l’animation de 50 % ou 25 %, conserver son timing normal à 100 %, ou l’accélérer de 25 %, 50 % ou 100 %. TinyImage recalcule chaque image à partir de son timing d’origine, ce qui préserve les différences de timing voulues entre les images.

Activez Reverse pour inverser l’aperçu, la timeline et l’ordre des images exportées. Si vous avez déjà raccourci l’animation, TinyImage conserve les mêmes images choisies et inverse leur ordre. Pour une sortie GIF ou APNG, laissez Infinite activé pour une lecture en boucle continue. Désactivez Infinite et saisissez le nombre total de répétitions dans le champ numérique pour que l’animation soit lue un nombre de fois défini.

Configurer et exporter le résultat ​

Utilisez le menu de format à côté du bouton d’export pour télécharger l’animation modifiée au format :

  • GIF animé
  • PNG animé (APNG)
  • WebP animé
  • vidéo MP4
  • vidéo WebM

Les exports GIF et APNG comprennent une commande de boucle, les exports MP4 et WebM une commande de boucle vidéo, et le WebP animé est lu en boucle continue.

GIF Editor utilise le même curseur Quality et la même option Lossless que Create a GIF/MP4. Ces commandes s’appliquent aux exports GIF, APNG et WebP animé. Activez Lossless pour désactiver le curseur de qualité et préserver la qualité d’image, ou baissez la valeur de qualité pour réduire le poids du fichier grâce à une compression avec perte. Les formats MP4 et WebM utilisent à la place la meilleure qualité vidéo prise en charge par l’éditeur.

Pour une sortie GIF animé, activez Size Target et saisissez un poids maximal en Ko pour que TinyImage ajuste automatiquement le niveau de perte et la palette de couleurs. Lorsqu’un objectif est actif, le champ en Ko remplace les commandes manuelles Quality et masque Lossless. Si l’objectif ne peut pas être atteint, TinyImage exporte le plus petit résultat valide qu’il a trouvé : vérifiez donc le fichier enregistré avant de l’envoyer vers un service soumis à une limite stricte.

Lorsqu’un GIF d’origine n’a pas été modifié, TinyImage utilise les données de son fichier d’origine comme source et applique la compression sélectionnée sans réencoder d’abord chaque image. Les GIF modifiés sont reconstruits avec la palette maximale de 256 couleurs du format avant l’application de la compression sélectionnée. Le même réglage de compression GIF est utilisé pour les téléchargements et pour Insert GIF to Figma.

Vérifiez l’aperçu de lecture après chaque modification, puis choisissez Export GIF, Export APNG, Export WebP, Export MP4 ou Export WebM. Sélectionnez Insert GIF to Figma pour ajouter l’animation modifiée en tant que GIF à la page Figma actuelle. TinyImage affiche la progression de l’export image par image, et vous pouvez annuler avant le traitement de l’image suivante.