BOTÃO ANIMADO - Pg. 4

Tutoriais - 30/04/2006 - Rogério Guerreiro

 
 

 

Neste efeito, o botão vai aparecer “do nada”. Faça o botão normalmente, como explicado nas páginas anteriores e, assim que acabar crie uma nova camada, acima de todas e pinte-a com a mesma cor do fundo onde vai ser aplicado o botão (no caso deste botão, o branco). Deixe a opacidade dessa camada em 0% (zero, mesmo) de opacidade (A).

 
 

 
 

 

No Image Ready, (B) oculte as camadas do botão; deixe visíveis somente a camada de opacidade 0% e a Camada do Fundo (1). Na paleta Animação (Animation), crie um novo quadro (2) após a seleção. Volte na paleta camadas e deixe todas as camadas visíveis como estavam. O resultado você vê na figura C. Para fazer o resto da animação, basta seguir o que foi dito antes.

 
 

 
 

 

Aqui estão algumas experiências que fiz e que vale a pena saber: quando criar os quadros de transição (D), evite colocar mais de 15 quadros, no campo indicado pela seta. Eu tentei colocar 20 quadros e o arquivo ficou “pesado”. Parece que o número ideal é 10 quadros; só ponha mais se não houver outra saída.

 
 

 
 

 

Você pode especificar a duração do intervalo de cada quadro (E), mas creio que para a maioria das animações o intervalo-padrão (que é de 0 segundos) serve perfeitamente. Também pode-se configurar (F) se animação será contínua (padrão), uma vez ou outro. Escolhendo-se a última opção, aparece o quadro Definir Total de Loops (G).

 
 


 

 

 

Aqui estão dois botões que eu criei. No segundo botão, eu coloquei um intervalo maior no primeiro e no segundo quadro, como na figura E. Tentei por  0,5 segundos, mas ficou muito lento. Então, coloquei 0,2 segundos. Nos quadros de transição, deixei como 0 segundos. Para isso, criei dois quadros extras com 0 seg, antes de aplicar a transição (ver figura abaixo, à direita).

 
 

Nota: A animação dos dois botões não está em sincronia porque os intervalos foram configurados de modo diferente.

 
 

Página 1   /   Página 2   /   Página 3   /   Página 4

 
Hosted by www.Geocities.ws

1