Animação
- Adicionando um Elemento Animado ao site
- Como ativar as animações em meu sistema operacional?
- Lottie Files
Adicionando um Elemento Animado ao site
Com o "Elemento Animado" do Construtor de Sites Builderall Builder, você consegue adicionar contadores e barras de progresso animadas, deixe sua tela mais dinâmica e chame a atenção do visitantes enquanto navegam pelo seu site!
Como adicionar um Elemento Animado?
Passo 1 - Acesse o site e a página que deseja adicionar o Elemento Animado no Construtor de Sites Builderall Builder.
Passo 2 - Escolha um painel em sua página ou adicione um novo para a configuração do elemento.
Passo 3 - Acesse o menu lateral direito do construtor de sites; selecione a opção adicionar e clique na área de elementos; selecione a opção "Elementos Animados".
Passa 4 - Selecione um entre os três tipos de elementos animados disponíveis no construtor de sites e arraste até o painel desejado. 
Como editar os Elementos Animados?
Antes de aprendermos as opções de configurações, vamos conhecer o submenu indicado ao selecionar o elemento animado.
Salvar elemento - selecione para salvar o elemento criado como um "elemento pessoal" e utilizá-lo em outros sites e páginas sem a necessidade de repetir todas as configurações.
Camada abaixo/acima - selecione para mover o elemento entre as camadas do painel e ajustar a sobreposição dos elementos.
Elemento central - selecione para ajustar automaticamente o elemento no centro do painel/caixa que ele foi adicionado.
Elemento clone - selecione para duplicar o elemento animado selecionado.
Ocultar elemento - selecione para adicionar o elemento na parte de "ocultados" do site, ocultar não é sinônimo de deletar o seu elemento, elementos ocultos constam no carregamento da página e podem ser adicionados novamente ao site quando desejar.
Excluir - selecione para deletar o elemento criado. 
Editar elemento - selecione para acessar o menu de opções de configurações externas do elemento.
Opções de edições dos elementos animados:
• Largura máxima no tablet: configure a largura máxima do elemento na versão tablet, caso habilitada em seu site.
• Cores em Geral: configure as cores do elemento adicionado.
• Borda: crie uma borda para o seu elemento de diferentes tamanhos, formas e cores.
• Raio: configure os cantos do seu elemento, eles podem ser quadrados, arredondados ou completamente circulares.
• Texto do contador: configure o número inicial, final, o tempo de
contagem entre esses números e todas as configurações voltadas
ao texto do seu contador.
• Sombra: crie e configure uma sombra para o elemento animado.
• Configuração de tags: função utilizada para tags em scripts externos.
O atributo tag deve ser utilizado somente por usuários experientes.
Com essa tag é possível manipular os elementos através do seletor
data-tag.
• Avançado: alternativa para as configurações de: camada de posicionamento e salvar como elemento pessoal.
Pronto! Finalizamos assim a configuração do nosso tutorial; configure quantos elementos animados desejar em um único ou em diferentes painéis e aproveite da melhor forma possível esse recurso no Construtor de Sites Builderall Builder! Não se esqueça de salvar e republicar sua página antes de realizar os testes.
Avalie a nossa Central de Ajuda, sua opinião é importante para nós!
Equipe Builderall
Como ativar as animações em meu sistema operacional?
Está tentando configurar as opções de animações nos elementos do seu site no Cheetah, porém aparece um aviso de erro? Não se preocupe! Esse erro ocorre devido à opção de "permitir animações" do seu sistema operacional estar desabilitado por padrão, refletindo no Construtor de Sites Cheetah, que não terá permissão, pelo seu próprio sistema, para mostrar as animações selecionadas corretamente.
Vamos aprender a como ativar as animações em cada sistema operacional? Siga as instruções apenas do seu sistema operacional!
Windows 7 
Passo 1: Acesse o painel de controle do Windows 7.
Passo 2: Acesse a opção "Facilidade de Acesso".
Passo 3: Escolha a opção do tópico "Facilite a visualização do computador".
Passo 4: Ative a opção "Ativar todas as animações (quando possível)".
Windows 10 
.png){kind=small}
Passo 1: Acesse as "Configurações" do Windows 10
Passo 2: Acesse a opção "Facilidade de Acesso".
Passo 3: Acesse no menu lateral em "Visão" a opção "Tela".
Passo 4: No tópico "Simplificar e personalizar o Windows", ative a opção "Mostrar animações no Windows".
MacOS e IOS 
MacOS
Passo 1: Acesse as "Preferências do Sistema" no MacOS.
Passo 2: Acesse a opção "Acessibilidade".
Passo 3: Acesse a área de "Exibição".
Passo 4: Desmarque a opção "Reduzir movimento".
IOS
Passo 1: Acesse as "Configurações" do IOS.
Passo 2: Acesse a opção "Acessibilidade" dentro da área "Geral".
Passo 3: Desmarque a opção "Reduzir movimento".
GTK/GNOME (Linux) 
Passo 1: Acesse o painel de "Ajustes" do Linux.
Passo 2: Acesse a opção "Aba Geral" ou "Aparência" (O nome varia dependendo da versão do seu Linux).
Passo 3: Ative a opção de "Animações" na mesma aba.
Android 9+ 
Passo 1: Acesse as "Configurações" do seu Android.
Passo 2: Acesse a opção "Acessibilidade"
Passo 3: Desmarque a opção "Remover animações".
Após ativar as animações, basta retornar ao Cheetah e testar a configuração da animação em seus elementos novamente!
Avalie a nossa Central de Ajuda, sua opinião é importante para nós!
Equipe Builderall
Lottie Files
O que é a Lottie Files?
O termo "Lottie" refere-se a um formato de arquivo de animação baseado em JSON. Esse tipo de arquivo se destaca por ser pequeno, porém sem comprometer a alta qualidade das animações, funciona em qualquer dispositivo e pode ser ampliado ou reduzido sem pixelização. Dessa forma é possível utilizar animações em qualquer plataforma com a mesma facilidade de usar imagens estáticas.
Com a plataforma externa "Lottie File's" é possível criar, editar, procurar arquivos já prontos de animações, entre outras opções para arquivos Lottie. Aprenda neste tutorial a como adicionar esse estilo de arquivo diretamente ao seu site no Builderall Builder e crie experiências que conectam, divertem e envolvem os seus visitantes.
Curiosidade! O termo "Lottie" é uma homenagem a Charlotte "Lotte" Reiniger, uma pioneira alemã da animação em silhueta.
Atenção! A plataforma externa Lottie Files não possui tradução para a língua portuguesa.
Como adicionar animações da Lottie Files no meu site no Builderall Builder?
Passo 1 - Acesse o site da Lottie Files; faça o login em sua conta ou crie uma nova conta.
Passo 2 - Acesse a área de "Biblioteca de Animações Gratuitas". A Lottie Files oferece diferentes opções para adquirir animações: contratação de ilustradores, compra de ilustrações especificas, animações liberadas através do plano pro e animações no plano gratuito. Acesse a área de animações gratuitas através do menu superior em "Products" > "Animations" > "Free Animations"
Passo 3 - Ao encontrar uma animação que você goste, clique em cima para abrir o pop-up de opções da animação. A plataforma Lottie Files oferece diferentes opções para a animação ao abrir pop-up, nesse tutorial, vamos focar nas opções que permitem adicionar a imagem ao site no Builderall Builder. É possível adicionar a animação selecionada de duas formas:
1º Forma:
• Copie a URL da animação em "Lottie Animation URL":
• Acesse o seu site no construtor de sites Builderall Builder; escolha um painel em sua página ou adicione um novo para a configuração do elemento; acesse o menu lateral direito do construtor de sites; selecione a opção Adicionar e clique na área de Elementos; selecione a opção "Lottie File":
• Selecione a animação exemplo e arraste até o local do painel que deseja adicionar a animação:
• Abra a área de edições do elemento no Builderall Builder
; selecione a aba de "Configurações"; cole a URL copiada no campo "External url": 
A animação será adicionada automaticamente no elemento do painel.
2° Forma:
• Clique na área de "Download" no menu superior do pop-up, entre as opções de download, selecione o arquivo "Lottie JSON". 
• Acesse o seu site no construtor de sites Builderall Builder; escolha um painel em sua página ou adicione um novo para a configuração do elemento; acesse o menu lateral direito do construtor de sites; selecione a opção Adicionar e clique na área de Elementos; selecione a opção "Lottie File":
• Selecione a animação exemplo e arraste até o local do painel que deseja adicionar a animação:
• Abra a área de edições do elemento no Builderall Builder ; selecione a aba de "Configurações"; clique na opção "Lottie File" para acessar a área de diretório das animações, nessa área é possível: realizar o upload de uma nova animação em JSON ou acessar animações adicionadas anteriormente:
• Acesse a área de "Upload file"; clique no botão "escolher arquivo" e selecione o arquivo que deixa realizar o upload; para confirmar o envio do arquivo ao diretório, selecione a opção "Enviar Lottie File":
A animação será adicionada automaticamente a área de "List Files", selecione a animação desejada para substituir o elemento adicionado no painel.
Como editar a animação escolhida?
Salvar elemento - selecione para salvar o elemento criado como um "elemento pessoal" e utilizá-lo em outros sites e páginas sem a necessidade de repetir todas as configurações.
Camada abaixo/acima - selecione para mover o elemento entre as camadas do painel e ajustar a sobreposição dos elementos.
Elemento central - selecione para ajustar automaticamente o elemento no centro do painel/caixa que ele foi adicionado.
Elemento clone - selecione para duplicar o elemento criado.
Ocultar elemento - selecione para adicionar o elemento na parte de "ocultados" do site, ocultar não é sinônimo de deletar o seu elemento, elementos ocultos constam no carregamento da página e podem ser adicionados novamente ao site quando desejar.
Excluir - selecione para deletar o elemento criado.
Editar elemento - selecione para acessar o menu de opções de configurações externas do elemento.
Opções de edição para animações Lottie File:
• Configurações: adicionar a animação deseja e altere as opções de "loop" e
"controles" da animação.
• Tamanho: configure a altura e largura do elemento adicionado na versão
desktop; para a versão mobile e tablet (caso habilitada) é possível configurar
apenas a altura.
• Configurações de Fundo: altere a cor de fundo da animação adicionada.
• Tag: função utilizada para tags em scripts externos. O atributo tag
deve ser utilizado somente por usuários experientes. Com essa
tag é possível manipular os elementos através do seletor data-
tag.
• Camadas: alternativa para a configuração de posicionamento das
camadas.
• Avançado: alternativa para as configurações de salvar a imagem
como elemento pessoal
Pronto! Finalizamos assim a configuração do nosso tutorial; configure quantas animações Lottie desejar em um único ou em diferentes painéis e aproveite da melhor forma possível esse recurso no Construtor de Sites Builderall Builder! Não se esqueça de salvar e republicar sua página antes de realizar os testes.
Avalie a nossa Central de Ajuda, sua opinião é importante para nós!
Equipe Builderall