Vorhandenes GIF oder MP4 bearbeiten

Lade ein GIF oder MP4, ändere Größe, Ausrichtung, Länge und Timing und exportiere die bearbeitete Animation mit TinyImage.

Mit dem GIF Editor im Tab GIF von TinyImage bearbeitest du ein vorhandenes animiertes GIF oder MP4, ohne es aus einzelnen Figma-Ebenen neu aufzubauen.

Video-Tutorial: Animierte GIFs direkt in Figma bearbeiten

Dieses Video zeigt, wie du animierte GIFs mit TinyImage bearbeitest, kombinierst, kürzt, transformierst und exportierst.

GIF oder MP4 laden ​

Wähle in Figma Design eines der folgenden Elemente aus:

  • eine Ebene mit einer animierten GIF-Füllung;
  • einen Frame, der auf beliebiger Verschachtelungsebene eine oder mehrere GIF-Ebenen enthält.

Wenn du den GIF Editor öffnest, während eine dieser Ebenen ausgewählt ist, lädt TinyImage sie automatisch. Andernfalls wählst du Use selected Figma GIF layer. Mit Choose file from your computer kannst du auch ein lokales GIF oder MP4 laden.

Wenn du einen Frame lädst, rechnet TinyImage den sichtbaren Ebenenstapel des Frames in jeden Animationsframe ein. Dazu gehören Inhalte, Masken, Effekte und andere Ebenen über oder unter den verschachtelten GIF-Ebenen. Der ursprüngliche Figma-Frame und seine Ebenen bleiben unverändert.

Enthält der Frame mehrere GIFs, synchronisiert TinyImage deren Framewechsel in einer gemeinsamen, bearbeitbaren Zeitleiste. Aus Stabilitätsgründen kann eine kombinierte Frame-Animation bis zu zwei Minuten lang sein und bis zu 500 kombinierte Frames enthalten.

Mit Reset kehrst du jederzeit zum ursprünglich geladenen GIF zurück.

TinyImage warnt dich, bevor ein GIF mit noch nicht exportierten Änderungen ersetzt wird. Bei großen GIFs erscheint außerdem ein Hinweis zur Verarbeitung. GIFs können bis zu 2.000 Frames enthalten, Maße bis zu 8.192 px haben und eine Quelldatei mit bis zu 100 MB sein.

MP4-Dateien können bis zu 60 Sekunden lang und 100 MB groß sein. TinyImage tastet das Video mit 10 Bildern pro Sekunde ab und verkleinert sehr große Videomaße bei Bedarf automatisch, damit die Bearbeitung zuverlässig funktioniert.

Größe und Ausrichtung der Animation ändern ​

Gib eine Ausgabebreite oder -höhe ein und lass Lock ratio aktiviert, um die ursprünglichen Proportionen zu erhalten. Wähle Apply size, um die Größe aller Frames zu ändern.

Mit den Transformationsreglern kannst du:

  • alle Frames um 90 Grad nach links oder rechts drehen;
  • alle Frames horizontal oder vertikal spiegeln;
  • alle Frames über eine visuelle Auswahl oder mit exakten Werten für X, Y, Breite und Höhe zuschneiden.

GIF kürzen und Timing anpassen ​

Wähle mit den Griffen der Zeitleiste den ersten und letzten Frame, die erhalten bleiben sollen. Mit dem Dropdown Speed machst du die ganze Animation um 50 % oder 25 % langsamer, behältst das normale Timing von 100 % bei oder machst sie um 25 %, 50 % oder 100 % schneller. TinyImage berechnet jeden Frame aus seinem ursprünglichen Timing neu, sodass bewusste Timing-Unterschiede zwischen Frames erhalten bleiben.

Aktiviere Reverse, um Vorschau, Zeitleiste und die Reihenfolge der exportierten Frames umzukehren. Hast du die Animation bereits gekürzt, behält TinyImage die gewählten Frames bei und kehrt ihre Reihenfolge um. Lass bei GIF- und APNG-Ausgaben Infinite aktiviert, damit die Animation endlos läuft. Deaktiviere Infinite und gib die Gesamtzahl der Durchläufe in das Zahlenfeld ein, damit die Animation eine feste Anzahl von Malen abgespielt wird.

Ausgabe einrichten und exportieren ​

Im Formatmenü neben dem Export-Button lädst du die bearbeitete Animation herunter als:

  • animiertes GIF
  • animiertes PNG (APNG)
  • animiertes WebP
  • MP4-Video
  • WebM-Video

GIF- und APNG-Exporte haben eine Schleifeneinstellung, MP4- und WebM-Exporte eine Einstellung für die Videoschleife, und animiertes WebP läuft immer in einer Endlosschleife.

Der GIF Editor verwendet denselben Regler Quality und dieselbe Option Lossless wie Create a GIF/MP4. Diese Einstellungen gelten für GIF-, APNG- und Animated-WebP-Exporte. Aktiviere Lossless, um den Qualitätsregler zu deaktivieren und die Bildqualität zu erhalten, oder verringere den Qualitätswert, um die Dateigröße mit verlustbehafteter Komprimierung zu reduzieren. MP4 und WebM verwenden stattdessen die höchste Videoqualität, die der Editor unterstützt.

Aktiviere für animierte GIF-Ausgaben Size Target und gib eine maximale Größe in KB ein, damit TinyImage Verluststufe und Farbpalette automatisch anpasst. Solange ein Ziel aktiv ist, ersetzt das KB-Feld die manuellen Regler für Quality und blendet Lossless aus. Lässt sich das Ziel nicht erreichen, exportiert TinyImage das kleinste gültige Ergebnis, das es gefunden hat. Prüf die gespeicherte Datei also, bevor du sie zu einem Dienst mit festem Limit hochlädst.

Wurde ein ursprüngliches GIF nicht bearbeitet, verwendet TinyImage die Originaldatei als Eingabe und wendet die gewählte Komprimierung an, ohne vorher jeden Frame neu zu kodieren. Bearbeitete GIFs werden mit der maximalen Palette des Formats von 256 Farben neu aufgebaut, bevor die gewählte Komprimierung angewendet wird. Dieselbe GIF-Komprimierungseinstellung gilt für Downloads und Insert GIF to Figma.

Prüf die Wiedergabevorschau nach jeder Änderung und wähle dann Export GIF, Export APNG, Export WebP, Export MP4 oder Export WebM. Mit Insert GIF to Figma fügst du die bearbeitete Animation als GIF zur aktuellen Figma-Seite hinzu. TinyImage zeigt den Exportfortschritt pro Frame an, und du kannst abbrechen, bevor der nächste Frame verarbeitet wird.