Przeglądarka Lottie
Darmowy odtwarzacz Lottie online. Otwórz dowolną animację Lottie JSON, odtwarzaj, przewijaj klatka po klatce, zmieniaj prędkość, włączaj pętlę i podglądaj na przezroczystej szachownicy — w całości w przeglądarce.
Czym jest plik Lottie?
Plik Lottie to eksport JSON animacji wektorowej, zwykle tworzony w After Effects wtyczką Bodymovin lub w narzędziach takich jak LottieFiles. Aplikacje i strony odtwarzają go lekkim rendererem zamiast wideo: plik jest malutki, a jakość idealna w każdej skali.
Jak podejrzeć animację Lottie tutaj?
Kliknij obszar wczytywania lub przeciągnij na niego plik .json. Animacja ładuje się natychmiast i zaczyna się odtwarzać. Przyciskiem z przykładem przetestujesz odtwarzacz na wbudowanej próbce.
Czy moja animacja jest wysyłana na serwer?
Nie. Plik jest w całości czytany i renderowany w karcie przeglądarki. Nic nie jest nigdzie wysyłane, więc bezpiecznie sprawdzisz tu także nieopublikowane projekty klientów i poufne materiały.
Jakie są dostępne funkcje odtwarzania?
Odtwarzanie i pauza, przycisk ponownego startu, przełącznik pętli, przesuwalny suwak klatek oraz wybór prędkości od 0,25x do 2x. Wyświetlana jest bieżąca klatka, ich łączna liczba i liczba klatek na sekundę animacji.
Po co jest szachownicowe tło?
Szachownica oznacza przezroczystość, jak w programach graficznych. Dzięki niej sprawdzisz, czy animacja nie ma niechcianego tła; przełącz na białe lub czarne, by ocenić krawędzie, poświaty i cienie na jasnych lub ciemnych powierzchniach.
Które wersje Lottie są obsługiwane?
Odtwarzacz używa renderera lottie-web, zgodnego z JSON-em Bodymovin od wersji 4: warstwy kształtów, maski, mattes, trim paths i większość wyrażeń wypalonych przy eksporcie.
Czy działa na telefonie?
Tak. Układ jest responsywny, a renderowanie odbywa się tym samym silnikiem SVG, więc działa w przeglądarkach iOS i Android. Elementy sterowania mają rozmiar dotykowy.
Czym różni się .json od .lottie?
Format .lottie (dotLottie) to skompresowane zip, które może zawierać JSON wraz z zasobami. Ta przeglądarka otwiera bezpośrednio standardowy eksport Lottie .json; w przypadku dotLottie najpierw wypakuj z niego plik .json.
Dlaczego moja animacja działa wolno lub wygląda źle?
Animacje z wieloma warstwami, obrazami lub wyrażeniami są obciążające dla renderowania. Sprawdź, czy obrazy nie zostały wyeksportowane osobno, uprość kompozycję lub zmniejsz prędkość — odczyt FPS pokazuje przewidziane tempo animacji.
Jak korzystać z Przeglądarka Lottie
Ta przeglądarka Lottie odtwarza animacje Bodymovin JSON w całości w Twojej przeglądarce za pomocą silnika lottie-web. Wczytaj plik lub przeciągnij go, steruj odtwarzaniem klatka po klatce i podglądaj na przezroczystym, białym lub czarnym tle — nic nie jest wysyłane na serwery.
- Kliknij obszar wgrywania albo przeciągnij na niego plik .json Lottie; animacja wczytuje się i od razu zaczyna się odtwarzać.
- Steruj odtwarzaniem dużym przyciskiem odtwarzania/wstrzymania oraz przyciskiem restartu.
- Przeciągaj suwak klatek, aby przejść do dowolnej klatki; odczyt pokazuje bieżącą klatkę, ich łączną liczbę i FPS.
- Wybierz prędkość od 0,25x do 2x i włącz przycisk pętli dla ciągłego powtarzania.
- Zmieniaj tło między przezroczystą szachownicą, bielą i czernią, aby sprawdzić krawędzie, poświaty i cienie.
Najpierw naciśnij przycisk z przykładem, aby zobaczyć, jak zachowuje się odtwarzacz, zanim wczytasz własną animację — przydatne, gdy klient prześle JSON i trzeba szybko go sprawdzić.
Powiązane narzędzia
- Przeglądarka i Edytor SVG Przeglądaj, edytuj i optymalizuj pliki SVG online. Podgląd na żywo, edycja kodu i narzędzia optymalizacyjne.
- Przeglądarka drzewa JSON Wizualizuj dane JSON jako interaktywne zwijalne drzewo. Szukaj kluczy i wartości, śledź JSONPath przy najechaniu i obsługuj duże pliki z leniwym ładowaniem. Obsługuje przeciąganie i upuszczanie plików .json.
- Generator Sprite Sheet Łącz obrazy w sprite sheet z przeciąganiem do zmiany kolejności, układem siatki, paddingiem, trybami skalowania. Eksportuj PNG/WebP/JPG z danymi JSON atlas dla silników gier i CSS.
- Obraz do Base64 Konwertuj obrazy na ciągi Base64 i dekoduj Base64 z powrotem na obrazy. Obsługuje PNG, JPG, GIF, WebP, SVG, BMP, ICO. 100% w przeglądarce, bez przesyłania.
- GIF Rozdziel Klatki Wyodrębnij i pobierz pojedyncze klatki z animacji GIF jako PNG lub sprite sheet. Darmowe narzędzie online z podglądem i eksportem ZIP.
- GIF Odwrócony Odwróć kolejność odtwarzania animacji GIF online za darmo. Prześlij, podglądaj i pobierz natychmiast.
- Zmieniacz Prędkości GIF Zmień prędkość animacji GIF online. Natychmiast przyspiesz lub zwolnij pliki GIF.
- Wideo na GIF Konwertuj wideo na animowany GIF online. Dostosuj jakość, liczbę klatek i rozdzielczość bezpośrednio w przeglądarce bez przesyłania plików.