Lottie-visning
Gratis Lottie-spiller online. Åpne enhver Lottie-JSON-animasjon, spill av, scrubb bilde for bilde, endre hastighet, slå av/på løkke og forhåndsvis på gjennomsiktig rutenett — rett i nettleseren.
Hva er en Lottie-fil?
En Lottie-fil er en JSON-eksport av en vektoranimasjon, vanligvis laget i After Effects med Bodymovin-pluginen eller i verktøy som LottieFiles. Apper og nettsider spiller den av med en lett renderer i stedet for video: filen er bitteliten og kvaliteten perfekt i alle størrelser.
Hvordan forhåndsviser jeg en Lottie-animasjon her?
Klikk på opplastingsområdet eller dra .json-filen din dit. Animasjonen lastes umiddelbart og begynner å spille. Eksempelknappen lar deg teste spilleren med en innebygd prøve.
Blast animasjonen min opp til en server?
Nei. Filen leses og rendres helt i nettleserfanen. Ingenting sendes noe sted, noe som gjør den trygg for upublisert kundearbeid og konfidensielt innhold.
Hvilke avspillingskontroller finnes?
Spill av og pause, omstartsknapp, løkke av/på, en dra-bar for bilder og hastighetsvelger fra 0,25x til 2x. Visningen viser nåværende bilde, totalantall og bildeteknsten til animasjonen.
Hvorfor er det rutete bakgrunn?
Rutenettet simulerer gjennomsiktighet, akkurat som i designverktøy. Bruk det til å se at animasjonen ikke har uønsket bakgrunn; bytt til hvitt eller svart for å kontrollere kanter, glød og skygger på lyse eller mørke flater.
Hvilke Lottie-versjoner støttes?
Spilleren bruker lottie-web-rendereren, som støtter Bodymovin-JSON fra versjon 4: form lag, masker, mattes, trim paths og de fleste uttrykk bakt inn ved eksport.
Fungerer det på mobil?
Ja. Oppsettet er responsivt og rendring skjer med samme SVG-motor, så det virker i iOS- og Android-nettlesere. Kontrollene er dimensjonert for berøring.
Hva er forskjellen på .json og .lottie?
Formatet .lottie (dotLottie) er et komprimert zip-arkiv som kan inneholde JSON sammen med ressurser. Denne visningen åpner standard Lottie-.json-eksport direkte; for dotLottie-filer, pakk ut den indre .json-filen først.
Hvorfor spilles animasjonen min tregt eller ser feil ut?
Animasjoner med mange lag, bilder eller uttrykk er krevende å rendere. Sjekk at bildene ikke er eksportert separat, forenkle komposisjonen eller senk hastigheten — FPS-visningen viser animasjonens tiltenkte frekvens.
Slik bruker du Lottie-visning
Denne Lottie-visningen spiller Bodymovin-JSON-animasjoner helt i nettleseren din med lottie-web-rendereren. Last inn en fil eller dra den inn, styr avspillingen bilde for bilde og forhåndsvis på gjennomsiktig, hvit eller svart bakgrunn — ingenting lastes opp.
- Klikk på opplastingsområdet eller dra en Lottie-.json-fil dit; animasjonen lastes inn og begynner å spille med en gang.
- Styr avspillingen med den store spill/pause-knappen og restart-knappen.
- Dra bildekontrollen for å hoppe til et vilkårlig bilde; visningen viser nåværende bilde, totalt antall og FPS.
- Velg en hastighet mellom 0,25x og 2x, og slå på løkkeknappen for kontinuerlig gjentakelse.
- Bytt bakgrunnen mellom gjennomsiktig rutenett, hvitt og svart for å undersøke kanter, glød og skygger.
Trykk på eksempelknappen først for å se hvordan spilleren oppfører seg før du laster inn din egen animasjon — nyttig når en kunde sender deg en JSON og du trenger en rask sjekk.
Relaterte verktøy
- SVG-viser og Redigerer Forhåndsvis, rediger og optimaliser SVG-filer på nett. Sanntidsforhåndsvisning, koderedigering og optimaliseringsverktøy.
- JSON-treviser Visualiser JSON-data som et interaktivt sammenleggbart tre. Søk nøkler og verdier, spor JSONPath ved hover og håndter store filer med lat lasting. Støtter dra og slipp av .json-filer.
- Sprite Sheet Generator Kombiner bilder til sprite sheet med dra-for-å-omordne, rutenettlayout, padding, skaleringsmoduser. Eksporter PNG/WebP/JPG med JSON-atlasdata for spillmotorer og CSS.
- Bilde til Base64 Konverter bilder til Base64-strenger og dekod Base64 tilbake til bilder. Støtter PNG, JPG, GIF, WebP, SVG, BMP, ICO. 100% i nettleseren, ingen opplasting.
- GIF Del Bilderammer Pakk ut og last ned enkelte bilderammer fra GIF-animasjoner som PNG eller sprite-ark. Gratis onlineverktøy med forhåndsvisning og ZIP-eksport.
- GIF Baklengs Snu avspillingsrekkefølgen for GIF-animasjoner gratis online. Last opp, forhåndsvis og last ned umiddelbart.
- GIF Hastighetsendrer Endre GIF-animasjonshastighet online. Øk eller reduser hastigheten på GIF-filer umiddelbart.
- Video til GIF Konverter video til animert GIF på nett. Juster kvalitet, bildefrekvens og oppløsning direkte i nettleseren uten opplasting.