5 CRIAÇÃO DE ANIMAÇÕES Neste capítulo iremos aprender os diferentes tipos de animações que podemos criar no Flash; para facilitar a sua aprendizagem serão acompanhados de exercícios. 5.1 Tipos de animação No Flash CS4 podemos criar quatro tipos diferentes de animação: frame-by- -frame, tweened animation, através de ActionScript ou utilizando a ferramenta Bone. Este último tipo de animação corresponde a uma novidade desta versão do Flash. Frame-by-frame Este método é o mais directo para criar animações. Definimos cada frame como um keyframe e criamos uma imagem diferente para cada frame. Inicialmente, quando criamos um novo keyframe, o conteúdo é uma cópia do keyframe anterior. Esta técnica de animação é bastante utilizada para criar animações com um nível de detalhe elevado, dando um controlo mais criativo. Fig. 5.1 Animação frame-by-frame FCA Editora de Informática 75
5 Flash CS4 - Depressa & Bem Tween Nesta nova versão do Flash podemos encontrar três tipos de animações tween: Tween Motion, Tween Classic e Tween Shape. Tween Motion Apesar do nome se manter, o conceito deste tipo de animação foi totalmente reformulado de forma a facilitar a criação de animações tween motion. Trata-se de um novo tipo de animação do Flash CS4 baseado em objectos e não em keyframes. Ou seja, basta criar um símbolo do tipo movie clip e logo em seguida atribuir ao objecto um Tween Motion. Aplicada a animação, basta mudar as propriedades do objecto, como arrastá-lo pelo stage ou mudar o seu tamanho e transparência; isto porque o Flash detecta automaticamente a(s) alteração(ões) e cria os keyframes para gerar a animação. Para criar este tipo de animação é necessário que o filme de Flash utilize ActionScript 3.0 e seja publicado em Flash Player 10. São representadas na timeline por um ponto preto nos keyframes inicial e final. Entre os dois keyframes, os frames são representados por um fundo azul claro. Fig. 5.2 Animação Tween Motion Tween Classic Agora o que era conhecido como Tween Motion, ou seja, uma animação de símbolos baseada em keyframes foi renomeada para Tween Classic. Neste tipo de animação apenas definimos um keyframe de início e um keyframe final da animação. O Flash automaticamente cria os frames entre os dois keyframes com base nos conteúdos desses mesmos keyframes. Na animação Tween Classic, 76 FCA Editora de Informática
Criação de Animações 5 podemos definir diversas propriedades tais como a posição, o tamanho e a rotação de uma instância, o grupo de objectos ou o bloco de texto num determinado ponto da timeline e, depois, alterar estas mesmas propriedades num outro ponto da timeline. Podemos também animar um objecto seguindo um determinado percurso através do desenho de um segmento. São representadas na timeline por um ponto preto nos keyframes inicial e final. Entre os dois keyframes, os frames são representados por uma seta preta e fundo lilás. Fig. 5.3 Animação Tween Classic Tween Shape Esta técnica de animação com objectos vectoriais é semelhante ao efeito de morphing. Desenhamos um objecto vectorial num determinado ponto da timeline e depois alteramo-lo num outro ponto da timeline ou desenhamos outro objecto. O Flash automaticamente vai interpolar os valores ou os objectos entre os keyframes e criar a animação. São representadas na timeline por um ponto preto nos keyframes inicial e final. Entre os dois keyframes os frames são representados por uma seta preta e fundo verde claro. Fig. 5.4 Animação Tween Shape FCA Editora de Informática 77
5 Flash CS4 - Depressa & Bem Ferramenta Bone No campo das animações temos mais uma novidade no Flash CS4 com a introdução da ferramenta Bone, que facilita a criação de animações que necessitem da técnica conhecida como Inverse Kinematics, em que um movimento influencia outros. A sua principal utilidade é reproduzir movimentos do corpo humano. Desta forma, é possível criar uma estrutura óssea em desenhos no Flash e aplicar movimentos coordenados. Ao activá-la numa figura, é criada uma nova layer na timeline, onde a animação pode ser controlada. Esta técnica é aplicada a instâncias de símbolos e a objectos vectoriais. Fig. 5.5 Aplicação da ferramenta Bone Motion Presets Outra novidade importante na área de animação é o painel Motion Presets, onde podemos encontrar diversas animações pré-configuradas prontas a aplicar em objectos no stage. O leitor pode ainda criar e guardar modelos de animação para posteriormente aplicar noutros projectos. Para abrir o painel Motion Presets, deverá executar o comando Window > Motion Presets. 78 FCA Editora de Informática
Criação de Animações 5 Criar pasta Guardar animação como modelo Eliminar modelo Aplicação do modelo seleccionado Fig. 5.6 Painel Motion Presets ActionScript Outra técnica de criar animações em Flash é através da utilização da linguagem de programação ActionScript. Uma das vantagens da utilização de programação é a possibilidade de podermos criar efeitos de animação com ficheiros de tamanho reduzido. No entanto, esta é uma matéria que será abordada um pouco mais à frente. NOTA O aparecimento de uma linha a tracejado na timeline indica que a animação está incompleta ou quebrada, por exemplo, pode faltar um keyframe. FCA Editora de Informática 79
Criação de Animações 5 9. Repetir os passos 6 a 8 se desejar prolongar a animação. 10. Para ver o resultado final desta animação, executar o comando Control > Test Movie. Exercício 5.11 NESTE ÚLTIMO EXERCÍCIO, TEREMOS A OPORTUNIDADE DE AVALIAR OUTRA DAS NOVIDA- DES DO FLASH: A CRIAÇÃO DE ANIMAÇÕES UTILIZANDO SÍMBOLOS APLICADOS NO STAGE AO LONGO DE UMA ÁREA. 1. Criar um novo documento em Flash do tipo ActionScript 3.0. 2. Importar uma imagem através do comando File > Import > Import to Library. 3. Abrir a biblioteca do documento actual através do comando Window > Library. 4. Seleccionar a imagem importada e arrastar para o stage. 5. Nomear a layer como imagem. Fig. 5.76 Imagem no stage FCA Editora de Informática 119
5 Flash CS4 - Depressa & Bem 6. Executar o comando Insert > Timeline > Layer para inserir uma nova layer. 7. Nomear a layer como estrelas. 8. Executar o comando Insert > New Symbol para inserir um novo símbolo do tipo Movie clip. Fig. 5.77 Criação de um novo símbolo do tipo Movie clip 9. Ao entrar no modo de edição do movie clip, vamos desenhar uma estrela pequena no frame 1. 10. Seleccionar o frame 20 e executar o comando Insert > Timeline > Keyframe. 11. Com a ferramenta Free Transform diminuir o tamanho da estrela. 12. Seleccionar o frame 40 e executar o comando Insert > Timeline > Keyframe. 13. Com a ferramenta Free Transform aumentar o tamanho da estrela para o tamanho inicial. 14. Fazer clique num dos frames no intervalo 1-19 e executar o comando Insert > Shape Tween. 15. Fazer clique num dos frames no intervalo 21-39 e executar o comando Insert > Shape Tween. 16. De seguida, vamos voltar ao stage principal. Para tal, basta fazer clique no nome da cena ou na seta. 17. Seleccionar a ferramenta Spray Brush. 120 FCA Editora de Informática
Criação de Animações 5 18. No painel Properties definir os valores seguintes. Fig. 5.78 Configuração da ferramenta Spray Brush 19. Aplicar a ferramenta no stage sobre a imagem. Fig. 5.79 Aplicação da ferramenta Spray Brush FCA Editora de Informática 121
5 Flash CS4 - Depressa & Bem 20. Para ver o resultado final desta animação, executar o comando Control > Test Movie. RESUMO: Neste capítulo, foi dito apenas o essencial e passou-se à prática. Ficámos a conhe cer as diferentes formas e tipos de criar animações em Flash: frame-by-frame, tween classic, tween motion, tween shape e ActionScript, entre outras novidades. Ao longo dos exercícios foram transmitidos diversos conceitos e diversas técnicas sobre a criação de animações. 122 FCA Editora de Informática