TUTORIAL ANIMAÇÃO EM FLASH - BOLA PULA NO BURACO -

George Alberto Ferreira Cavalcante081 91547026 - gafcartes@hotmail.com

Oi Gente, estou enviando pra vocês um belo Tutorial que envolve Mascara, Som e Vídeo.Muito bem gente! Vamos criar no Flash uma cena animada de uma bola quicando num cenário e caindo dentro de um buraco

Porém antes de qualquer coisa devemos lembrar que animação digital não é uma receita de bolo que só pode fazer de um jeito, esforce-se para entender a logica da coisa.

CRIANDO UM SÍMBOLO

São muito importantes os símbolos na animação, sem eles seria muito complicado e até impossível animar e até programar dentro do Flash.

Existem três tipos de símbolo:

1-Clipes de filmes (MovieClips).

2-Botões (Buttons).

3- Gráficos (Graphics).

Neste tutorial usaremos apenas um símbolo do tipo gráfico, uma linha guia, um cenário e uma camada máscara.

Vamos Começar?

Quando abrimos o Flash ele inicia com uma janela perguntando o tipo de novo documento você quer iniciar escolha ACTION SCRIPT 3.0 ou 2.0.

Caso você esteja com o Flash aberto então crie um arquivo novo clicando em FILE -> NEW.

Vamos criar um símbolo, com o novo documento aberto vá para o menu INSERT ->NEW SIMBOL ou Clique CTRL+F8.

O Flash mostra uma nova janela (CREATE NEW SIMBOL) para você dar nome e escolher o tipo de símbolo a ser inserido na biblioteca do novo documento. Chamaremos o novo símbolo de BOLA e selecionamos o tipo Gráfico para ele.

Observe que agora você não está mais na cena e sim no espaço de edição dentro do símbolo BOLA.

No meio do palco desenhe uma bola com tudo que tem direito. Após isso separe em camadas diferentes o contorno e o conteúdo da imagem que acabamos de criar.

Como?

Chame a camada inicial de CONTEÚDO, Clique-duplo, sobre o contorno (confira se apenas o contorno está selecionado), CTRL+X para recortar o contorno, crie uma nova camada e denomine-a de CONTORNO, nesta nova Camada cole no mesmo lugar que

recortou da camada CONTEÚDO usando CTRL+SHIFT+V.

Porque fazermos isso?

Para podermos editar diferentemente ambas as camadas.

No frame 20 da camada CONTEÚDO clique F5 dando uma continuidade a textura da bola, no mesmo frame 20, porém na camada do CONTORNO clique F6, criando um novo quadro-chave.

Na camada contorno clique em qualquer frame entre 1 e o 19 com o botão direito e selecione a opção CRIAR INTERPOLAÇÃO CLÁSSICA. 

Na mesma camada no frame 10, crie um novo quadro chave (F6) e com a ferramenta FREE TRANFORM TOOL (Q) gire em 180 graus em sentido horário o contorno da bola, e no frame 20 gire cerca de 160 graus. Isto vai dar uma aparência de giro em 360 graus para a bola pela quebra de quadros do trajeto do giro. Trave a camada.

Na camada CONTEÚDO aplique uma textura Radial ajustando com a Ferramenta GRADIENT TRANSFORM TOOL (F) para criar uma aparência de que está recebendo iluminação. Trave a camada e Pronto.

Você tem uma bola que gira e mantem um foco de luz e sombra.

Gafc Artes - o futuro em suas mãos.

LINHA GUIA

Volte para Cena, denomine a camada existente de BOLA, arraste e ajuste o tamanho e posição do símbolo BOLA nele, feito isto crie uma nova camada, chame-a de GUIA e faça uma linha que represente o caminho que você deseja que a BOLA percorra.

Na camada GUIA no frame 35 crie um quadro continuado (F5), e na Camada BOLA, também no quadro 35, crie um quadro editável (F6). Crie uma Interpolação clássica na camada BOLA.

Agora, no quadro 1 posicione o símbolo BOLA na extremidade desejada e no quadro 35 na outra extremidade.

Clique sobre a Camada Guia, com o botão direito do mouse ou do Pen da Tablet, e escolha a opção Linha Guia (Guide).

Observe como o a camada sofreu uma mudança, mas não guia ainda o símbolo BOLA.

Para ser guiado o simbolo BOLA terá que ser filho da Camada GUIA, e isto é feito arrastando levemente a camada BOLA para baixo da camada GUIA.

Teste movendo o Cursor da Linha do Tempo (Timeline) se o símbolo BOLA estiver seguindo a linha GUIA e girando (conforme determinamos dentro da edição do símbolo) então está tudo correto, se não retorne e refaça o passo a passo e veja o que faltou.

A linha GUIA não aparecerá na apresentação, pois ela só é um objeto visível no programa de edição (Flash).

CENÁRIO

O cenário você pode importar (ARQUIVO->IMPORTAR->IMPORTAR PARA BIBLIOTECA) ou desenha-lo diretamente no FLASH. 

No meu caso desenhei um cenário simples com um buraco desenhado em uma camada que movi para baixo de todas. Chamei a camada de CENÁRIO.

Desenhei propositalmente um buraco no caminho da linha Guia pelo motivo de querer fazer que o símbolo BOLA simule que caiu dentro dele, se importou uma imagem do Photoshop cuja linha GUIA não se posiciona adequadamente, então edite a Linha Guia em sua camada,

ATENÇÃO: Se for desenhar seu cenário no próprio FLASH não esqueça de travar as demais camadas para não haver confusão de linhas e permitir um movimento mais tranquilo do Mouse ou Pen. 

MÁSCARA

Existe um recurso muito bom no Flash que me permite escolher as áreas que serão vistas na apresentação usando máscaras, porem, como a Linha Guia (Guide), Máscara (Mask) é um recurso de camada, por este causa não é possível aplicar máscara sobre a Linha Guia.

Como Fazer então? 

Selecione todos os Frames da Camada Bola e Converta em Quadros-Chaves. 

Todo o movimento da Guia será dividido em quadros.

Feito isso a camada Guia pode ser deletada.

Crie no lugar dela uma nova camada e a chame de MÁSCARA. No caso deste cenário, crie um retângulo que cubra toda a cena e delete apena a área de base do buraco do cenário para baixo, ou seja a área que eu não quero que a BOLA seja visualizada na cena.

Clique com botão direito sobre a camada MÁSCARA e selecione o recurso Máscara (Mask), e faça da camada BOLA filha da camada MÁSCARA, lembre-se ambas deve estar travadas para que a mascara tenha efeito no palco.

Teste sua animação

  Sua animação está pronta. 

Incremente a sua animação simulando sombra no chão com recursos textura com transparência e dando efeito de peso a BOLA, criando um efeito de achatamento (strech) no quadro que tocar o chão e estiramento (squach) quando pula. 

Visualize clicando simultaneamente CTRL+ENTER.

Valeu gente, muito sucesso em suas experimentações!!!

Gafc Artes - o futuro em suas mãos.