--- title: "Was ist eine Lottie-Datei und wie funktioniert sie?" description: "Eine Lottie-Datei ist JSON: Geometrie, Ebenen und Bewegung, die ein Renderer zur Laufzeit zeichnet – keine Bildfolge. Was die Pflichtfelder tragen und was fehlt." canonical: "https://freeaigeneration.com/de/ratgeber/was-ist-eine-lottie-datei-und-wie-funktioniert-sie/" robots: "noindex" lang: "de" --- # Was ist eine Lottie-Datei und wie funktioniert sie? Wer eine Lottie-Datei öffnet, sieht im Texteditor zuerst JSON: geschweifte Klammern, Zahlen, kurze Schlüssel. Genau darin liegt der Unterschied zu einem Video. Eine Lottie-Datei enthält keine Bildfolge, sondern eine Beschreibung von Geometrie, Ebenen und Bewegung, die ein Renderer zur Laufzeit zeichnet. Was eine Lottie-Datei ist und wie sie funktioniert, wird klarer, wenn man die Pflichtfelder durchgeht. Entstanden ist das Format bei Airbnb als Exportziel für Animationen aus der Designsoftware, und der Name der Exportfunktion hängt bis heute an vielen Dateien: Bodymovin. ## Kurzdefinition Lottie ist ein JSON-Format für Vektoranimationen. Es beschreibt Formen, Pfade, Masken, Text und deren zeitlichen Verlauf so, dass eine Bibliothek im Browser oder in einer App die Bewegung selbst berechnet. Es gibt keinen Pixelpuffer, keine Bilddaten im Sinne eines Videos und keinen Ton. ## Die Pflichtfelder Eine gültige Datei braucht sieben Angaben, und jede davon erklärt einen Teil des Verhaltens. - **v** ist die Version des Formats, nach der die Datei geschrieben wurde. - **fr** ist die Bildrate, in der die Keyframes gezählt werden. - **ip** und **op** sind In- und Out-Point in Frames. - **w** und **h** setzen Breite und Höhe in Nutzereinheiten. - **layers** enthält die Ebenen mit ihren Eigenschaften und Keyframes. Die Dauer folgt aus einer Division: fr = 60 mit ip = 0 und op = 120 sind 120 ÷ 60 = 2 Sekunden. Bei fr = 30 und op = 90 sind es 3 Sekunden. Wer die Zahlen ändert, ohne die Bildrate anzupassen, bekommt eine andere Geschwindigkeit, nicht nur eine andere Länge. Auch die Größe ist relativ. w = 1920 und h = 1080 ergeben 2.073.600 Nutzereinheiten, aber keinen Speicherbedarf in dieser Höhe. Es ist ein Koordinatenraum, in dem gezeichnet wird. Fehlt eines der Felder, ist die Datei unvollständig, und ein Player kann sie nicht zuverlässig zeichnen. ## Warum die Datei diffbar ist Weil alles Text ist, lässt sich eine Lottie-Datei versionieren wie Quellcode. Eine geänderte Farbe erscheint als geänderte Zahl, ein neuer Keyframe als neuer Eintrag in der Liste. In einem Review sieht man die Änderung, statt zwei Videodateien nebeneinander abzuspielen. Für die Zusammenarbeit ist das der praktische Vorteil. Eine Animation kann durch eine Freigabe gehen, ohne dass jemand eine Binärdatei austauscht. Automatisierte Prüfungen können Felder kontrollieren, etwa ob die Bildrate zum Zielsystem passt. Und weil die Datei lesbarer Text ist, lässt sie sich mit Suche und Ersetzen über mehrere Varianten hinweg anpassen, etwa wenn eine Bildrate in allen Dateien eines Projekts geändert werden soll. ## Wie Bewegung in der Datei steht Zwischen zwei Keyframes steht nicht „weich" oder „natürlich", sondern eine Kurve. Lottie speichert Easing als zwei Bézier-Griffe pro Keyframe, einen für den Eingang und einen für den Ausgang, dazu ein Kennzeichen für gestufte Bewegung. Diese Zahlen sind das, was ein Player tatsächlich umsetzt. Warum dieselbe Kurve in zwei Werkzeugen unterschiedlich aussieht, erklärt [Was sind Keyframes in der Animation?](/de/ratgeber/was-sind-keyframes-in-der-animation/). ## Was eine Lottie nicht trägt Ton und Video gehören nicht dazu. Eine Lottie-Datei ist stumm und besteht aus Geometrie; wer eine Tonspur braucht, arbeitet mit einem Video. Rasterbilder lassen sich als Assets einbetten, dominieren dann aber die Dateigröße und verlieren den Skalierungsvorteil. Aufwendige Effekte und manche Expressions überstehen den Weg zwischen Motion-Software und Player nicht eins zu eins. Deshalb gilt: früh exportieren und im echten Zielplayer prüfen, nicht erst nach der Fertigstellung. Dazu kommt ein Container, der oft verwechselt wird. dotLottie bündelt eine oder mehrere Lottie-JSON-Dateien samt Assets in einer komprimierten Datei. Das Animationsmodell bleibt dasselbe, nur die Verpackung ist eine andere. ## Grenzen im Editor Die Ein- und Ausgabe von Lottie ist im [Motion-Graphics- und VFX-Editor](/de/tools/motion-vfx-editor/) in beide Richtungen belegt, und Projekte sichern im eigenen .ecproj-Format. After-Effects-Projekte mit der Endung .aep oder .aepx lassen sich nicht öffnen, und AE-Plug-ins laufen nicht. Wer aus dieser Richtung kommt, muss die Szene neu aufbauen, statt sie zu konvertieren. Eine Lottie-Datei ist damit vor allem eine Schnittstelle, die Vektorgeometrie und Timing dorthin transportiert, wo eine Bibliothek sie zeichnen kann. Welches Ausgabeformat für dein Projekt sinnvoller ist, klärt [Lottie vs. GIF vs. MP4](/de/ratgeber/lottie-vs-gif-vs-mp4-welches-animationsformat-sollten-sie-verwenden/).