Originalidade e eficácia são duas características essenciais na hora de criar conteúdos que nos entusiasmam. Graças aos efeitos de interatividade e animação, agora é rápido e fácil, muuuito fácil, cumprir com esses critérios. Em Genially, você pode configurar animações para que sejam executadas Ao clicar em um elemento, imagem ou texto.
Para isso:
- Selecione o elemento, imagem ou texto que deseja animar.
- Clique no ícone de animação.
- No menu lateral direito, selecione a animação Ao clicar e escolha o efeito desejado.
A animação Ao clicar é fugaz como uma estrela cadente: é reproduzida uma única vez quando clicamos no elemento em questão. E claro, você pode combinar esse novo tipo de animação com todas as outras que você já conhece.
Dito isso, dê asas à sua imaginação e crie efeitos incríveis! O quê? Você não conhece os outros tipos de animação? Don’t worry and visite este tutorial.
Combinar animação Ao clicar com outras animações
Vejamos o que acontece com cada uma das animações uma vez combinada com a nova animação Ao clicar:
- Animação Entrada: se você adicionar a animação Ao clicar a um elemento que já tem uma animação de entrada aplicada, você deve esperar que a animação Entrada se execute antes de clicar e executar a nova animação Ao clicar.
- Animação Saída: nesse caso, é possível ativar a animação Ao clicar antes da animação Saída.
Atenção: uma animação de saída precisa de um tempo de início para que o elemento não desapareça imediatamente, então você só pode usar a animação Ao clicar durante esse período de tempo, já que o elemento desaparecerá quando o tempo de saída definido chegar ao final.
Por exemplo, se você escolher a animação Saída, com o efeito Desaparecer e um tempo de início de 3 segundos, esse seria o tempo que você teria para acionar a animação Ao clicar antes que a animação Saída seja executada.
Animação Contínua: no caso dessa combinação, quando clicamos no elemento, a animação contínua será pausada para que a animação Ao clicar seja executada, depois disso, a animação contínua seguirá com sua execução.
Animação Mouse por cima: se trata de uma combinação muuuito interessante. As animações Ao clicar e Mouse por cima, uma vez combinadas, se reproduzem ao mesmo tempo! Se você passar o mouse sobre o elemento, você verá a animação Mouse por cima e então você clica e… tcharan! Aí estará a animação Ao clicar! Combinação perfeita, sim ou claro?
Configurar o tempo entre as animações
Uma grande ideia quando combinamos animações é usar um efeito de entrada com um efeito saída. Para isso, é preciso calcular quando a animação Entrada é executada (por exemplo, começa em 3 segundos), assim como o momento de execução da animação Saída (por exemplo, em 6 segundos).
E se adicionarmos também a nova animação Ao clicar? Hmm... boa ideia! Ficaria genial!
Só uma coisinha : tenha em conta que o seu público terá apenas 3 segundos (com base no exemplo anterior) para clicar no elemento, já que depois disso ele desaparece.
Portanto, é preciso dar ao espectador um certo tempo para fazer uso da animação Ao clicar.