Přeskočit na obsah

Chcete zpestřit svůj web, prodejku nebo sociální sítě pomocí animovaných souborů?
Pak vyzkoušejte formát, který web nezatěžuje a při zvětšování se nerozmaže.

Lotties - animované prvky na webu

Co je to Lottie?
Lottie je animovaný soubor založený na JSON (JavaScript Object Notation – formát pro výměnu dat), který umožňuje vykreslit animace na jakékoli platformě stejně snadno jako statické formáty (.jpg, .png). 

Kde mohu použít Lottie?
Lotties můžete použít jak na webu, tak sociálních sítích. Lze je dokonce použít jako nálepky ve WhatsApp nebo stáhnout do Canvy. Animace si zachovává vysokou kvalitu kdekoliv ji použijete.

Jak velká je Lottie? Porovnejme si to takto: PNG je mrakodrap a Lottie je vila 🙂
Velikost tedy výrazně neovlivňuje rychlost stahování ani nezabírá rozsáhlé místo na disku.
Jsou to malé soubory, které fungují na jakémkoli zařízení. 
Navíc se mohou zvětšovat nebo zmenšovat bez pixelizace – rozrastrování – rozmazání, což se u běžných obrázků stává. 

Odkud se Lottie vzaly?
Před jejich vznikem se tvořily různé tipy animací, které však doprovázely různé problémy a ztrácely na kvalitě. 
Otcem myšlenky exportovat animaci do formátu JSON je Hernan Torrisi (využil schopností Adobe After Effects). Následně inženýři B. Withrow, G. Peal a L. Richardson z Airbnb viděli v JSON potenciál a spojili se s hlavním animátorem Salihem Abdul-Karimem z Airbnb, aby vytvořili knihovnu „Lotties“ pro iOS a Android. dotLottie je formát je údajně budoucí generace animovaných Lottie.

Proč název Lottie?
Animace dostaly své jméno podle německé filmové režisérky a přední průkopnice animace siluet – Charlotte ‚Lotte‘ Reiniger.

Co je potřeba, aby Lotties např. na webu fungovaly?
Přehrávače, které jsou zdarma.

Např. Elementor PRO, se kterým tvořím web stránky pro své klienty, nabízí přímo element Lottie, kam lze snadno zadat jedinečnou adresu Lottie, není potřeba vkládat žádný spešl kód, a můžete pobavit své publikum animovaným prvkem. 
U Divi je potřeba nainstalovat modul Supreme Lottie. U Miowebu je potřeba vložit speciální kód.

Charlotte Reiniger – Papageno

Kde Lotties získat?
Velmi známá je platforma LottieFiles nebo IconScout, které nabízí jak free, tak premium Lotties. Obě slouží také k testování lotties a ke spolupráci designérů.

Co ještě umí Lottie? 
Dokáže být interaktivní – tzn. při kliknutí na ni se vám např. otevře další stránka.
Taky si ji můžete přebarvit do barev dle svých představ (aktuálně běží BETA verze).
Mohou se pohybovat ve smyčce a nebo „naběhnout“ jen jednou.

POTŘEBUJETE PORADIT, JAK DOSTAT LOTTIE NA SVŮJ WEB ČI PRODEJKU?

> VYUŽIJTE KONZULTACE SE MNOU <

back to top