Você já deve ter se deparado ao navegar em sites pela web, que muitos deles tem imagens animadas, que chamam a atenção e trazem um toque único para sua página. Sendo assim, no artigo de hoje, aprenda como fazer ícones animados para sites.
Até não muito tempo atrás, era difícil fazer ícones animados para sites, dependiam de designers experientes na área e a colaboração de desenvolvedores de software para implementação desses projetos.
Hoje, com o LottieFiles, você consegue achar animações prontas e até fazer suas próprias e colaborar para biblioteca do site. Abaixo vamos explicar o que é um Lottie, mais sobre o LottieFiles, o que é, como e onde usar e preços dos seus planos.
Como fazer ícones animados para sites usando o LottieFiles?
Antes de qualquer coisa é necessário que faça um cadastro no site do LottieFiles. Após se inscrever, basta fazer login no site e começar a utilizar das suas ferramentas.
Para criadores de sites com wordpress, e precisa fazer ícones animados para sites, o LottieFiles possui integração nativa com os principais construtores de sites, como o Elementor e o Guttemberg.
Então você sempre poderá pesquisar por um Lottie diretamente no Elementor ou no Guttemberd diretamente, ou incorporar o link.
Veja abaixo um exemplo de um Lottie incorporado direto pelo editor Guttemberg. É muito parecido com um Gif, mas não é.
O LottieFiles tem uma biblioteca com animações prontas, sendo algumas grátis e outras disponíveis para quem preferiu adotar um plano premium. Sendo assim, se você não aprendeu ainda como fazer suas próprias animações, você pode começar por essa biblioteca.
Também é possível usar o editor do LottieFiles e criar animações do zero. O que pode ser mais difícil de você não tiver nenhuma noção de edição de imagem. A plataforma do LottieFiles é muito parecido para edição com os principais programas de edição.
No site do LottieFiles você também tem um blog para aprender mais sobre como fazer ícones animados para sites e troca de informações, e onde pode achar novidades e tutoriais completos de uso.
Preços dos planos da plataforma LottieFiles
Se você se interessou pela plataforma do LottieFiles, você pode usar ela de forma totalmente gratuita, mas com algumas limitações, sendo elas:
- 50 arquivos privados;
- 1 projeto privado;
- Editor Lottie;
- Links compartilháveis limitados;
- Arquivos públicos ilimitados.
Porém, existem dois planos pagos, o Individual e o Plano para Equipe. Nesses planos você tem acesso também há:
- Arquivos privados ilimitados;
- Projetos ilimitados;
- Links compartilháveis ilimitados;
- Lottie Paleta de Cores;
- Otimização do tamanho do arquivo;
- Compartilhamento e comentários privados;
- Incorporações personalizadas;
- Histórico de versões;
- Transferência de Desenvolvedores.
Os valores dos planos individual e o plano para equipe são respectivamente $19,99 e $24,99 e podem ser adquiridos no próprio site.
O que é um Lottie e sua história
Para começar devemos primeiro entender o que é um Lottie. Um Lottie é um formato de arquivo de animação baseado em JSON, que permite que os designers enviem animações em qualquer plataforma tão facilmente quanto o envio de ativos estáticos.
Lotties são pequenos arquivos que funcionam em qualquer dispositivo e podem aumentar ou diminuir a escala sem pixelização.
Antes de Lottie existir, os designers de movimento estavam criando suas animações e passando-as para os desenvolvedores de software para finalizar sua implementação. As opções ainda eram pobres e limitados até meados de 2010.
Nessa época, desenvolvedores exportariam animações em formatos de baixa qualidade ou tentariam o melhor de sua capacidade para reconstruir o design de animação em código a partir do zero.
Em 2015, Hernan Torrisi teve a ideia de exportar a representação de uma animação no Adobe After Effects e renderizar a animação enquanto era executada. Com isso, ele aproveitou as habilidades do Adobe para enumerar um projeto de animação e lançar um plug-in para o Adobe After Effects, chamado de Bodymovin.
O Bodymovin que exportou a descrição do formato JSON da animação. Hernan também lançou o primeiro renderizador para o formato com um player baseado em Javascript para o navegador.
Em 2017, os engenheiros Brando Withrow, Gabriel Peal e Leland Richardson, do Airbnb, viram o potencial que essas animações apresentavam e os problemas que ela resolveu e fizeram uma parceria com o principal animador Salih Abdul-Karim, também do Airbnb, para ajudar a construir bibliotecas iOS e Android que pudessem renderizar esses arquivos de animação JSON. Depois da união, eles deram o nome dessas animações de “Lottie”, uma bela homenagem à diretora cinema alemã e principal pioneira da animação em silhuetas, Charlotte “Lotte” Reiniger.
Pouco depois, no ano de 2018, a Microsoft e a.Net Foundation lançaram uma biblioteca para renderizar Lottie no Windows.
O que é a plataforma LottieFiles?
Com o LottieFiles você pode encontrar ícones animados para sites para poder testar, colaborar e descobrir animações que atendem principalmente a extensa comunidade de animadores, designers, desenvolvedores e engenheiros. Porém, o uso da plataforma pode ser feitos por qualquer pessoa, todos são bem vindos segundo o próprio site.
No site do LottieFiles encontram-se uma gama de ferramentas e recursos para ajudar a criar ícones animados para sites que visam tornar a descoberta, criação e implementação de animações em Lottie mais fácies e eficientes para todos.
Portanto, se você se perguntar qual é a diferença entre Lottie e LottieFiles, é que Lottie é o arquivo de animação e LottieFiles a plataforma na qual você pode testar e compartilhar as animações em Lottie.
Caso tenha gostado deste artigo, veja nossos outros artigos sobre ferramentas e sites incríveis.
Deixe um comentário