O documento fornece uma introdução ao Adobe Flash, descrevendo suas principais ferramentas e funcionalidades para criação de animações, banners, aplicativos e jogos para web. É apresentada a interface do programa e explicados conceitos como cenas, símbolos, linhas do tempo e camadas. Exemplos práticos demonstram como criar botões interativos, animar desenhos importados e usar scripts para adicionar links.
2. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
2
O que é o Adobe Flash?
O aplicativo é um poderoso (antes parte da Macromedia, hoje da Adobe), no qual você
pode desenvolver além de animações básicas, pode montar animações de charges,
aplicativos para web (você pode montar páginas inteiras da internet no flash), colocando
assim scripts como CARREGAR, FECHAR, FORMULÁRIOS, ENVIAR, RESETAR,
etc. O programa pode ser adquirido separado ou com o pacote da ADOBE.
Ao iniciar o programa, ele vai pedir que escolha o que deseja trabalhar, ACTIONSCRIPT,
BANNER, ANIMAÇÃO, entre outras.
Apresentação de sua área de trabalho:
Figura 1 - A tela inicial do programa, mostrando a barra de menus acima, a área de trabalho (CENA), a timeline
(LINHA DO TEMPO) abaixo, onde iremos trabalhar com os quadros para animação. Ao lado direito, temos as
paletas, e a barra de ferramentas, para desenhar, recortar, ferramenta de texto, cores, entre outros.
Vamos mostrar por partes as ferramentas para iniciar uma animação logo depois com
montagem de desenhos do próprio aplicativo e depois importando objetos para a
biblioteca:
Ao iniciar um ACTIONSCRIPT, você pode definir o tamanho do seu documento, poderá
trabalhar com a cena. Pode também converter os símbolos em BITMAP, para que você
possa usar o LASSO e fazer pequenos cortes, separar, dependendo de sua animação.
Importanto suas imagens (caso não queira desenhar inteiramente com o pincel do
FLASH), você pode separar por CAMADAS (LAYERS) como no PHOTOSHOP e ir
movimentando cada um, fazendo assim um pequeno filme, animação (você pode elaborar
sua caricatura por exemplo no COREL e trazer para animá-lo aqui), criando uma
propaganda para sua página, uma animação e abertura para seus amigos, para rede social
e muito mais. A tela abaixo é para apresentar melhor o programa:
3. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
3
Estando trabalhando com o programa em inglês ou português (não dificulta), temos ao
lado direito a barra de ferramentas com a SELEÇÃO, LASSO, FORMAS, BALDE DE
TINTA, LUPA, CONTA GOTAS, AS PROPRIEDADES DO DOCUMENTO, PLANO
DE FUNDO que você pode alterar. Para testar sua animação, você pode em CONTROL
(CONTROLE), TEST MOVIE (TESTAR O FILME), NO FLASH ou no NAVEGADOR.
Abaixo temos a linha do tempo, onde poderemos animar quadro a quadro ou com um
espaço de tempo, usando o INTERPOLAÇÃO MOVIMENTO (MOTION TWEEN).
Com o FLASH, você pode soltar a imaginação para pequenos filmes ou mesmo montar
seus gráficos animados, mostrando quedas, altas em venda, filmes explicativos e
propagandas para seu negócio, produto, com narrativas. Podemos fazer um website
inteiro multimídia por ele, ou uma parte, um banner rotativo para seu site, blog.
Primeiro, precisamos elaborar o que queremos antes de começar a animar no FLASH.
Para um exemplo simples, vamos montar passo a passo botões, fazendo com o que ao
passar o mouse por ele, irá mostrar uma fotografia ou outra em tamanho maior, criando
assim uma galeria de fotos bacana para que você possa exportá-la depois.
4. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
4
Inicie um documento, criando uma ACTIONSCRIPT 3.0.
Vamos usar a ferramenta FORMA, e vamos pegar a OVAL, vamos deixar em um plano
de fundo gradiente:
Logo depois de elaborar a elipse, vamos clicar com o botão direito e vamos em
CONVERT TO SYMBOL:
Escolha BUTTON (BOTÃO) e coloque o nome de BOTÃO 01 (ou outro, caso queira)
5. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
5
Depois, clique duas vezes sobre ele e vamos ver que temos agora CENA e SIMBOLO, e
abaixo, temos as opções UP, OVER, DOWN, HIT - Passar o MOUSE, CLICAR, TIRAR
O MOUSE. Você pode apertar a tecla F6 para pular para o próximo. Vamos em OVER e
vamos importar uma imagem para a CENA:
Deixe a foto somente em OVER, onde ao passar o MOUSE ele irá apresentar a foto que
você selecionou. Para os outros, basta apenas apertar F6. Teste o projeto, indo em
CONTROL – TES MOVIE (teste no navegador também caso queira). Este foi um
exemplo simples, você pode criar seus botões personalizados no PHOTOSHOP, importá-
los pra cá, poderá criar uma bela galeria de fotos e exportar para o seu site HTML depois.
Agora, vamos criar uma animação simples, por exemplo, peixe nadando no rio, criando
suas próprias imagens e importando. Aqui, criei no COREL DRAW e estou importando
pro programa, para animar: FILE > IMPORT > IMPORT TO STAGE:
6. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
6
Observe que foi criada uma CAMADA (LAYER) para cada desenho, para serem
animados separados:
É agora que a brincadeira começa a ficar interessante, pois vamos animar os desenhos
que criamos, movendo a água, as plantas e movendo o peixe! Logo depois vamos
trabalhar com textos também para que você possa criar um letreiro animado com foto,
fazendo abertura e animações interessantes para um video de aniversário por exemplo:
(NÃO ESQUEÇA DE CONVERTER OS OBJETOS EM SIMBOLOS, para trabalhar
com a INTERPOLAÇÃO MOVIMENTO, que é mais fácil para animar ao invés de
quadro a quadro).
7. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
7
Abaixo você vê a seleção e a linha do tempo com as animações de cada
um:
Para criar suas charges, caricaturas, com cenários de cidades, ou qualquer outro lugar,
recomendo o desenho no aplicativo Corel (caso ainda não tenha muita habilidade com o
do FLASH). É só importar, em cada quadro (com interpolação) você fará uma alteração
diferente, boca, braço, mexendo, personagem chegando, personagem saíndo.
AQUI UM EXEMPLO SIMPLES DE ANIMAÇÃO MOSTRANDO MINHA
CARICATURA SOBREVOANDO A CIDADE ONDE MORO COM MÚSICA TEMA,
COM OUTROS OBJETOS, FOTOGRAFIAS E DESENHO DE AUTORIA:
https://www.youtube.com/watch?v=Og_QVQzbUtw
OUTRA ANIMAÇÃO COM FOTOS PRÓPRIAS CRIANDO ASSIM UMA
ABERTURA DO CHAVES (SBT) PERSONALIZADA:
https://www.youtube.com/watch?v=NLhojoXuSyw
Vamos trabalhar um pouco agora com SCRIPTS também dentro do FLASH, sim, porque
se você quiser desenvolver um site ou banner, fazendo com que ao clicar ele te leve algum
determinado link, temos que trabalhar com esses recursos também.
Para isso, vamos importar ou mesmo criar um botão dentro da área do flash, vamos na
GUIA de CODIGOS (CODE), e vamos ver a quantidade de códigos já existentes para
nosso trabalho. Se quiser, pode criar um novo. Usamos aqui nessa imagem que importei
o código GO TO WEBPAGE, ou seja, ao clicar, VAI PARA A PÁGINA .... (que eu
determinar), podendo assim aplicar como banner ou mesmo barra de navegação em um
site.
8. Apostila de Adobe Flash
http://welingtonsc.blogspot.com/
8
Logo depois vem o código pra você alterar a página que quer que carregue:
Caso queira alterar logo depois de fechar, basta ir no frame (quadro), clicar com o botão
direito e depois em ACTIONS. Simples e prático, não ?
CRIANDO SEU PRÓPRIO PLAYER DE VÍDEO
Você quer lançar seu site, seu próprio canal sem depender de sites com o YOUTUBE,
onde possui a marca? Você pode criar com o FLASH. O programa aceita formatos
próprios, você pode importar tudo depois como formato de SWF que é para páginas web: