Was ist eine Lottie?
Eine Lottie ist ein JSON-basiertes Animationsdateiformat, welches es dir ermöglicht, Animationen auf jeder Plattform genau so einfach wie statische Inhalte zu verschicken. Es sind kleine Dateien, die auf jedem Gerät funktionieren und ohne Verpixelung verkleinert oder vergrössert werden können. LottieFiles lässt dich eine Lottie auf die leichteste Weise erstellen, bearbeiten, testen, daran mitwirken und sie verschicken.
Warum Lottie?
Hier sind ein paar Vorteile, die Lottie gegenüber den anderen Animationsdateiformaten hat, die es da draussen gibt.
Kleine Dateigröße
Unendlich skalierbar
Lottie-Animationen sind vektorbasiert, was bedeutet, dass man sie vergrössern und verkleinern kann, ohne sich Sorgen um die Auflösung machen zu müssen.
Multi-Plattform-Unterstützung und Bibliotheken
Für all die Entwickler da draussen: Die Lottie-Implementation ist superleicht. Man kann Lottie-Animationen auf iOS, Android, im Web und auf React Native ohne Modifizierung verwenden.
Interaktivität
Bei Lottie-Animationen sind die Animationselemente exponiert, damit man sie interaktiv nutzen kann, sodass sie auf Interaktionen wie Scrollen, Klicken und Streichen reagieren. Erfahre mehr im Leitfaden zum Thema „Interaktivität“.
Die Welt nutzt Lottie
Lottie wird von mehr als Unternehmen weltweit genutzt und steckt in vielen Werkzeugen, die du täglich benutzt.
So legst du mit Lottie los
Werkzeuge und Ressourcen, die dir dabei helfen, mit Lottie loszulegen.
SCHRITT 1
Finde oder erstelle eine Lottie
Finde eine Lottie-Animation
Durchsuche unsere Bibliothek nach direkt benutzbaren, kostenlosen Animationen. Schneide dann eine beliebige Lottie auf deine Marke oder deine Lieblingsfarben zu, indem du das Farbpaletten-Werkzeug oder den Lottie-Editor benutzt.
Oder erstelle eine ganz neue Lottie
Wenn du ein paar Animations-Bruchstücke hast, erstelle eine Lottie mit unseren Adobe-PlugIns. Ansonsten schnapp dir einfach ein SVG und wende mit unserem SVG-zu-Lottie-Konvertierer ein paar Voreinstellungen darauf an.
SCHRITT 2
Benutze deine Lottie
Nutze Lotties in deinem Design, Code und Produktivitätswerkzeugen
Lottie-Bibliotheken für Entwickler
Lottie wird auch bei vielen anderen Werkzeugen von Vornherein unterstützt.
Bereit, mit LottieFiles loszulegen?
2010
Vor Lottie erstellten Bewegungsdesigner ihre Animationen und schickten sie für die Implementierung an Softwareentwickler. Die Optionen für die Implementierung waren begrenzt. Entwickler exportierten Animationen in niedriger Qualität oder versuchten, die Animation von Grund auf als Code zu rekonstruieren. Das war nicht effizient und resultierte oft in suboptimalen Animationen, die weit davon entfernt waren, so auszusehen, wie es der Bewegungsdesigner beabsichtigt hatte.
Hernan Torrisi hatte die Idee, die Repräsentation einer Animation nach Adobe After Effects zu exportieren und die Animation in Laufzeit zu rendern. Er nutzte die Skriptfähigkeiten von After Effects, um ein Animationsprojekt aufzusetzen, und veröffentlichte ein Plugin für After Effects namens Bodymovin, das die Beschreibung einer Animation im JSON-Format exportierte. Außerdem veröffentlichte er den allerersten Renderer für das Format mit einem JavaScript-basierten Player für Browser.
2017
Die Ingenieure Brandon Withrow, Gabriel Peal und Leland Richardson bei Airbnb erkannten das Potenzial der JSON-basierten Animationen und die dadurch gelösten Probleme. Sie schlossen sich mit dem Chefanimateur Salih Abdul-Karim von Airbnb zusammen, um Bibliotheken bei iOS und Android zu erstellen, die diese JSON-Animationsdateien rendern konnten, die sie “Lottie” nannten.
LottieFiles war geboren!
LottieFiles war geboren und bot Animateuren und Entwicklern einen Ort, wo sie ihre Animationen sofort testen, teilen und im Web zeigen konnten.
Microsoft und die .Net-Stiftung veröffentlichten eine Bibliothek, um Lottie auf Windows zu rendern.
2019
Qt fügte den Kundendienst für Lottie hinzu, indem sie ein QML API zum Rendern von Lottie hinzufügten. Samsung veröffentlichte rLottie, einen plattformunabhängigen C++-basierten Renderer für Lottie und fügte den Lottie-Kundendienst in Tizen hinzu.
dotLottie wurde erschaffen. dotLottie ist ein Open-Source-Dateiformat, das eine oder mehrere Lottie-Animationen und deren zugehörige Ressourcen in einer einzigen Datei zusammenfasst. Dies wird die nächste Generation von Lottie für die Zukunft der Animation werden.
