Flash cs4

Adobe Flash CS4:
Adobe Flash CS4: Multimídia Interativo
Sumário
Unidade1: Introdução
Sobre o Curso......................................................................................................6
Estrutura do Curso...............................................................................................6
Unidade 2: O Ambiente de Trabalho do Flash CS4

A Tela Inicial (Start Page)...................................................................................8
O Layout do Flash...............................................................................................9
Personalizando a Interface..................................................................................10
Painel Properties..................................................................................................11
A Timeline...........................................................................................................12
O Painel Tools.....................................................................................................13
FLA e SWF.........................................................................................................13
Unidade 3: Modos de Desenho e Objetos Gráficos

Modo Object Drawing.........................................................................................16
Object Primitive..................................................................................................17
Formas Rectangle e Oval....................................................................................17
Forma PolyStar....................................................................................................18
Desenhando com a Ferramenta Pencil................................................................18
Pintando com o Brush.........................................................................................18
A Ferramenta Pen................................................................................................19
Ajustando e Remodelando os Segmentos...........................................................20
Transformando Objetos.......................................................................................21
O Painel Align.....................................................................................................22
Cores e Gradientes..............................................................................................22
Laboratório: Iniciando a Montagem do Hotsite..................................................24
Unidade 4: Usando Símbolos e Animando

Tipos de símbolos................................................................................................26
Biblioteca............................................................................................................27
Trabalhando com Linhas de Tempo....................................................................28
Animação Interpolada.........................................................................................29
Usando o Motion Editor......................................................................................30
Interpolação de Formas.......................................................................................31
Shape Hints.........................................................................................................32
Animação Quadro a Quadro................................................................................33
Movimentando Objetos no Espaço 3D................................................................33
2
Painel Motion Presets..........................................................................................34
Unidade 5: Trabalhando com Camadas e Textos

As Camadas (Layers)..........................................................................................36
Distribuindo Elementos em uma Camada...........................................................37
Camada Motion Guide........................................................................................37
Ferramenta Text Tool..........................................................................................38
Transição entre Textos.........................................................................................39
Importando Mídias..............................................................................................40
Unidade 6: Máscaras na Animação

Usando Máscaras.................................................................................................44
Efeitos de Preenchimento....................................................................................45
Máscara Arrástavel..............................................................................................46
Máscara com Gradiente.......................................................................................47
Criando Animações com Filtros..........................................................................49
Laboratório: Textos como Máscaras...................................................................50
Laboratório: Movimento com Máscaras.............................................................50
Unidade 7: Cinemática Inversa (IK)

Cinemática Inversa (IK) .....................................................................................52
Adicionando Bones a Símbolos..........................................................................52
Adicionar Bones a Shapes...................................................................................54
Convertendo a Armadura em um Símbolo..........................................................55
Padrões com a Ferramenta Spray Brush.............................................................56
Desenhando com a Deco Tool.............................................................................57
Unidade 8: Criando Botões

O Símbolo Botão.................................................................................................60
Animando os Botões...........................................................................................61
Personalizando o Cursor......................................................................................62
Unidade 9: Introdução ao ActionScript

Utilizando uma Sintaxe de Script Adequada.......................................................67
Visão Geral do Painel Action..............................................................................68
Unidade 10: Navegação no Flash

Carregando Arquivos Externos...........................................................................72
Navegação na Timeline.......................................................................................75
Usando Label.......................................................................................................76
Criando Rolagem de Conteúdo...........................................................................77
Os Componentes no Flash...................................................................................80
3
Unidade 11: Trabalhando com Textos Dinâmicos

Busca de Variáveis em um Arquivo de Texto......................................................84
Texto com Formatação HTML............................................................................86
Unidade 12: Áudio no Flash

Importando Áudio para o Flash...........................................................................90
Configurações do Som no Flash..........................................................................90
Carregando Áudio Externo..................................................................................93
Inserindo Áudio em Botões.................................................................................95
Unidade 13: Criando Formulário

Utilizando Componentes.....................................................................................98
Configurando o Envio de Dados.........................................................................100
Unidade 14: Preloader

Construindo um Preloader...................................................................................104
Unidade 15: Criando Banners Animados

Criando um Banner.............................................................................................108
Banner Expansível...............................................................................................111
Usando Transições com Action Script................................................................114
Unidade 16: Importando Vídeo

Importando Vìdeos..............................................................................................118
Usando o Adobe Media Encoder CS4.................................................................120
Máscaras em Vídeos............................................................................................121
Vídeo em Tela Cheia...........................................................................................122
Unidade 17: Publicando Documentos no Flash

Configurações de Publicação..............................................................................126
Flash....................................................................................................................127
HTML..................................................................................................................127
GIF......................................................................................................................129
PNG.....................................................................................................................130
FullScreen............................................................................................................130
Unidade 18: Melhores Práticas

Organização da Linha de Tempo e da Biblioteca................................................134
Gravação de Arquivos e Controle de Versão.......................................................135
Organização do ActionScript em um Aplicativo.................................................135
Convenções de Vídeo..........................................................................................135
Exportação, Compressão e Hospedagem de Arquivos FLV................................136
4
Otimização dos Arquivos FLA para Saída SWF.................................................137
5
Unidade1: Introdução
Sobre o Curso
O Curso Adobe Flash CS4: Multimídia Interativo apresenta aos alunos as principais
ferramentas da última versão do programa, fornecendo inúmeras dicas e técnicas para
a sua aplicação.
O curso de Flash CS4 trás o que de mais atual a linguagem ActionScript 3.0 trouxe para
esta versão do programa. O aluno se surpreenderá com a facilidade e a eficiência que o
Adobe Flash CS4 pode realizar em projetos multimídia.
Para o profissional, o curso é fundamental por fornecer uma base para entender a
animação 2D e usar recursos de animações 3D deste programa.
Estrutura do Curso
As primeiras unidades apresentam a interface gráfica deste software, como fazer uma
animação básica e visualizá-la. Agrega, também, as ferramentas de desenho e as formas
geométricas deste software.
As unidades seguintes abordam tópicos como: animação com máscaras, animando com
filtros, botões e carregamentos de arquivos externos. Também, será montado um site
inteiro em Flash, com recursos de áudio, vídeo e utilização de componentes.
O curso trás exercícios para criar e manipular elementos visuais como: transições
através de programação e criação de banners.
Durante o transcorrer de todo o curso o aluno aprenderá a trabalhar de forma autônoma
e criativa com este software, conhecendo as mudanças e novidades incorporadas ao
programa.
6
• A Tela Inicial (Start Page)

• O Layout do Flash
• Personalizando a Interface
• Painel Properties
• A Timeline
• O Painel Tools
• FLA e SWF
As animações para Web, tempo atrás, eram feitas principalmente com GIFs animados.
A principal dificuldade para os desenvolvedores do Flash era a necessidade de plugin,
entretanto a quantidade de usuários que possui o plugin cresceu tanto que o software se
tornou o principal meio para a produção de animações para Web.
Na versão CS4 o Flash não vem mais com dois

programas distintos. Possui apenas a versão
Adobe Flash CS4 Professional.
A Tela Inicial (Start Page)

Quando iniciamos o Adobe Flash CS4 aparece à tela inicial, aonde podemos escolher
entre abrir um dos trabalhos recentes criados com o Flash, criar um arquivo em branco
e escolher entre as seguintes possibilidades:
- Flash File: novo documento básico do Flash
em branco, opção que utiliza a estrutura de
criação tradicional do programa. Temos esta
opção tanto para a versão 2.0 quanto 3.0 do
ActionScript.
- Flash File (Adobe AIR): O Adobe®
AIR™ é a execução entre vários sistemas
operacionais, permite potencializar os
recursos locais da área de trabalho e os dados
para garantir experiências mais pessoais e
envolventes.
- Flash File (Mobile): utilizada para criar um arquivo compatível com o Flash Lite
(Flash para dispositivos móveis).
- ActionScrit File: gera outro documento numa espécie de editor de texto dentro do
Flash para digitarmos scripts do Flash. Este arquivo possui a extensão “. as”.
- ActionScript Communication File: funciona da mesma forma que a opção anterior,
mas destinado a escrever scripts para o Flash Media Server (servidor para aplicações
server) O arquivo gerado terá a extensão “. asc”.
8
- Flash Javascript File: permite criar scripts que controlem e auxiliem a utilização do
programa. O arquivo terá a extensão “JSFL”.
- Flash Project: Um projeto Flash pode agrupar e organizar diversos arquivos e
posteriormente publicá-los no servidor de hospedagem que for configurado.
É possível ainda criar um trabalho baseado num modelo (Template) preexistente.
O Layout do Flash
O layout do Flash é desenvolvido para o melhor aproveitamento do espaço, facilitando
sua utilização.
Na tela inicial crie um novo documento (Flash File ActionScript 3.0).
Do lado direito temos os painéis juntos. Podemos expandi-los ou retraí-los apenas

clicando nas setas ao lado direito superior.
Ao escolher esta opção vemos os painéis em forma de ícones:
9
Alguns painéis possuem opções adicionais que podem ser chamadas clicando no ícone
a sua direita no topo.
Para abrir um painel que não esteja na tela, clique no menu Window, e entre suas opções
escolha o painel desejado.
Também, é possível alterar a posição de um painel bastando arrastá-lo pela sua barra
superior.
Para remover um painel do local em que se encontre encaixado, basta arrastá-lo para
fora de sua área, primeiro aproximando o cursor do topo do painel, em seguida
pressionando o botão do mouse e arrastando a janela para a área desejada.
Para anexá-lo a alguma área, basta movê-lo e quando estiver em um local que possa ser
encaixado, a área será realçada (em tom de azul).
Se soltá-lo em uma área que não ficou realçada, o painel ficará flutuante na tela.
Se em algum momento desejarmos que todos os painéis sejam escondidos, basta
clicarmos na tecla F4.
Personalizando a Interface
É importante a customização da interface do Flash de acordo com seu foco de trabalho,
que irá permitir uma maior produtividade do seu trabalho.
Temos na parte superior do Flash uma área chamada Workspace, que é responsável por
escolher e gerenciar os layouts de área de trabalho como:
forma e posicionamento dos painéis. Por default temos a área
de trabalho “Classic”.
10
É possível gravar as configurações que tenhamos criado para escolhê-la posteriormente,

escolhendo a opção New Workspace. Na janela digite um nome para este layout de
painéis e clique em OK.
Caso queira renomear ou remover um modelo de layout criado na área de Workspace
basta escolher a opção Manage Workspaces e definir as opções desejadas na janela.
Painel Properties
O Painel Properties fácil acesso aos atributos usados mais
frequentemente da seleção atual, no Palco ou na Linha do tempo. É
possível fazer alterações nos atributos do objeto ou do documento,
sem acessar menus ou painéis que também controlam esses
atributos.
Dependendo da seleção atual, este painel exibe informações e configurações para o

documento, o texto, o símbolo, a forma, o bitmap, o vídeo, o grupo, o quadro ou a
ferramental atual. Quando dois ou mais tipos diferentes de objetos são selecionados, o
Painel Properties exibe o número total de objetos selecionados.
Uma área muito importante no Flash é o palco (Stage). Somente os elementos que
estiverem nessa área aparecerão do filme gerado pelo programa.
O Stage é semelhante à lente de uma filmadora, pois apenas o que estiver no seu foco
será apresentado como resultado final do filme.
Quando não estivermos com nenhum objeto selecionado
no palco a opção basta clicarmos no botão Edit ao lado
da opção Size.
- Na área Dimensions definimos Largura (Width) e altura (Height) do Stage do Flash.

- Na área Match podemos fazer com que as dimensões do Stage se modifiquem de
acordo com a área de impressão (Printer), que acomodem todos os elementos em cena
(Contents) ou que utilizem à dimensão padrão (Default).
- Em Background color escolhemos a cor do Stage do Flash.
- Em Frame rate (por default o flash vem com 24) definimos a quantidade de frames
11
por segundo do documento.

- Em Ruler Units colocamos a medida das réguas.
Se desejarmos que essas configurações sejam a padrão para os novos filmes do Flash
(exceto os metadados, que devem ser criados para cada filme), basta clicarmos no botão
Make Default.
A Timeline
A linha do tempo organiza e controla o conteúdo de um documento com o passar do
tempo em camadas e quadros. Como os filmes, os documentos Flash dividem espaços
de tempo em quadros. As camadas são como várias faixas de filme empilhadas uma em
cima da outra, cada uma contendo uma imagem diferente, que é exibida no Palco.
Os principais componentes da Linha
do tempo são camadas (layers),
quadros (frames) e o indicador de
reprodução.
As camadas em um documento são listadas em uma coluna no lado esquerdo da Linha

do tempo. Os quadros contidos em cada camada são exibidos em uma linha à direita
do nome da camada. O cabeçalho da Linha do tempo, na parte superior da Linha do
tempo, indica os números dos quadros. O indicador de reprodução indica o quadro atual
exibido no Palco. Durante a reprodução de um documento, o indicador de reprodução é
movido da esquerda para a direita em toda a Linha do tempo.
Sua velocidade é medida pela quantidade de quadros que passa a cada segundo (frames
por segundo) e quanto maior a quantidade de quadros por segundo, mais rápida a
animação estará.
Para configurarmos essa velocidade, no painel de propriedades, basta

alterarmos o valor do Frame Rate (FPS).
12
O Painel Tools
Este painel contém as ferramentas necessárias para desenharmos, criarmos objetos,

definirmos cores no Flash e usar as ferramentas 3D.
Toda a ferramenta que possui uma pequena seta preta na parte

inferior direita possui mais ferramentas. Quando o botão do mouse é
mantido pressionado sobre um ícone, as outras ferramentas no grupo
são exibidas em um menu pop-up.
►► Dependendo da ferramenta selecionada, talvez um conjunto de modificadores seja

exibido na área de opções, na parte inferior do painel Tools.
Podemos, também, personalizar este painel clicando

em Edit > Customize Tools Panel.
FLA e SWF
Os arquivos editáveis do Adobe Flash possuem o formato.fla, entretanto, por guardarem
todas as informações necessárias para edição, possuem tamanhos maiores que o ideal
para Web.
Quando finalizamos um filme, geramos um arquivo extremamente leve que será levado
para Web, é o formato swf (Shockwave Flash).
O swf pode ser importado para um novo filme, mas não pode ser editado.
13
Anotações:
14
• Modo Object Drawing

• Object Primitive
• Formas Rectangle e Oval
• Forma PolyStar
• Desenhando com a Ferramenta Pencil
• Pintando com o Brush
• A Ferramenta Pen
• Ajustando e Remodelando os Segmentos
• Transformando Objetos
• O Painel Align
• Cores e Gradientes
• Laboratório: Iniciando a Montagem do Hotsite
No Flash, podemos criar vários tipos de objetos gráficos com diferentes modos de
desenho e ferramentas de desenho. Cada tipo tem suas próprias vantagens e desvantagens.
Entendendo os recursos dos diferentes tipos de objeto gráfico, tomaremos boas decisões
sobre quais tipos de objetos usar em nosso trabalho.
Modo Object Drawing

Por padrão (quando o modo Object Drawing estiver
desativado) as formas que criarmos não serão
consideradas como objetos separados. Por exemplo,
se desenharmos um círculo e sobrepor um círculo
menor sobre ele ( de cores diferentes) e depois
selecionar o círculo menor e movê-lo, a parte do segundo círculo sobreposta ao primeiro
é removida.
Quando uma forma tem um traçado e um preenchimento, estes são considerados
elementos gráficos separados, que podem ser selecionados e movidos de forma
independente.
Quando as duas formas forem de cores iguais e estiverem com o

modo Object Drawing desativado as formas se unem.
Quando trabalhamos com o modo Object Drawing ativado, os objetos que criarmos
serão tratados como objetos separados, os quais podem ser sobrepostos a outros sem
haver a perda de nenhuma informação.
Um objeto criado por
este modo é diferenciado
na tela por uma área
retangular envolvendo-o.
►► Se a forma foi desenhada sem o modo Object Drawing ativado, podemos mudar o
mesmo clicando no menu Modify > Combine Objects > Union.
16
Object Primitive
Primitivas de objetos são formas gráficas que permitem que ajustemos suas
características. Isso permite que controlemos precisamente o tamanho, o raio do canto e
outras propriedades da forma depois de criá-la sem ter que desenhá-la desde o começo.
Os dois tipos de primitivas que estão disponíveis são: Rectangle
Primitive e Oval Primitive.
Quando criamos retângulos ou formas ovais usando as ferramentas

Primitve Rectangle ou Primitive Oval, o Flash desenha as formas
como Object Drawing. Com essas ferramentas podemos especificar o
raio do canto de retângulos, o ângulo inicial, final e o raio interno de
ovais usando os controles do Painel Properties.
►► O painel properties retém os valores do último objeto que você editamos. Por
exemplo, se você modificar um retângulo e depois desenhar um segundo retângulo.
Formas Rectangle e Oval

Com essas ferramentas Oval e Rectangle podemos criar formas geométricas básicas e
aplicar traçados, preenchimentos e especificar cantos arredondados.
Para as estas ferramentas, arraste e mantenha a tecla Shift pressionada para restringir as
formas em círculos e quadrados.
Para determinar um tamanho específico destas formas, selecione a
ferramenta Oval ou Rectangle e pressione a tecla ALT. Em seguida,
clique no Palco para exibir a caixa de Oval Settings.
17
Forma PolyStar
Selecione a ferramenta PolyStar clicando e segurando o botão do mouse na ferramenta
Rectangle e selecionando no menu pop-up que aparece.
No painel Properties clique no botão Options e na caixa de diálogo Tools
Settings, escolha a opção star.
Clicando no palco e arrastando já teremos uma estrela.
Desenhando com a Ferramenta Pencil

Para desenhar linhas e formas, use a ferramenta Pencil (lápis) quase da mesma maneira
em que usa um lápis de verdade para desenhar. Para aplicar suavização ou correção às
linhas e formas enquanto desenha, selecione um modo desenho para a mesma.
- Straighten: para desenhar linhas retas e converter aproximações de triângulos, ovais,

círculos, retângulos e quadrados nessas formas geométricas comuns.
- Smooth: para desenhar linhas curvas suaves.
- Ink: para desenhar linhas a mão livre sem aplicar modificações.
Pintando com o Brush

A ferramenta Brush desenha traçados semelhantes a pinceladas. Ela cria efeitos
especiais, inclusive caligráficos.
Selecione a forma e o tamanho do pincel

usando modificadores da ferramenta Brush,
na parte inferior do painel Tools.
18
A Ferramenta Pen
Para desenhar caminhos precisos como linhas retas
ou curvas suaves e fluidas, usamos a ferramenta Pen.
Clicamos para criar pontos nos segmentos de linha reta
e arrastamos para criar pontos nos segmentos de linha
curva.
O primeiro segmento desenhado não fica visível até que cliquemos num segundo ponto
de ancoragem (a menos que tenhamos especificado Show pen preview na categoria
Drawing em Preferences).
O caminho mais simples que podemos desenhar com a ferramenta
Pen é uma linha reta, feita com a seleção da ferramenta Caneta
para criar dois pontos de ancoragem. Se continuarmos clicando,
criaremos um caminho composto de segmentos de linha reta
conectados por pontos de canto.
Para fechar o caminho, posicione a ferramenta Pen sobre o primeiro ponto de ancoragem
(vazio). Um pequeno círculo aparecerá ao lado do ponteiro da ferramenta Pen.
As curvas são mais fáceis de serem editadas e seu sistema pode exibi-las e imprimi-las
mais rápido se elas forem desenhadas usando o menor número de pontos de ancoragem
possível. O uso de muitos pontos também pode gerar saliências indesejadas em uma
curva.
Para desenhar uma curva, sigua os passos:
- Posicione a ferramenta Pen no início da curva e
mantenha o botão do mouse pressionado.
- O primeiro ponto de ancoragem aparece e o
ponteiro da ferramenta Pen muda para uma seta.
- Arraste para definir a inclinação do segmento curvado que estiver criando e, em
seguida, solte o botão do mouse.
Para adicionarmos um ponto de ancoragem, posicionamos o ponteiro
sobre um segmento do demarcador e clicamos em cima da curva.
Para excluirmos um ponto de ancoragem, posicionamos o ponteiro

sobre um ponto de ancoragem com a ferramenta Delete Anchor Point
19
e clicamos.
Ajustando e Remodelando os Segmentos

Para ajustarmos um segmento reto ou curvo, selecione a ferramenta Subselection (seta
branca) e selecione o segmento. Use-a, também, para arrastar um ponto de ancoragem
do segmento para uma posição nova.
Ao selecionarmos o ponto, veremos uma ou duas alças que orientam a curvatura. Para
alterar a curva, podemos arrastar as extremidades dessas alças até que a forma esteja do
nosso agrado.
Para ajustar a forma da curva nos dois lados do ponto de ancoragem, arraste o ponto de
ancoragem ou a alça.
Para remodelar uma linha ou contorno da forma, arraste qualquer ponto da linha usando
a ferramenta Selection (seta preta). O ponteiro muda para indicar o tipo de remodelagem
que pode executar na linha ou no preenchimento.
O Flash ajusta a curva do segmento de linha para acomodar a nova posição do ponto
movido.
Se o ponto reposicionado for um ponto final, a linha será alongada ou
encurtada. Se o ponto reposicionado é um canto, os segmentos de linha
que formam o canto permanecem retos enquanto se tornam mais longos
ou mais curtos.
Para modificar os pontos usamos a ferramenta Subselect . Para isso devemos selecionar
a linha com a ferramenta e clicar sobre os pontos que desejamos alterar.
20
Transformando Objetos
Podemos realizar transformações individuais ou combinar várias transformações,
tais como mover, girar, dimensionar, inclinar e distorcer, usando a ferramenta Free
Transform.
Sigua os procedimentos abaixo:
- Selecione um objeto gráfico, grupo, ocorrência ou bloco de texto no Palco.
- Clique na ferramenta Free Transform.
►► Mover o ponteiro sobre e ao redor da seleção faz com que o ponteiro mude para
indicar qual função de transformação está disponível.
- Para transformar a seleção, arraste as alças.
- Para mover a seleção, posicione o ponteiro sobre o objeto na caixa

delimitadora e arraste o objeto para uma nova posição. Não arraste
o ponto de transformação.
- Para definir o centro de rotação ou dimensionamento, arraste o ponto

de transformação para um novo local.
- Para girar a seleção, posicione o ponteiro perto da parte de fora

da alça do canto e arraste. A seleção gira em torno do ponto de
transformação. Arraste com a tecla Shift pressionada para girar em
incrementos de 45°.
- Para girar ao redor do canto oposto, arraste com a tecla Alt pressionada.
- Arraste com a tecla Shift pressionada para redimensionar proporcionalmente.
- Para dimensionar somente na respectiva direção, arraste uma alça do canto ou uma
alça lateral horizontal ou verticalmente.
21
- Para inclinar a seleção, posicione o ponteiro no contorno entre as alças de transformação

e arraste.
- Para finalizar a transformação, clique fora do item selecionado.
►► Pode ser usado, também, o modificador de Envelope que permite uma deformação
nos objetos. Um envelope é uma caixa delimitadora que contém um ou mais objetos. As
alterações feitas em uma forma de envelope afetam a forma dos objetos no envelope.
Editamos a forma de um envelope ajustando seus pontos e alças tangentes. Para acioná-
lo clique me Modify > Transform > Envelope.
O Painel Align
O painel Align permite que alinhemos os objetos selecionados ao longo
do eixo horizontal ou vertical. Podemos alinhar os objetos verticalmente
ao longo da borda direita, do centro ou da borda esquerda dos objetos
selecionados ou horizontalmente ao longo da borda superior, do centro
ou da borda inferior dos objetos selecionados.
Quando a opção To stage estiver selecionada indica que todas as modificações serão
aplicadas em relação à Stage.
Temos uma facilidade no Flash quanto temos mais de um
elemento no palco. Enquanto arrastamos algum objeto
aparecem linhas pontilhadas indicando um possível
alinhamento em relação a outro elemento. Este é o modo
Snap Align.
Para ativar este ajuste, escolha a opção de menu: View > Snapping > Snap Align (por
padrão esta opção já vem habilitada)
Cores e Gradientes
Modelos de cores descreve as cores que vemos e com que trabalhamos em gráficos
digitais. Cada modelo de cor, como RGB, HSB ou CMYK, representa um método
diferente para descrever e classificar cor. Os modelos de cores usam valores numéricos
para representar o espectro visível da cor. O espaço de cor é uma variante de um modelo
de cor e tem uma gama (intervalo) específica de cores. Por exemplo, dentro do modelo
de cores RGB, há vários espaços de cores: Adobe® RGB, sRGB e Apple® RGB.
22
Embora cada um desses espaços de cor defina a cor usando os mesmos três eixos (R, G
e B), as respectivas gamas são diferentes.
Como cada dispositivo tem o seu próprio espaço de cores, cada um pode reproduzir
cores apenas na sua gama.
Ao criarmos cores para uso em documentos Flash, devemos lembrar que, embora seja
impossível coincidir com exatidão todas as cores em dispositivos diferentes, podemos
obter bons resultados considerando os recursos de exibição gráfica dos dispositivos em
uso por nosso público-alvo.
O painel Color permite que modifiquemos a paleta de cores de

um FLA e alteremos as cores de traçados e preenchimentos.
- Para aplicar a cor na arte existente, selecione um objeto ou objetos do Palco e selecione
Window > Color.
- Para selecionar a tela do modo cores, selecione RGB (configuração padrão) ou HSB
no menu do painel no canto superior direito.
- Clique no ícone Stroke ou Fill para especificar o atributo a ser modificado.
Um gradiente é um preenchimento multicolorido no qual uma cor gradualmente
muda para outra cor. O Flash permite que apliquemos até 15 transições de cor em um
gradiente. A criação de gradiente é uma boa maneira de criar uma graduação suave de
cores em um ou mais objetos.
Para aplicar um preenchimento gradiente em arte existente, selecione um objeto ou
objetos do Palco:
- Se o painel Cor não estiver visível, selecione Window > Color.
- Selecione o tipo de gradiente no menu Style:
Linear: cria um gradiente que matize do ponto inicial ao final numa linha reta.
Radial: produz um gradiente que se mistura para fora em um caminho circular a partir
de um ponto focal central.
Depois de aplicado o gradiente podemos modificá-lo selecionando a
ferramenta Gradient Transform.
Pressione Shift para restringir a direção do preenchimento gradiente linear
para múltiplos de 45°.
23
Laboratório: Iniciando a Montagem do Hotsite

1- Crie um arquivo de 500x500 pixels.
2- Desenhe um retângulo com preenchimento de gradiente em tons de cinza, deixando
as bordas um pouco arendondadas.
3- Posicione esta forma no centro do palco.
4- Mude a cor de fundo do palco a seu gosto.
5- Salve este documento como index.fla
24
• Tipos de símbolos
• Biblioteca
• Trabalhando com Linhas de Tempo
• Animação Interpolada
• Usando o Motion Editor
• Interpolação de Formas
• Shape Hints
• Animação quadro a quadro
• Movimentando objetos no espaço 3D
• Painel Motion Presets
Os elementos desenhados no Flash com as suas ferramentas de desenho correspondem

a formas vetoriais. Esses desenhos não suportam determinados tipos de animação
que o Flash pode realizar, bem como não permitem diversas aplicações. Para tornar o
elemento compatível com as aplicações, é necessário convertê-lo em símbolo.
Ao transformarmos um desenho ou objeto em um símbolo, aplicamos um comportamento
a esse objeto, indicando que agora ele deve receber ações e comportar-se de forma
específica.
Todo símbolo criado é armazenado na Library (Biblioteca) e pode ser reutilizado
diversas vezes, o que não aumenta de forma significativa o tamanho final do filme.
Tipos de símbolos
Cada símbolo possui uma Linha de tempo e um Palco exclusivos e completos, com
camadas. Pode adicionar quadros, quadros-chave e camadas à Linha de tempo de um
símbolo, da mesma forma que na Linha de tempo da cena principal. Temos os seguintes
símbolos no Flash:
- Gráficos (Graphic): usamos estes símbolos gráficos para imagens estáticas e para criar
partes reutilizáveis de animação vinculadas à Linha de tempo principal. Os símbolos
gráficos operam em sincronização com a Linha de tempo principal. Em uma sequência
de animação de símbolo gráfico, os controles e sons interativos não funcionam. Os
símbolos gráficos adicionam menos tamanho ao arquivo FLA do que botões ou clipes
de filme, pois não possuem Linha de tempo.
- Botões (Button): usamos estes símbolos para criar botões interativos que respondam
a cliques do mouse, rolagens ou outras ações.
- Clipe de Filme (Movie Clip): com estes símbolos podemos criar partes reutilizáveis
de animação. Os clipes de filme têm a sua própria Linha de tempo com vários quadros,
independente da Linha de tempo principal: imagine-os como aninhados dentro de uma
Linha de tempo principal que pode conter controles e sons interativos e até outras
ocorrências de clipe de filme. Também podemos criar botões animados, colocando
ocorrências de clipe de filme dentro da Linha de tempo de um símbolo de botão.
Para criar um símbolo sigua os passos:
1- Crie uma forma semelhante a uma “lua” no palco.
26
2- Com essa forma selecionada, clique no menu:

Modify > Convert to Symbol ou pressione a tecla
F8.
Abre-se a tela Convert to Symbol. Nessa tela, além de nomeá-lo, podemos definir que
tipo de símbolo o objeto será. Ao definir o tipo de símbolo, estamos determinando de
que forma nosso objeto se comportará.
3- Atribua um nome ao seu símbolo, definindo que ele deve ser um Movie Clip.
Observe que ao lado das opções de comportamento do símbolo temos uma opção
denominada Registration, na qual podemos definir o ponto de registro do símbolo, o
qual é muito útil, uma vez que permite determinar o ponto de rotação de um símbolo,
por exemplo.
4- Deixe marcada a opção padrão (ponto superior esquerdo).
5- Clique em OK.
Biblioteca
Os símbolos ficam armazenados para que possamos utilizá-los a qualquer
momento no Flash.
Para abrir a biblioteca escolha o menu: Window > Library ou utilize as
teclas de atalho: CTRL + L.
Para aplicar um símbolo no palco que esteja na biblioteca, basta arrastá-lo da biblioteca
para o palco. Quando um elemento é levado da biblioteca para o palco recebe o nome
de instância, uma vez que ele é apenas uma aparição do símbolo na tela.
Podemos ter um símbolo aparecendo diversas vezes na tela. Neste caso teríamos
diversas instâncias do símbolo no palco.
Uma vez que modifiquemos um símbolo, todas as instâncias que o usam como referência
também sofreram a alteração.
6- Vamos criar uma estrela. Selecione a forma PolyStar Tool e na janela Properties
27
clique em Options e selecione a opção Star

7- Desenhe esta forma no palco do Flash e transforme-a em um símbolo do tipo Movie
Clip.
Observe que nossos dois símbolos criados estão na biblioteca.
Ao convertemos um objeto em Movie Clipe, atribuímos a ele a possibilidade de ser
animado independentemente do filme principal.
8- Vamos entrar no modo de edição do símbolo “estrela”.

Dê um duplo clique nela.
Na edição deste símbolo temos camadas, o que significa que
podemos animar a estrela na sua própria linha de tempo.
Trabalhando com Linhas de Tempo

Como os filmes, os documentos Adobe® Flash® CS4 Professional dividem espaços de
tempo em quadros. Na Linha de tempo, trabalhamos com esses quadros para organizar
e controlar o conteúdo do documento.
O quadro-chave é um quadro em que aparece uma nova ocorrência do símbolo na
Linha do tempo pela primeira vez. Podemos adicionar um quadro-chave em branco
à Linha do tempo como alocador de espaço dos símbolos que planejamos adicionar
posteriormente ou para deixar explicitamente o quadro em branco.
O quadro-chave de propriedade é aquele em que definimos uma mudança nas
propriedades de um objeto para uma animação. O Flash pode interpolar ou preencher
automaticamente os valores de propriedade entre os quadros-chave de propriedade a
fim de produzir animações fluentes. Como os quadros-chave de propriedade podemos
produzir uma animação sem desenhar cada quadro individualmente, eles facilitam a
criação da animação.
Uma série de quadros contendo animação interpolada é chamada de interpolação de
movimento.
Um quadro interpolado é qualquer quadro que faça parte de uma interpolação de
movimento.
Um quadro estático é qualquer quadro que não faça parte de uma interpolação de
28
movimento.
Organizamos quadros-chave e quadros-chave de propriedade na Linha do tempo para
controlar a sequência de eventos no seu documento e na animação correspondente.
8- Clique no primeiro quadro da layer1 e escolha a opção
Create Motion Tween.
Automaticamente o Flash cria 24 quadros na linha de tempo.
9- Com a cabeça leitora do frame 24, no painel Properties opção Color Effect e escolha
Alpha no menu Style. Deixe o Alpha em 0%.
10- Para ver a animação clique em CTRL + Enter.
Podemos observar:
Uma extensão de quadros com um plano de fundo azul
indica uma interpolação de movimento.
Um ponto preto no primeiro quadro da extensão indica que a extensão interpolada tem
um objeto de destino atribuído a ele. Losangos pretos indicam o último quadro e todos
os outros quadros-chave de propriedade.
11- Salve este arquivo na pasta da lição como ceu.fla
Animação Interpolada
As interpolações são aplicadas às ocorrências de símbolos e campos de texto.
- Desenhe uma forma no palco.
- Na layer 1 selecione o quadro e clique com o botão direito em Create Motion Tween
Se o objeto não for do tipo objeto interpolável uma caixa de diálogo será exibida. A
caixa de diálogo permite converter a seleção em um símbolo movie clipe
- Converta a seleção em um movie clipe em Ok.
- Para adicionar movimento à interpolação clique e arraste o objeto

no Palco para uma nova posição.
29
Aparece um caminho de movimento no Palco, mostrando o caminho da posição no

primeiro quadro da extensão de interpolação até a nova posição.
- Clique e arraste o final da animação para
aumentar o seu tempo de deslocamento.
- Posicione a cabeça leitora na linha de

tempo no quadro 25, por exemplo, e arraste o
símbolo no palco.
Para modificar a trajetória do movimento podemos selecionar a

ferramenta Selection e aproximar da trajetória para fazermos um
movimento curvo, por exemplo.
►► Toda modificação da animação é baseada no objeto, basta posicionarmos a cabeça

leitora no tempo que queremos que ocorra a modificação e deslocar o objeto no palco.
Usando o Motion Editor

O painel Motion Editor permite exibir todas as propriedades de interpolação e os
respectivos quadros-chave de propriedade. Ele também oferece ferramentas para
adicionar precisão e detalhes a interpolações.
- Continuando na mesma animação que estamos trabalhando, selecione o objeto no
palco e clique na opção Motion Editor na aba ao lado do painel Timeline.
30
Com o Motion Editor podemos aplicar atenuação a qualquer curva de propriedade. A

aplicação de atenuação no Editor de movimento permite criar certos tipos de efeitos
complexos de animação sem criar caminhos complexos de movimento.
►► Algumas propriedades têm valores mínimos ou máximos que não podem ser
excedidos, como Transparência Alpha (0-100%).
- Na opção Transformation e com a cabeça leitora no
início do gráfico, selecione Scale X (com a opção
Link habilitada) diminuindo o valor e assim
diminuindo o tamanho do objeto, também.
- Posicione a cabeça leitora entre os quadros
15 e 20 no gráfico a marque 100% para a
opção Scale X, que fará proporcional ao
Scale Y, também.
Para ajustar quais propriedades aparecem no Editor de movimento, clique no triângulo

perto de uma categoria de propriedade para expandir ou reduzir a categoria.
Pressionando a tecla CTRL definimos um ponto no gráfico.
Pressionando a tecla Alt deixamos este ponto mais suave.
- Teste a animação e veja que a mesma fica mais complexa e suave com o Motion Editor
Interpolação de Formas
Na interpolação de forma, desenhamos uma forma vetorial em um quadro específico
na Linha do tempo e alteramos essa forma ou desenha outra forma em outro quadro
específico. O Flash então interpola as formas intermediárias para os quadros
intermediários, criando a animação de uma forma se transformando em outra.
31
As etapas a seguir mostram como criar uma interpolação de formas do quadro 1 ao

quadro 30 da Linha do tempo.
- No quadro 1, desenhe um quadrado com a ferramenta Rectangle.
- Selecione o quadro 30 da mesma camada e adicione um quadro-chave em branco,
escolhendo Insert > Timeline > Blank Kreyframe, ou pressionando F7.
- No Palco, desenhe um círculo com a ferramenta Oval no quadro 30.
- Na Linha do tempo, selecione um dos quadros entre os dois quadros-chave na camada
que contém as duas formas.
- Com o botão direito do mouse escolha Create
Motion Tween.
O Flash interpola as formas de todos os quadros entre os dois quadros-chave.
- Visualize a animação teclando CTRL + Enter.
Shape Hints
Em alguns casos a maneira como o Flash interpreta a transição entre as formas é um
pouco confusa, mas temos um modo de indicar ao Flash como deve ser através das
Shapes Hints. Essa opção diz que pontos definidos no início da animação devem
corresponder a pontos que definiremos no final.
- Na mesma animação que acabamos de fazer, selecione o primeiro quadro
da animação e vamos colocar um Shape Hint que servirá de referência
para a animação, escolhendo a opção de menu: Modify > Shape > Add
Shape Hint.
- Um círculo vermelho aparece com a letra a em seu centro. Arraste-o para o canto
superior esquerdo da forma.
- Vá ao último quadro da animação e veremos novamente o pequeno círculo. Leve-o
para a posição que considerar correspondente ao círculo do primeiro quadro.
- Repita estes passos para inserir mais Shape Hints.
►► Importante: Como as Shape Hints utilizam como seus identificadores letras, teremos
no máximo 26 Shape Hints.
Transição entre Textos
32
Animação Quadro a Quadro

Esse processo remonta aos primórdios da animação e se constitui na seqüência de várias
imagens, uma levemente diferenciada da anterior para simular o movimento.
É o tipo de animação mais trabalhoso, entretanto é o que possui resultados mais
satisfatórios em termos visuais.
- Para criarmos uma animação quadro a quadro, vamos desenhar uma elipse e inserir um
Keyframe na posição 2 (a tecla de atalho é o F6).
- Neste caso, a alteração será o deslocamento da elipse. Para fazer isso, vamos selecionar
o quadro 2 e deslocar o desenho da elipse um pouco para baixo da posição atual.
- Repita estes procedimentos até chegar ao quadro 10 da Timeline,
sempre primeiro inserindo o quadro e em seguida deslocando um
pouco para baixo a forma.
Ao final, teremos efetuado nossa primeira animação. Para testá-la, podemos pressionar
a tecla Enter ou testá-la na janela de testes do Flash clicando em CTRL + Enter.
Movimentando Objetos no Espaço 3D

Podemos mover movie clipes no espaço 3D com a ferramenta 3D Translation e 3D
Rotation.
- Crie uma forma no palco do Flash.
- Crie uma animação Motion Tween.
- Selecione a ferramenta 3D Translation.
- Para mover o objeto arrastando-o com a ferramenta, mova o ponteiro sobre os controles
do eixo x, y ou z. O ponteiro muda de aparência quando passa sobre um dos controles.
Ao selecionarmos vários movie clipes, podemos mover
um dos objetos selecionados com a ferramenta Translação
3D e os outros se moverão junto com ele.
33
Podemos girar os movie clipes no espaço 3D com a ferramenta 3D Rotation . Um

controle de rotação 3D aparece na parte superior dos objetos selecionados no
Palco. O controle X é vermelho, o controle Y é verde e o controle Z é azul.
- Coloque o ponteiro sobre um dos quatro controles do eixo de rotação.

O ponteiro muda de aparência quando passa sobre um dos quatro controles.
- Arraste um dos controles de eixo para girar em torno desse
eixo ou o controle de rotação livre (círculo laranja externo) para
girar X e Y simultaneamente.
Painel Motion Presets

Neste painel salvamos as interpolações de movimento pré-configuradas que podemos
aplicar a um objeto no Palco. Bastando selecionar o objeto e clicar no botão Aplicar, no
painel Motion Presets.
- Crie uma animação com interpolação de movimento no palco.
- Habilite o painel Motion Presets através do menu Window.
- Selecione o objeto que contém a interpolação.

- No painel motion presets clique no ícone Save selection
as preset.
- Feche este arquivo e crie um novo.

- Desenhe outra forma no palco
- Com a forma selecionada clique no botão Apply do painel motion presets.
O movimento é aplicado de forma a começar na posição atual do movie clipe no Palco.
Se a predefinição tiver um caminho de movimento associado a ele, o caminho aparece
no Palco.
Para aplicar a predefinição de forma que o respectivo movimento termine na posição
atual do objeto no Palco, pressione a tecla Shift e clique no botão Aplicar.
34
• As Camadas (Layers)
• Distribuindo Elementos em uma Camada
• Camada Motion Guide
• Ferramenta Text Tool
• Transição entre Textos
• Importando Mídias
As Camadas (Layers)
As camadas (Layers) correspondem a um método de trabalho muito prático em qualquer
tipo de software que se utilize de imagens gráficas, sejam elas vetoriais ou bitmap. Elas
permitem organizar mais facilmente conteúdos e localizar elementos.
Um projeto em Flash é mais facilmente organizado e composto graças às camadas.
As camadas podem ser ainda, subdivididas em pastas, que permitem dividir e organizar
todas as categorias de objetos em um projeto de maior amplitude.
O manuseio de camadas no Flash é feito de forma idêntica ao de diversos outros
programas de edição de imagem. Entretanto, temos algumas opções especiais.
- Insert Layer: permite adicionar uma nova camada a lista;
- Insert Layer Folder: insere uma nova pasta para organizar as camadas
correspondentes.
- Delete Layer: remove uma ou mais camadas selecionadas.
- Show/Hide All Layers: serve para determinar se as camadas estarão visíveis ou não
no documento. Ao clicar no olho as camadas ficarão ocultas e ao clicar novamente,
serão exibidas. Podemos escolher apenas uma camada desejada, bastando clicar na
bolinha correspondente da camada.
- Lock/Unlock All Layers: cria uma “trava” na(s) camada(s), impedindo que os seus
objetos sejam modificados (movidos, deletados, selecionados).
- Show All Layers as Outlines: possibilita esconder a visualização dos preenchimentos
e contornos do objeto, deixando-os visíveis apenas através de uma fina borda colorida.
É uma alternativa a opção de ocultar completamente a camada, uma vez que com essa
opção não perdemos a noção do local e tamanho do objeto.
Ao selecionar uma camada, observe a presença de um pequeno lápis, indicando que é a
camada ativa a ser editada.
Ao bloquear a camada, um risco vermelho aparece sobre o lápis,
determinando que aquela camada não pode ser editada por encontrar-se
bloqueada.
É extremamente importante desenvolvermos o costume de sempre
atribuir nomes às camadas criadas, uma vez que esse procedimento
36
otimiza a busca de objetos. Para nomear ou renomear uma camada basta clicarmos duas
vezes sobre seu nome e digitar o nome desejado. Para aplicar o nome é só clicar em
Enter.
Para alterar a ordem das camadas, arraste uma ou mais camadas ou
pastas na Linha do tempo até a posição desejada.
Distribuindo Elementos em uma Camada

Quando temos vários obejtos no palco e queremos que cada animação aconteça em um
determinado tempo ou ao mesmo tempo organizamos cada objeto em uma camada. Por
exemplo, textos em uma e forma em outra
Se estes objetos estiverem na mesma camada ficamos restritos na animação que cada
um pode ter.
Tendo três fomas em uma mesma camada, podemos
selecionar todos e clicando com o botão direito do mouse
selecionar a opção Distribute to layers (Modify > Timeline >
Distribute to Layers).
►► Quando aplicamos o comando Distribute to Layers, a camada criada assume

automaticamente o nome que atribuímos ao elemento. Quando trabalhamos com textos
e os distribuímos em camadas, as camadas assumem os nomes dos textos.
Camada Motion Guide

Durante uma animação, muitas vezes queremos que nosso objeto não apenas se
movimente entre um ponto e outro, mas também siga uma trajetória predefinida.
Para anexar uma trajetória a uma animação, utilizaremos um tipo especial de layer do
Flash chamada Motion Guide.
1- Crie um arquivo novo.
2- Selecione a camada e escolha a opção Add Classic Motion Guide.
3- Crie uma forma geométrica no palco do Flash e transforme-a em um
símbolo gráfico, deixando-o na camada Layer 1.
4- Agora selecione a camada Guide: Layer 1 e faça uma traçado com a ferramenta
Pencil.
37
5- Estenda as duas layers até o quadro 30.

Após o caminho da Motion Guide estar desenhado para o objeto realmente
seguir essa trajetória, é necessário que tanto no primeiro quanto no último
quadro da animação o ponto central do objeto deve estar conectado a
trajetória.
6- Posicione o ponto central objeto na trajetória tando no quadro e como no 30.
7- Clique entre os quadros na layer 1 e selecione Create Classic Tween.
8- Teste e veja como ficou sua animação.
As camadas de guias não são exportadas nem exibidas em um arquivo SWF. Qualquer
camada pode ser uma camada de guia. As camadas de guia são indicadas por um ícone
de guia, à esquerda do nome da camada.
Ferramenta Text Tool

Essa ferramenta é utilizada para inserirmos textos no Flash.
Existem duas opções para esta ferramenta: podemos clicar na área que o bloco de texto
deve iniciar e depois digitar ou podemos clicar na área em que o bloco de texto deve
iniciar e depois, mantendo o botão do mouse pressionado, arrastar até a área final do
bloco, criando uma área predeterminada que o texto deve utilizar.
Clicando na Text Tool podemos configurar o texto utilizando as

configurações disponíveis no painel Properties.
O primeiro elemento a ser configurado é o tipo de texto com as seguintes opções:

- Static Text: texto simples que não aceita entrada nem alteração.
- Dynamic Text: texto que podemos alterar por meio de ActionScript.
- Input Text: caixa de entrada de texto.
No painel Properties temos opções que podemos estar configurando

para nosso texto.
38
Quando criamos um texto, podemos utilizar diferentes métodos para renderizá-lo,

escolhendo na opção Character em Anti-alias:
- Use device fonts: faz com o que o filme procure no computador do usuário a fonte
que escolhemos na área Font (não incorpora a fonte no filme), deixando o filme com
um tamanho menor.
- Bitmap Text (No Anti-Alias): remove a opção de suavização de serrilhado, acentuando
o serrilhado da fonte. Não recomendada para textos com fontes pequenas.
- Anti-Alias for Animation: boa opção para textos envolvidos em animação, melhora
a animação e suaviza o desenho.
- Anti-Alias for Readability: deixa mais fácil a leitura dos textos, principalmente os
que utilizam fontes menores.
- Custom Anti-Alias: nesta opção podemos personalizar a suavização de serrilhado.
Quando escrevemos um texto no Flash é exibido um identificador no canto do campo de
texto para identificar o tipo de campo de texto:
Para texto horizontal estático que estende, um identificador redondo é
exibido no canto superior direito do campo de texto.
Para texto horizontal estático com largura fixa, um identificador
quadrado é exibido no canto superior direito do campo de texto.
Para aumentar a caixa de texto, seleione-a e clique e arraste nas

suas extremidades
Transição entre Textos

Podemos usar a animação Shape para fazer a transição entre textos.
Para termos uma animação Shape, precisamos ter uma forma desenhada na tela ou um
texto (tipo static) que não seja editável.
1- Crie um novo documento.
2- Escreva: “Adobe Flash” com a opção de texto estático.
3- Selecione o texto e utilize a opção: Modify > Break Apart
39
Esta opção separa o texto, deixando cada letra independente, porém ainda editável.
4- Selecione todas as letras e aplique novamente o comando:
Modify > Break Apart, que agora sim vai convertê-las em
formas (shapes).
5- Insira um quadro vazio (Blank Keyframe) no quadro 30 e digite o texto: “Nova
versão”.
6- Repita os mesmos procedimentos adotados no primeiro texto.
7- Selecione qualquer quadro entre o primeiro e o penúltimo e aplique uma animação
Shape.
Pronto, é só testar o resultado. Se achar necessário pode utilizar as Shape Hints.
Importando Mídias
Apesar de o Flash possuir suas próprias ferramentas para desenho, em alguns casos
queremos importar nossa arte vetorial, feita em outro software, e manipular a mesma
dentro do Flash.
Também, podemos importar arquivos bitmaps para ilustrar nosso projeto e ainda obter
efeitos bastante interessantes dentro do programa.
1- Abra o arquivo index.fla na pasta da lição.
2- Clique no menu: File > Import > Import to Stage e selecione a logo_alfa_sports.png
que esta na pasta imagens.
3- Posicione a imagem no layout do

nosso Hotsite, deixando-a em uma
camada separada.
Nossa imagem já esta na Biblioteca.

3- Para melhorar a qualidade de nossa imagem, selecione-a na Biblioteca e clique no
botão Properties na parte inferior deste painel.
40
4- Na janela Bitmap Properties marque a opção

Allow smoothing e escola Lossless na opção
Compression.
- Photo (JPEG): se possuirmos uma imagem com grande quantidade de cores e

tonalidades, devemos usar esta opção.
- Lossless (PNG/GIF): se não quisermos que algumas informações de cor e tonalidade
sejam descartadas da imagem, devemos usar esta opção. Ideal para imagens que não
possuem uma quantidade de cores muito grande.
Com estas alterações a qualidade de nosso arquivo já esta melhor.
O Flash pode importar imagens estáticas em diversos formatos, mas geralmente é usado
o formato nativo do Photoshop, o PSD, para importar imagens estáticas do Photoshop
para o Flash.
Ao importar um arquivo PSD, o Flash é capaz de preservar muitos dos atributos
aplicados no Photoshop, fornecendo opções para manter a fidelidade visual da imagem
e para modificá-la.
►► O Flash funciona internamente com as cores dos espaços de cores RGB ou HSB
(matiz, saturação e brilho). Embora o Flash possa converter imagens CMYK para RGB,
é aconselhável criar arte-final no Photoshop em RGB.
O Flash não pode importar Objetos Smart do Photoshop como objetos editáveis. Para
preservar os atributos visuais dos Objetos Smart, eles são rasterizados e importados para
o Flash como bitmaps.
5- Selecione o arquivo tenis.psd que esta na pasta imagens.
Laboratório: Break Apart em Bitmap

Quando aplicado o comando Break Apart em uma imagem ela é convertida em um
elemento vetorial comum, que poder receber cor e outros atributos.
1- Crie um novo arquivo.
2- Clique no menu: File > Import > Import to Library e selecione as imagens: paisagem.
jpg e paisagem1.jpg que estão na pasta imagens na pasta da lição.
3- Arraste a imagem paisagem.jpg para o palco do Flash.
41
4- Sem estar com a imagem selecionada, clique no botão Edit ao lado da opção Size no
painel Properties e marque a opção: Contents.
5- Com a imagem selecionada escolha: Modify > Break Apart (CTRL + B)
6- Clique no frame 40 e selecione a opção: Insert Keyframe (F6)
7- Retorne ao frame 1, selecione a ferramenta Subselection Tool (seta branca) e clique
nas extremidades da imagem.
Veja que nossa imagem pode ser editada como se fosse uma forma Shape.
8- Clique na extremidade superior esquerda da imagem e arraste-a próxima ao canto
inferior direito.
9- Agora aplique uma animação Shape e veja o resultado.
42
• Usando Máscaras
• Efeitos de Preenchimento
• Máscara Arrástavel
• Máscara com Gradiente
• Criando Animações com Filtros
• Laboratório: Textos como Máscaras
• Laboratório: Movimento com Máscaras
Usando Máscaras
Uma técnica bastante usada em animação utiliza máscaras para obter o efeito de mostrar
apenas parte da animação.
Quando trabalhamos com máscaras, apenas as áreas que definimos nelas serão mostradas
no resultado final, não sendo visualizadas as outras áreas do elemento mascarado.
1- Crie um novo documento e renomeie a layer inicial
para “mascarado”.
2- Digite no palco o texto: Adobe Flash.
3- Clique com o botão direito do mouse no quadro 30 e escolha a opção Insert Frame
(F5), com isso prolongamos a duração do texto na tela por 30 quadros.
4- Crie uma nova layer acima da layer “mascarado” e nomeie como “mascara”.
5- Na layer “mascara” desenhe um círculo que possua
um tamanho um pouco maior que a altura do texto e
torne-o um símbolo gráfico posicionando-o um pouco
à esquerda do texto.
6- Na layer mascara peça um Create Motion Tween.
7- Posicione a cabeça leitora no quadro final da layer mascara e desloque a forma para
o lado direito do texto.
Com isso temos o círculo passando sobre o texto de um lado para outro. Chegou à hora
de dizer para o Flash que somente a área em que o círculo estiver passando deve ser
mostrada na layer “mascarado”.
8- Selecione a layer “mascara” e clique com o botão
direito do mouse sobre ela. Selecione a opção Mask.
Com isso o efeito já esta pronto.
Outra maneira de criar a máscara é clicar com o botão direito do mouse sobre a layer
“mascara” e escolher a opção Properties clicando na opção Mask.
44
Podemos ver que agora os ícones que representam as layers se alteraram, simbolizando
uma máscara, e na layer “mascarado” aparece um símbolo próprio um pouco mais à
direita, mostrando que esta vinculado à máscara.
Para visualizar uma máscara no palco do Flash,
as layers pertencentes a esse efeito estarão
travadas, mas se destravarmos o cadeado,
veremos novamente o círculo e o texto como
estavam antes do efeito.
Efeitos de Preenchimento
Vamos ver um efeito de máscara para preencher um recipiente.
Iremos desenhar uma forma com a ferramenta Pen. Para isso poderemos usar alguns
comandos da opção: Modify > Shape:
Straighten: acentua as retas da forma desenhada
Smooth: acentua as curvas da linha.
Optimize: abre uma janela para otimizar as curvas da linha
Convert Lines to Fills: converte as linhas da forma em preenchimento.
Expand Fill: expande o preenchimento da forma.
Soften Fill Edges: deixa as bordas do preenchimento mais tênues.
Outra opção, também, é a opção de Combine Objects do menu Modify.
1- Desenhe uma forma com a ferramenta Pen, que contenha
preenchimento e contorno, usando estes recursos, se necessário.
2- Depois de pronta a forma, dê um duplo clique na forma para entrar na sua edição.
3- Dê um duplo clique em cima do contorno do objeto para selecioná-lo por completo e
vá até o menu: Edit > Cut.
4- Retorne para a Scene 1, clicando em seu respectivo ícone.
5- Crie uma nova camada e nomeia para “contorno”
45
6- Para nos certificarmos que o preenchimento ocupará nessa camada a mesma posição
que ocupava na camada anterior, escolha a opção: Edit > Paste in Place.
Agora temos o contorno do objeto em uma camada e o preenchimento em outra.
7- Crie uma nova camada renomeando-a para “animacao”.
Organize as camadas como na imagem.
8- Na camada “animacao” desenhe um retângulo e converta-o para um símbolo gráfico,

posicionando-o abaixo da forma.
9- Na layer “animacao” peça um Create Motion Twees e prolongue as outras layers,
também.
10- Posicione a cabeça leitora no quadro final da layer “animacao”,
selecione o símbolo e aumente-o, usando a ferramenta Free Transform
(pressione a tecla ALT e clique na extremidade), até que cubra
completamente o objeto.
11- Clique com o botão direito do mouse sobre a camada

“objeto” e escolha a opção: Mask.
Agora basta testarmos a animaçao.
Máscara Arrástavel
Com apenas dois simples comandos teremos uma máscara arrástavel.
1- Crie um novo documento.
2- Insira no palco do Flash a imagem: imagem.jpg que esta na pasta imagens dentro
da pasta da lição. Transforme a imagem em um símbolo Movie Clip com o nome de
instância de “foto”.
3- Renomeie esta camada para “mascarada”.
4- Em seguida insira uma nova camada renomeando-a para “mascara” e desenhe uma
Elipse.
5- Transforme esta forma em um Movie Clip com o ponto de
registro no meio.
46
6- Dê o nome de instância para este Movie Clip de “bola”.

7- Crie outra camada chamada “acoes” e em seu primeiro frame iremos colocar uma
ação que fará a máscara. Digite:
this.foto.mask = bola;
Com isso já criamos o efeito de máscara.
8- Para fazer o efeito de arrastar a forma (e, portanto a máscara) numa nova linha, ainda,
no painel Actions digite:
this.bola.startDrag (true);
O método startDrag() que faz com que a forma seja
arrástavel.
Teste seu filme e veja o efeito.
Máscara com Gradiente

Veremos um tipo de máscara diferente. Em vez de totalmente sólida e visível, vamos
criar uma mascara que vai ter graduações de visibilidade, que vai de totalmente visível
até, aos poucos, o invisível.
1- Crie um novo documento
2- Importe para palco a imagem: paisagem1.jpg que esta na pasta da lição.
3- Torne a imagem um símbolo do tipo Movie Clip.
4- Prolongue (F5) esta camada até o frame 40.
5- Com a imagem selecionada, ajuste seu nome de instância para “imagem”.
Para que o efeito funcione corretamente deveremos marcar no painel Properties a opção:
Cache as bitmap.
6- No painel Properties na opção Display marque a opção Cache as bitmap.
Essa opção evita que o Flash tenha que redesenhar vetores complexos a toda a
movimentação. Ele armazena como bitmap o elemento, melhorando significativamente
a performance, pois poderá ser redesenhado mais rapidamente.
7- Crie outra camada e renomei-a como “mascara”. Nesta nova camada desenhe um
círculo.
47
8- Com a forma selecionada abra o painel Color (Window > Color).

9- Na área Type escola o preenchimento radial
e ajuste esse gradiente para que ele contenha
três quadrados com a mesma cor (tanto faz a
cor escolhida): um no início, um no meio e um
no final.
10- Ajuste a última cor do gradiente (lado direito) para Alpha 0.

Com isso a forma será formada por um gradiente que se inicia na cor sólida, e em seu
final será transparente.
11- Converta esta forma em um Movie Clip e dê o nome de instância para ela de “bola”.
12- Crie um Motion Tween para a layer que esta a bola e aumenta a mesma no quadro
final.
13- Crie outra layer chamada “acoes”e em seu primeiro frame coloque a ação que fará
a máscara:
this.imagem.mask = bola;
Teste o arquivo. Veremos que a máscara estará funcionando, entretanto estará totalmente
sólida, sem o efeito de gradiente que criamos.
14- Para que este efeito funcione marque no Painel Properties na

opção Display o item Cache as Bitmap.
É só testar.
48
Criando Animações com Filtros

Os filtros (efeitos gráficos) do Flash permitem adicionar efeitos visuais interessantes
ao texto, aos botões e clipes de filme. Um recurso exclusivo do Flash é que podemos
animar os filtros aplicados usando interpolações de movimento.
2- Importe para o palco o arquivo xicara.png que esta na pasta imagens.
3- Transforme esta imagem em um símbolo Movie Clip.
4- Crie uma interpolação de movimento marcanco a opçao Create Motion Tween.
5- Deixe a cabeça leitora no primeiro quadro da camada e selecione o símbolo no palco.
5- No painel Properties na opção Filters, clique no botão Add filter na parte inferior e
escolha o Filtro Blur.
6- Clique para desfocar a imagem.
- Blur X e Blur Y: refere-se a um embaçamento aplicado no eixo X e Y da sombra.

Quanto menor o valor mais sólida a sombra, quanto maior o valor mais “esfumaçada”.
- Quality: definimos a qualidade do efeito entre os valores: baixa (Low), média
(Medium) e alta (High).
7- Posicione a cabeça leitora no quadro final da layer e ajuste o filtro Blur para 0.
8- Teste a animação.
Existem outros filtros que podem ser aplicados a textos, também.
49
Laboratório: Textos como Máscaras

- Crie um novo arquivo.
- Escreva um texto no palco no Flash.
- Crie um nova camada e renomei-a para “texto mask”.
- Crie outra camada e nomei-a para “animacao”.
- Desenhe uma forma retangular na camada “animacao” e transforme-a em um símbolo
gráfico.
- Peça uma interpolação de movimento na camada “animacao”.
- Faça a forma passar sobre o texto entre seus quadros inicial e final.
- Duplique o texto para a camada “texto mask”.
- Peça a propriedade “mask” para a camada “texto mask”.
Ao final nossas camadas estarão distribuídas como na
imagem.
- Teste a animação e veja o efeito.
Laboratório: Movimento com Máscaras

- Crie um novo arquivo.
- Desenhe duas formas separadas no palco como shapes.
- Importe para o palco umas das imagens que esta na pasta imagens.
- Transforme esta imagem em um símbolo movie clip.
- Peça uma interpolação de movimento na camada.
- No quadro final faça a imagem se movimentar sobre as formas criadas, fazendo-a
passar entre as formas.
- Estenda a camada que contém as formas, também.
- Posicione a camada que contém as formas acima da camada que esta animada.
- Peça a propiedade “mask” para a camada das formas.
- Teste a animação e veja o efeito.
50
• Cinemática Inversa (IK)

• Adicionando Bones a Símbolos
• Adicionar Bones a Shapes
• Convertendo a Armadura em um Símbolo
• Padrões com a Ferramenta Spray Brush
• Desenhando com a Deco Tool
Cinemática Inversa (IK)

Cinemática inversa (IK) é um método de animação de um objeto ou de um conjunto de
objetos em relação uns aos outros, usando uma estrutura articulada de bones. Os bones
permitem que ocorrências de símbolo e objetos Shape se movam de forma complexa e
natural com o mínimo de esforço de desenvolvimento.
Por exemplo, a cinemática inversa permite criar animação de personagens, como braços,
pernas e expressões faciais com muito mais facilidade.
Uma cadeia de bones é chamada de armadura. Os bones em uma armadura estão
conectados uns aos outros em uma hierarquia pai-filho. A armadura pode ser linear ou
ramificada. As ramificações de uma armadura originadas no mesmo bone são chamadas
de irmãos. O ponto em que um bone se conecta a outro é chamado de junção.
Adicionando Bones a Símbolos

Podemos adicionar bones IK às ocorrências de clipe de filme, gráfico e botão. Para
usarmos texto, primeiro convertamos o mesmo em símbolo.
►► Também é possível separar o texto (Modify > Break) em formas distintas e usar
bones com as formas individuais.
1- Crie um boneco usando formas geométricas ou desenhando com

uma das ferramentas.
2- Transforme cada parte do boneco em um símbolo Movie Clip.
3- No painel Ferramentas, selecione a ferramenta Bone.
4- Com a ferramenta Bone, clique no movie clip que deve ser a raiz ou
a parte superior da armadura. Em seguida arraste-a para uma ocorrência
de símbolo separada para vinculá-la à ocorrência de raiz.
52
Enquanto arrastamos, um bone é exibido. Quando liberamos o mouse, um bone sólido

é exibido entre as duas ocorrências de símbolo. Cada bone tem uma parte superior, uma
extremidade arredondada e uma parte inferior, a extremidade da ponta.
5- Para adicionar outro bone, arraste da parte inferior do primeiro bone

para a próxima ocorrência de símbolo que desejar adicionar à armadura.
Para selecionar um bone individual, clique no bone com a ferramenta
Selection.
As propriedades do bone são exibidas no painel Properties
Conforme adicionamos bones aos símbolos, o Flash move cada

símbolo para uma nova camada na Linha do tempo. A nova camada é
chamada de Armature.
Por padrão, os pontos de controle de uma forma estão conectados ao bone mais próximo
deles.
Quando selecionamso um bones com a
ferramenta Selection, no painel Properties
podemos definir a rotação deste bone.
6- Clique nos bones do boneco e faça alguns movimentos.

7 Com a ferramenta Selection, selecione um quadro em uma camada de pose contendo
uma armadura. O Inspetor de propriedades exibe as propriedades da armadura.
8- No painel porperties, selecione Runtime, no menu Type.
9- Teste a animação e pressione o cursor do mouse em cima do boneco.
Somente armaduras com uma única pose podem ser controladas com o ActionScript.
53
Armaduras com mais de uma pose só podem ser controladas na Linha do tempo.
Estes movimentos do boneco, agora com a opção Runtime, podem

ser controlados por ActionScript.
A ferramenta Bind permite editar as conexões entre bones individuais e os pontos de

controle da forma. Isso permite controlar a maneira como o traçado é distorcido durante
o movimento de cada bone, a fim de obter resultados mais satisfatórios.
Podemos ligar vários pontos de controle a um bone e vário bones a um ponto de controle.
Clicar em um ponto de controle ou bone com a ferramenta Bind exibe as conexões entre
os bones e os pontos de controle.
Adicionar Bones a Shapes

Uma segunda maneira de usar armaduras IK é com os objetos Shape. Com formas,
podemos adicionar vários bones ao interior de uma única forma. O que é diferente dos
símbolos, onde cada um só pode ter um bone.
Podemos adicionar bones a uma única forma ou a um grupo de formas. Nos dois casos,
todas as formas devem ser selecionadas antes de adicionar o primeiro bone.
1- Crie uma forma Shape no palco. Podemos usar a
ferramenta Brush.
2- Selecione a ferramenta Bone.

3- Com a ferramenta Bone, clique dentro da forma e
arraste para outro local dentro da forma.
4- Para adicionar outro bone, arraste da parte inferior

do primeiro bone para outro local dentro da forma.
Ao final nossa forma estara semelhante a imagem.
54
As armaduras IK localizam-se nas camadas de pose na Linha do tempo. Para animar

armaduras na Linha do tempo, insira poses clicando com o botão direito do mouse no
quadro em uma camada de pose e selecionando Insert pose.
5- Na camada Armature clique com o botão direito do
mouse no quadro 30 e escolha Insert Pose.
6- Nesta pose use a ferramenta Selection para alterar
a configuração da armadura.
O Flash interpola automaticamente as posições dos bones nos quadros entre poses.
7- Movimente os outros Bones com a Selection e vá acrescentando Poses na linha de
Tempo.
8- Teste a animação e veja como esta ficando.
Se desejar alterar o comprimento da animação na Linha do tempo, arraste o último
quadro da camada de pose para a direita ou esquerda e adicione ou remova quadros. O
Flash reposiciona os quadros de pose em proporção à alteração de duração da camada e
interpola novamente entre os quadros.
Convertendo a Armadura em um Símbolo

Para aplicarmos efeitos interpolados a outras propriedades de objeto IK além de posição
do bone, o objeto deve ser delimitado em um clipe de filme ou símbolo gráfico.
9- Selecione a armadura IK e todos os objetos a ela associados.
10- Converta-a em um Movie Clip.
►► O Flash cria um símbolo com sua própria Linha do tempo contendo a camada
Armature.
11- Crie uma interpolção de movimento

da Linha de Tempo.
12- Agora adicione efeitos de interpolação
de movimento à nova ocorrência de
símbolo no Palco.
55
Podemos aninhar símbolos contendo armaduras IK dentro de tantas camadas quantas

forem necessárias de outros símbolos aninhados para criar o efeito desejado.
Padrões com a Ferramenta Spray Brush

A ferramenta Spray Brush age como um borrifador de partículas, permitindo que
“pincelemos” um padrão de formas no Palco de uma única vez. Por padrão, o Pincel de
borrifar emite uma borrifada de partículas de pontos, usando a cor de preenchimento
selecionada no momento. No entanto, podemos usar o Pincel de borrifar para aplicar
clipe de filme ou símbolo gráfico como um padrão.
1- Crie um Movie Clipe através do menu Insert > New Symbol.
2- Desenhe uma estrela e crie uma interpolação de movimento para a mesma, de forma
que ela “pisque”.
3- Retorne a Scene 1
4- Selecione a ferramenta Spray Brush.
5- No Inspetor de propriedades da ferramenta clique em Edit da opção Symbol para
selecionar um símbolo personalizado na Biblioteca. Selecione a estrela.
6- Marque as opções do painel Properties semelhante a imagem.
►► Podemos usar qualquer clipe de filme ou símbolo gráfico na Biblioteca como uma
“partícula”. Essas partículas baseadas em símbolos oferecem um grande controle
criativo sobre a arte criada no Flash.
7- Clique ou arraste no Palco onde deseja que o padrão seja exibido.
56
Desenhando com a Deco Tool

As ferramentas de Desenho decorativo permitem que transformemos as formas gráficas
em padrões geométricos complexos. As ferramentas de Desenho decorativo usam
cálculos algorítmicos conhecidos como modelagem procedural. Esses cálculos são
aplicados a um clipe de filme ou símbolo gráfico que está na biblioteca.
O efeito Vine Fill permite que preenchamos o Palco, um símbolo ou uma região fechada
com um padrão de videira. Podemos substituir a sua própria arte pelas folhas e flores,
selecionando símbolos da biblioteca. O padrão resultante fica contido em um clipe de
filme que contém os símbolos que formam o padrão.
1- Crie arquivo novo
2- Selecione a ferramenta Deco.
3- No painel Properties deixe marcado como na imagem.
4- Clique no palco com a ferramenta Deco.

Branch angle: especifica o ângulo do padrão de ramificação.

Patern scale: o dimensionamento de um objeto o reduz ou o amplia horizontalmente
(ao longo do eixo x) e verticalmente (ao longo do eixo y).
Segment Lenght: especifica a extensão dos segmentos entre os nós da folha e da flor.
Animate Pattern: especifica que cada iteração do efeito seja desenhada em um novo
quadro na linha de tempo. Esta opção cria uma seqüência animada quadro a quadro do
padrão de flor conforme ele é desenhado.
57
Frame Step: especifica a quantidade de quadros a serem interpolados por segundo do

efeito que está sendo desenhado.
58
• O Símbolo Botão
• Animando os Botões
• Personalizando o Cursor
O Símbolo Botão
Criar filmes interativos no Flash é sinônimo de muito mais possibilidades de configuração
de controles e realização de tarefas de navegação com um visual diferenciado e melhor
performance.
Iremos ver como transformar e configurar um objeto simples em um elemento de
navegação.
Para criarmos um botão, devemos proceder como se fôssemos criar um símbolo
qualquer.
2- Escreva os itens “Produto” , “Dúvidas” e “Compre

Já” na parte superior do layout e em uma camada
separada.
3- Use o painel Align, se necessário para alinhar e
distribuir os textos de forma uniforme.
4- Selecione a palavra “Produto” e converta-o em um

símbolo (F8) só que agora será do tipo Button, com o nome
de produtoBtn.
5- Vamos clicar duas vezes em cima do símbolo botão (produtosBtn) para entrar em seu
modo de edição.
Observe que sua Timeline é um pouco diferente das que vimos
anteriormente, pois possui quatro estágios: UP, Over, Down,
Hit.
- UP: corresponde ao botão em seu estado normal, sem a proximidade do mouse;
- Over: estágio em que o usuário passa o ponteiro do mouse sobre o botão;
- Down: instante em que o usuário está clicando no botão;
60
- Hit: é a área clicável do botão, que não é visualizada pelo usuário.

6- Vamos editar o botão. Insira um quadro (F6) em cada um dos estágios.
7- No estágio Over e no Down deixe o texto em tom de Laranja.
8- No estado Hit desenha um forma que cubra todo o texto do botão.
9- Repita estes procedimentos para os outros botões: Dúvidas e Compre Já.
10- Ao final, salve seu arquivo.
Animando os Botões
Um botão que se movimenta quando um usuário o pressiona ou simplesmente passa
o ponteiro do mouse sobre ele gera um efeito bastante agradável para o filme. Umas
das maneiras de criarmos um botão animado é colocar em um de seus estágios uma
animação.
Como já vimos o símbolo Movie Clip atende a este requisito, uma vez que sua Timeline
é totalmente independente.
1- Retorne ao arquivo index.fla e selecione o botão “Produtos”.
2- Clique duas vezes em cima do símbolo para entrarmos em sua edição.
3- Crie uma nova camada dentro deste símbolo.
4- No estágio Over desenhe um retangulo em cima da palavra e transforme-o em um
símbolo Movie Clip.
Agora estamos no Movie Clip dentro do símbolo “produtoBtn”.
5- Peça um Create Motion Tween e no último quadro aumente-o até cobrir a palavra.
6- Crie um efeito de Alpha, também para o símbolo no seu quadro final
7- Crie uma nova camada e insira um quadro-chave em seu último quadro colocando
a action:
stop();
Isso fará que a animação pare quando chegar ao final.
61
Repare que quando entramos no estágio Over, é iniciada a animação do Movie Clip.
8- Repita estes procedimentos para os outros botões.
9- Teste seu filme.
10- Instancie todos os botões para produtos, duvidas e compre, respectivamente.
Personalizando o Cursor
É possível personalizar o cursor do mouse do filme para utilizá-lo em animações e
apresentações. Na realidade, não é o cursor que vamos modificar, mas faremos um
Movie Clip seguir o mouse e esconderemos o cursor para passar a ilusão de que o Movie
Clip de Filme é o indicador do mouse.
2- Desenhe uma estrela e converta-a em um Movie Clip, deixando seu ponto de registro
no centro.
3- Dê a esse Movie Clip o nome de instância de “cursor_mc”.
4- Renomeie esta camada para “mouse”.
5- Insira uma nova camada com o nome de “acoes”
6- Na camada “acoes” selecione o primeiro quadro e abra o painel Actions (F9).
Vamos inicialmente determinar que o Movie Clip será arrastado.
7- Digite:
cursor_mc.startDrag(true);
Aqui determinamos que a instância chamada “cursor_mc” será arrastada (starDrag())
pelo ponto de registro (pelo parâmetro true).
62
Até aqui esta tudo OK, entretanto ainda aparece o cursor normal do sistema operacional.
Vamos escondê-lo com o método hide( ) da classe Mouse.
8- Numa nova linha digite:
Mouse.hide();
Teste o filme e veja a ilusão de que o cursor é o Movie Clip que criamos.
63
Anotações:
64
• Utilizando uma sintaxe de script adequada

• Visão Geral do Painel Action
Embora o ActioScript 3.0 possa parecer intimidador se somos iniciante em scripts, é

possível obter excelentes resultados com alguns scripts muito simples. Como ocorre
com qualquer linguagem, é recomendável parar um pouco para aprender a sua sintaxe
e alguma terminologia básica.
Classe
Uma classe é uma categoria de objetos que compartilha os mesmos métodos e
propriedades, que podem ser alteradas pelo usuário.
Exemplos de classes, por exemplo, cão, gato.
Propriedades
Propriedades são as características de uma classe, que podem ser acessadas até
modificadas via programação.
Por exemplo, se Cachorro for uma classe, suas propriedades incluirão quatro patas, pêlo
e uma cauda.
Exemplos:
meuBotao.label=”texto”;
meuBotao.x=200;
meuBotao.width=150;
meuBotao.visible=false;
Métodos
Um método consiste na função que um elemento desempenha.
Por exemplo, dois métodos associados com a classe MovieClip são:
stop();
gotoAndPlay();
66
Parâmetros
Parâmetros fornecem detalhes específicos e são valores entre parênteses ( ) em uma
linha de código.
Por exemplo, no código:
gotoAndPlay (3);
O parâmetro instrui o script a ir para o frame 3.
Função
Uma função é um grupo de instruções que pode ser referenciado pelo nome. Utilizando
uma função, é possível executar o mesmo conjunto de instruções sem digitá-las
repetidamente no mesmo script.
Exemplo:
function alerta():void {
}
Variáveis
Variáveis funcionam como uma espécie de container que armazena informações, seja
um texto, um número, etc.
Exemplo:
var nome:String=”Flash”
Temos uma variável sendo declarada (ação var) cujo nome é “nome” que receberá (=)
como valor o texto “Flash”.
Utilizando uma Sintaxe de Script Adequada

• O ponto-e-vírgula no final da linha instrui o ActionScript de que ele alcançou o final
dessa linha de código e que deve seguir para a próxima linha no código;
• Cada parêntese de abertura deve ter um parêntese de fechamento correspondente, o
mesmo vale para colchetes e chaves;
• O operador de ponto (.) fornece uma maneira de acessar as propriedades e os métodos
de um objeto;
67
• Sempre que estivermos inserindo um nome de um arquivo, use aspas;

• Podemos adicionar comentários que o ActionScript não lerá, assim nos ou outras
pessoas podem se lembrar do que esta sendo feito em diferentes partes do script.
// comentário de uma linha
/*
Comentário de várias linhas
*/
• Para verificar a sintaxe de um script que estamos escrevendo, clique no ícone
AutoFormat (que também formatará o script de acordo com as convenções) ou clique
no ícone Check Syntax. Os erros de sintaxe são listados no painel Compiler Erros.
• O ActionScript é uma linguagem case-sensitive, o que significa que os identificadores
diferem em case (letras maiúsculas de minúsculas). Abaixo, como exemplo duas
variáveis diferentes:
var num1:int;
var Num1:int;
Visão Geral do Painel Action
Para criar scripts incorporados em um

arquivo FLA, informe o ActionScript
diretamente no painel Action. Este
painel consiste em três painéis: a
caixa de ferramentas Ações, que
agrupa elementos do ActionScript
por categoria, o navegador de scripts,
que permite mover rapidamente entre
os scripts em seu documento Flash, e
o painel Script, onde digitamos nosso
código ActionScript.
Para habilitar este painel selecione Window> Action, ou pressione F9.

As barras de ferramentas do painel Ações e da janela Script permitem que acessemos os
recursos de assistência de código que ajudam a simplificar e dinamizar a codificação no
68
ActionScript. As ferramentas são diferentes dependendo se estamos usando o painel

Ações ou a janela Script.
Adicionar novo item ao script: exibe os elementos da linguagem que também
estão na caixa de ferramentas de ações.
Localizar: localiza e substitui texto no script.
Inserir caminho de destino: ajuda na configuração do caminho de destino absoluto
ou relativo para uma ação no script.
Verificar sintaxe: verifica os erros de sintaxe no script atual. Os erros de sintaxe são
listados no painel Saída.
Formato automático: formata seu script para uma sintaxe de codificação apropriada
e uma legibilidade melhorada.
Mostrar referência de código: se estiver desativada a referência de código
automática, use Mostrar referência de código para exibir uma referência de
código para a linha de código em que estiver trabalhando.
Opções de depuração: define e remove pontos de interrupção para que possamos
prosseguir linha por linha em nosso script ao executar uma depuração.
Contrair entre chaves: contrai o código que aparece entre as chaves ou os parênteses
que, atualmente, contêm o ponto de inserção.
Contrair seleção: contrai o bloco de código atualmente selecionado.
Expandir tudo: expande todo o código contraído no script atual.
Aplicar comentário em bloco: adiciona marcadores de comentário no início e no
final do bloco de código selecionado.
Aplicar comentário de linha: adiciona um marcador de comentário de linha única
no ponto de inserção, ou no início de cada linha do código em uma seleção
multilinha.
Remover comentário: remove os marcadores de comentário da linha atual ou de
todas as linhas da seleção atual.
Mostrar/ocultar caixa de ferramentas: exibe ou oculta a caixa de ferramentas de
ações.
Assistência de script: no modo de Assistência de script, somos apresentados a
uma interface de usuário para inserção dos elementos necessários à criação de
scripts.
Ajuda: exibe as informações de referência para o elemento do ActionScript que está
69
selecionado no painel Script. Por exemplo, se clicarmos em um instrução import e, em

seguida, clicar em Ajuda, as informações de referência para import aparecem no painel
Ajuda.
Menu do painel: contém os comandos e as preferências que se aplicam ao painel
Action.
70
• Carregando Arquivos Externos

• Navegação na Timeline
• Usando Label
• Criando Rolagem de Conteúdo
• Os Componentes no Flash
Carregando Arquivos Externos

Nas versões anteriores do Flash quando precisávamos usar uma imagem em nosso
filme, ela deveria ter sido previamente importada para a biblioteca.
Nas novas versões do Flash esse problema foi resolvido. Podemos importar uma imagem
ou um arquivo swf no momento em que necessitamos deles, não sendo necessário
colocá-los na biblioteca.
Isso nós ajuda muito uma vez que as imagens que não forem necessárias à navegação,
por exemplo, escolhida pelo usuário não serão carregadas sem necessidade.
1- Continuaremos no arquivo index.fla
2- Insira uma nova camada e dê o nome de “mcvazio”.
3- Nessa camada desenhe um retângulo no centro da

página de 430px de largura, que será ocupada pelos
conteúdos do hotsite.
4- Selecione esta forma e converta-a em um Movie Clip.

5- Coloque o nome de instância deste Movie Clip de “conteudo”
6- Dê um duplo clique em cima deste Movie Clip para entrar em sua edição e delete o
Shape.
Isso fará com que este Movie Clip fique vazio, servindo somente como “alvo” para
carregar nossos arquivos externos.
7- Retorne para a cena principal
Agora iremos criar nossos arquivos externos do mesmo tamanho (largura e altura) do
Movie Clip vazio.
72
8- Crie um novo documento com a cor cinza de fundo de 430px de largura por 310px de
altura e salve-a como produtos.fla
9- Escreva o texto “PRODUTOS” na parte superior esquerda da tela.
10- Pressione CTRL + Enter para gerarmos o arquivo swf.
11- Repita esses procedimentos para criar os duvidas.fla e compre.fla
12- Crie um arquivo com as mesmas configurações e salve como: home.fla
Agora iremos começar a programar a navegação.
13- Crie uma nova camada e renomeia-a para “acoes” selecione o primeiro frame a
habilite o painel Actions. Digite:
var carregar:Loader=new Loader();
conteudo.addChild(carregar);
Criamos a instância Loader a partir da classe Loader do Action Script 3.0, que é
responsável pelo carregamento de arquivos externos.
14- Após digite:
produtos.addEventListener(MouseEvent.CLICK,botao1);
function botao1(evento:MouseEvent):void {
carregar.load(new URLRequest(“produtos.swf”));
}
Na primeira linha criamos um ouvinte para o botão (devidamente instanciado no palco
do Flash) “produtos” que quando for clicado executa a função “botao1”.
A segunda linha contém a função que executa o que se encontra entre as chaves.
E na terceira linha temos a classe URLRequest, que é responsável por carregar nosso
arquivo externo.
15- Logo após digite:
duvidas.addEventListener(MouseEvent.CLICK,botao2);
carregar.load(new URLRequest(“duvidas.swf”));
}
compre.addEventListener(MouseEvent.CLICK,botao3);
73
carregar.load(new URLRequest(“compre.swf”));
}
home.addEventListener(MouseEvent.CLICK,botao4);
carregar.load(new URLRequest(“home.swf”));
}
16- Crie um botão personalizado para a opçao “Home” e instancie-o para “home”.
O restante da programação segue o mesmo esquema do anterior, só mudando a instância
de cada botão, que ao ser clicado, executará outra função. E na classe URLRequest é
definido outro arquivo para ser carregado externamente.
17- Teste o arquivo e veja que já esta funcionando a navegação pelos seus respectivos
botões.
Só temos que ajustar um pequeno detalhe. A página home.swf tem que ser carregada
juntamente com o arquivo principal, para isso faremos um pequeno ajuste na
programação da nossa navegação.
18- Na terceira linha do painel Action digite:
carregar.load(new URLRequest(“home.swf”));
19- Teste agora e observe que a página home está

sendo carregada juntamente com o arquivo principal.
20- Salve o arquivo.
74
Navegação na Timeline
Nesta lição iremos criar uma navegação que irá para um determinado frame da Timeline
do Flash.
1- Crie um novo arquivo e desenhe dois retângulos: um de cor azul e outro de cor verde:
2- Transforme essas formas em símbolos do tipo Button. Colocando o nome de instância
de: btn1 e btn2, respectivamente.
3- Renomeie esta camada para botões e estenda-a (F5) até o frame 60.
4- Crie uma nova layer renomeando-a para conteúdo.
5- No frame 20 desta layer (conteudo) insira um Keyframe e escreva o texto “Azul”.
6- Insira outro Keyframe no frame 40 e escreva o texto “Verde”. Estenda (F5) este
conteúdo até o frame 60.
7- Crie uma nova camada renomeando-a para “acoes”.
8- Na camada “acoes” insira um Stop no
primeiro e no último frame.
Agora iremos colocar os comandos para os botões.

9- No primeiro frame da camada “acoes” digite:
btn1.addEventListener(MouseEvent.CLICK, botao1);
function botao1(evento:MouseEvent):void{
gotoAndPlay(20);
}
gotoAndPlay(40);
}
Da mesma forma que fizemos anteriormente, criamos um ouvinte para o botão (que está
instanciado no palco do Flash) e que executa a função “botao1”
Na terceira linha colocamos a ação gotoAndPlay (20) e (40) que faz com que o filme
seja avançado até o frame (20 ou 40, no caso do exemplo) e execute a animação.
75
Poderíamos ter usado o gotoAndStop, que faria com que o filme fosse avançado até o
frame definido e parasse.
9- Teste seu filme.
A navegação dos botões esta funcionando perfeitamente, só que temos que observar um
pequeno detalhe. Quando clicamos no botão Azul ele vai até o frame 20 e continua a
animação até o frame 60 que é quando temos um comando de Stop (parar).
Isso acontece porque colocamos a ação gotoAndPlay para o botão, podemos resolver
esse problema de duas formas:
- Mudando a ação do btn1 para gotoAndStop e nossa programação ficaria assim:
gotoAndStop(20);
}
gotoAndPlay(40);
}
- Ou, ainda, colocando um Stop no frame 39 (antes de começar o texto Verde):
stop ();
Agora teste o filme e veja que esta funcionando corretamente.
10- Salve seu arquivo na pasta da lição, que vamos usar no próximo exercício.
Usando Label
Iremos trabalhar com o mesmo arquivo que usamos no exercício anterior, só que agora
ao invés de colocarmos que a ação gotoAndStop irá para um frame diremos que ela irá
para um Label (rótulos) especificado nos frames.
1- Abra o mesmo arquivo da lição anterior.
2- Na camada “acoes” vá até o frame 20 e insira um quadro em branco (F7).
3- Neste frame (20) escreva o Label para o item Frame de
“azul”.
76
Observe que neste frame (20) o Label fica indicado por uma pequena bandeirinha e com
o respectivo nome que atribuímos.
4- Agora insira um quadro em branco no frame 40 e coloque o nome do Frame de
“verde”.
5- O que teremos que fazer agora é mudar nossa programação, indicando que a ação
gotoAndStop e gotoAndPlay irá para o label. Mude a terceira linha de cada botão como
no exemplo abaixo:
gotoAndStop(“azul”);
gotoAndPlay(“verde”);
Criando Rolagem de Conteúdo

A rolagem de conteúdo é muito utilizada quando temos mais informações que espaço
disponível.
1- Abra o arquivo produtos.fla
2- Crie uma uma layer e desenhe um retângulo com bordas no palco do Flash e renomeie
a layer para “mask”.
3- Dê um duplo clique em cima da borda desta forma e leve-a para uma layer acima, a
qual de o nome de “borda”.
4- Crie uma layer acima de todos e dê o

nome de “botoes”. Nesta layer desenhe
dois triângulos posicionando-os como na
imagem.
5- Clique em cima do triângulo de baixo e transforme esta forma em um símbolo do

tipo Button.
6- Transforme o triângulo de cima em um símbolo do tipo Button, também.
7- Coloque o nome de instância do botão de baixo de “btn_desce” e no botão de cima
de “btn_sobe”.
77
8- Crie uma nova layer e dê o nome a ela de “mc”. Posicione esta layer abaixo de todas
as outras, com exceção da layer “produtos”.
9- Na layer “mc” desenhe vários quadrados um abaixo do outro,

fazendo com que eles fiquem para fora no quadrado desenhado
na tela, juntamento com um texto.
10- Com todos os quadrados e textos selecionados transforme-os em um Movie Clip e

dê o nome de instância para eles de “mc_quadrado”.
11- Dê um duplo clique para entrar na edição deste Movie Clip. Selecione todos os
quadrados e textos e transforme-os em um símbolo do tipo Graphic.
12- No frame 1 da layer crie uma interpolação de movimento.
13- Desloque o símbolo como uma animação.
13- Crie uma nova camada e coloque um comando de Stop no seu primeiro frame.
14- Retorne para a cena principal.
16- Na camada “mask”crie uma máscara.
78
Agora iremos programar nosso filme para que quando passarmos o mouse sobre os
botões role o conteúdo que é o Movie Clip “mc_quadrado” e quando tirarmos o mouse
de cima dos botões o conteúdo pare. Para isso usaremos a ação nextFrame e prevFrame.
15- Crie uma nova camada acima de todas e renomei-a para “acoes”. Abra o painel
Actions e digite:
btn_desce.addEventListener(MouseEvent.ROLL_OVER,desce);
btn_desce.addEventListener(MouseEvent.ROLL_
OUT,desceRemove);
function desce(evento:MouseEvent):void{
mc_quadrado.addEventListener(Event.ENTER_FRAME,
desceFull);
}
function desceFull(evento:Event):void{
mc_quadrado.nextFrame();
}
function desceRemove(evento:MouseEvent):void{
mc_quadrado.removeEventListener(Event.ENTER_FRAME,
desceFull);
}
Para a instância chamada “mc_quadrado” criamos um ouvinte (addEventListener) do
tipo evento com atualização constante que será executado a quantidade de frames por
segundo do nosso filme, executando uma função chamada “desceFull”.
Essa programação está aos moldes das outras que já fizemos. O que esta aparecendo de
novo é a ação nextFrame que está sendo aplicada no símbolo “mc_quadrado”, fazendo
com que quando passarmos o mouse (MouseEvent.ROLL_OVER) sobre o botão “btn_
desce” executará a função desceFull que tem como parâmetro à ação nextFrame.
16- Repetiremos a mesma programação para o btn_sobe. Na próxima linha digite:
btn_sobe.addEventListener(MouseEvent.ROLL_OVER,sobe);
btn_sobe.addEventListener(MouseEvent.ROLL_OUT,sobeRemove);
function sobe(evento:MouseEvent):void{
mc_quadrado.addEventListener(Event.ENTER_
FRAME, sobeFull);
79
function sobeFull(evento:Event):void{
mc_quadrado.prevFrame();
}
function sobeRemove(evento:MouseEvent):void{
mc_quadrado.removeEventListener(Event.ENTER_FRAME,
sobeFull);
}
17- Teste o filme e veja a animação.
Os Componentes no Flash
Um componente do Flash é um módulo reutilizável em pacotes que agrega uma
característica em particular a um documento do Flash. Os componentes podem incluir
gráficos e códigos, tratando-se de uma funcionalidade préconstruída que podemos
incluir facilmente em seus projetos do Flash.
O componente ScrollPane cria uma área para a qual podemos importar: JPEG, PNG,
GIF, e arquivos Swf.
1- Crie um novo arquivo e salve-o como scroll.fla na pasta da lição.
2- Arraste uma instância do componente ScrollPane para palco

(Window > Components).
80
3- Defina o tamanho componente para 400x400.

4- Selecione o componente na tela e habilite o painel Componentes Inspector, através
do menu Window.
5- Neste painel defina que o arquivio index.swf será carregado por

este componente através da opção Source.
6- Teste o arquivo.
Todo componente no Flash é um símbolo Movie Clip, aonde podemos manipular suas
configurações de cor, borda, etc simplemente entrando em sua edição.
Podemos modificar a aparência do ScrollPane simplesmente dando um duplo clique
nele e editando seu conteúdo.
7- Selecione o componente ScrollPane e dê um duplo clique nele.
8- Selecione a opção ScrollPane Normal Skin e dê um duplo

clique em cima deste Movie Clip.
81
9- Clique no Movie Clip ScrollPane_UpSkin e dê um duplo clique.
10- Dê mais um duplo clique em cima do Movie

Clip panelBackground Base e altere a cor de
preenchimento do Drawing Object para preto.
11- Teste o filme e veja que não temos mais a cor cinza como cor de fundo no componente.
Para alterarmos a cor da barra de rolagem do componente iremos fazer na mesma forma.
12- Retorne até o Movie Clip ScrollPane e dê um duplo clique

em cima do símbolo ScrollBar Skins.
Up: estado atual

Over: quando o mouse passa em cima
Disabled: quando é pressionado o ScrollBar.
Clicando em cada item na opção Up, por exemplo, temos diversos Movie Clips
cada um representando uma parte do ScrollBar.
13- Dê um duplo clique no Movie Clip ScrollThumb upSkin e começe e editá-lo.

Podemos ir editando cada parte do ScrollBar, basta dar um duplo clique em cima do
Movie Clip correspondente a cada parte.
82
• Busca de Variáveis em um Arquivo de Texto

• Texto com Formatação HTML
Busca de Variáveis em um Arquivo de Texto

O Flash permite que tenhamos variáveis em um arquivo de texto externo e carregue-as
no momento que considerarmos viável, facilitando a atualização dos textos utilizados.
1- Vamos abrir o arquivo duvidas.fla (criado anteriormente)
2- Na pasta da lição temos o arquivo texto.txt. Abra-o e na primeira linha deste arquivo
digite:
nome=Alfa Sports
3- Salve o arquivo txt e retorne para o arquivo duvidas.fla
4- Crie uma nova layer e selecione a ferramenta Text Tool com o

texto do tipo Dynamic selecionado, colocando seu nome de instância
de “valor” e com a opção Multiline marcada na opção Character.
5- Renomeie esta layer para “texto”

Ao escolhermos um texto do tipo Dynamic Text, definimos que o texto digitado na área
pode mudar de acordo com a programação que viermos a fazer.
6- Crie uma nova layer com o nome de “acoes” e no seu primeiro frame digite:
var endereco:URLRequest=new URLRequest(“texto.txt”);
var carregar:URLLoader = new URLLoader();
carregar.dataFormat=URLLoaderDataFormat.VARIABLES;
carregar.load(endereco);
Na primeira linha criamos uma instância chamada endereço a partir da classe
URLRequest para armazenar o endereço onde se encontra o arquivo que será carregado.
Na terceira linha definimos para a instância chamada carregar sua propriedade
dataFormat que identifica como serão interpretadas as informações que forem carregadas
através do URLLoader. No exemplo as informações serão interpretadas como variáveis
84
(VARIABLES), ou seja, respeitarão a forma que criamos no txt.

7- Agora em uma nova linha digite:
carregar.addEventListener(Event.COMPLETE,carregou);
function carregou(evento:Event):void{
valor.text=carregar.data.nome;
}
Criamos um ouvinte para a instância carregar que vai observar quando o arquivo estiver
carregado (Event.COMPLETE) e depois executa a função “carregou”.
Em seguida criamos a função que será executada quando o arquivo estiver carregado.
Na próxima linha definimos que a caixa de texto chamada valor terá o conteúdo de seu
texto (valor.text) recebendo (=) a variável nome (que esta no arquivo txt) entre os dados
da instância carregar.
8- Teste o filme e veja que já estamos carregando o texto.
Para colocarmos um scroll para o texto iremos usar um componente chamado

UIScrollBar, que criará uma barra de rolagem no texto.
9- Selecione o menu: Window > Components e na opção: User Interface escolha o
componente: UIScrollBar.
10- Arraste para o palco uma instância deste componente

encaixando ao lado da caixa de Texto.
Teste seu filme e veja que já esta com Scroll.
85
Texto com Formatação HTML

HTML é uma linguagem de marcação de textos que, ao ser interpretada num navegador,
transforma o texto em elementos visuais que são as páginas que visitamos.
O HTML é formado por um sistema de marcações (tags) que circunda determinado
elemento.
Por exemplo:
Flash
No Flash podemos usar as tags do HTML em sua versão 1.0 para as caixas de texto. As
tags aceitas são:
<a> utilizada para criação de links;
 para deixar o texto em negrito;
 para a cor do texto;
 para tipo de fonte;
 para o tamanho da fonte;
 para itálico;
 para parágrafo e alinhamento;
 para sublinhado.
►► Nem todas as tags do HTML precisão ter a marcação de fechamento (</>), mas as
utilizadas pelo HTML e aproveitadas do Flash terão.
11- Abra o arquivo texto.txt na pasta da lição.
12- Coloque entre o texto “Alfa Sports” as tag .
Entretanto, ao testarmos veremos que a marcação não está funcionando. Para que o
Flash aceite a formatação de HTML teremos que fazer alguns ajustes.
13- É necessário fazer uma alteração na programação na última linha, alterando-a para:
valor.htmlText=carregar.data.nome;
Ao trocarmos a propriedade de text para hmltText, estamos dizendo que o valor inserido
deve seguir a formatação de HTML.
Teste o filme e veja que o trecho do texto que esta entre a tag esta com a formatação
86
de negrito e o resto não.
87
Anotações:
88
• Importando Áudio para o Flash

• Configurações do Som no Flash
• Carregando Áudio Externo
• Inserindo Áudio em Botões
• Usando Transições com Action Script
Importando Áudio para o Flash

Um dos grandes diferenciais do Flash com relação a outros tipos de animação é a
possibilidade de ter som.
2- Selecione o menu: File > Import > Import to Library e escolha: sons_site > natureza.
mp3
No caso de importação de áudio não tem importância à opção escolhida. Isso ocorre
porque ao importamos um arquivo de áudio, ele vai direto para a Library.
3- Observe que o arquivo de som já esta na Library.
Apesar de estar na Library, o arquivo de áudio não é um símbolo e sim um pseudo-

símbolo, assim como o vídeo, por exemplo, uma vez que só temos três tipos de símbolos
por padrão no Flash (Gráfico, Botão e Movie Clip).
4- Para reproduzirmos o som basta clicarmos no botão Play, localizado na área superior
direita da Library.
Configurações do Som no Flash
5- Clique duas vezes em cima do ícone do som na Library.

A janela Sound Properties se irá abrir.
Clicando no botão Test podemos testar as configurações do som, para parar é só clicar
90
no botão Stop.
Para atualizar o som após alterações feitas externamente ao Flash é só clicar no botão
Update. Para importar um novo som usamos o botão Import.
Nossas configurações ocorrem através do item Compression. Quando estivermos
usando um arquivo MP3 e estiver marcada a opção Use Imported MP3 quality, o som
utilizará a configuração original do MP3:
6- Desmarque a opção Use imported MP3 quality. Agora aparecem novos campos para
configurarmos.
No item Compression escolhemos a compressão desejada
para o som:
- ADPCM: ideal para sons curtos;
- MP3: mais utilizada para trilhas;
- RAW: geralmente sem compressão;
- Speech: compressão utilizada especialmente para fala.
7- Marque a opção MP3 no campo Compression.
É preciso definir a taxa de amostragem utilizada (Bit rate). Um valor acima de 16kbps
produz resultados melhores. No campo quality definimos a qualidade desejada. O valor
Fast é uma qualidade mais voltada para a web e suas opções resultam em sons com
qualidades melhores.
8- No item Bit rate marque 20 kbps e no campo quality marque a opção Fast.
9- Clique no frame 100 da timeline e insira um Keyframe (F6).
10- Selecione o frame 1 desta layer e no Painel Properties na opção

Sound escolha o áudio.
Repare que riscos aparecem na Timeline representando o som.

Para melhor visualizarmos estes
“riscos” podemos clicar com o
botão direito em cima na layer
correspondente e na opção properties dela escolher 300% para o item Layer height.
11- Vamos começar a configurar o som do filme no painel Properties. Selecione o quadro
91
1 e escolha a opção: Stream no campo Sync.

No campo Sync estão às configurações do comportamento do som.
- Event: ao escolhermos este item (no frame selecionado) uma nova instância do som
será iniciada quando a cabeça leitora passar por esse Keyframe. Nessa opção o som
toca inteiramente de forma semelhante ao Movie Clip, mesmo ocupando um quadro do
filme. Neste item temos que ter cuidado, pois podem ser iniciadas novas instâncias do
som enquanto a primeira ainda está tocando, causando sobreposições de sons;
- Start: funciona da mesma forma que a Event, diferenciando pelo fato de somente
iniciar uma nova instância do som quando a atual já estiver sido finalizada, não
sobrepondo os sons;
- Stop: para a instância que está tocando;
- Stream: seus trechos de som são anexados aos quadros do filme, portando só podemos
ouvir o som quando houver quadros na Timeline. São carregados somente os trechos
de música que aparecem nos quadros. É a melhor opção para um som que desejamos
sincronizado a animação.
12- No campo Effect (campo que controla o efeito de volume do som) escolha a opção:
Fade Out e clique no botão Edit:
- Left Channel: reproduz o som apenas no canal esquerdo (estéreo);
- Right Channel: reproduz o som apenas no canal direito (estéreo);
- Fade Left to Right: desloca o som do canal esquerdo para o direito;
- Fade Right to Left: desloca o som do canal direito para o esquerdo;
- Fade In: aumenta gradualmente a amplitude do som;
- Fade Out: diminui gradualmente a amplitude do som;
No botão Edit sound envelope, temos uma representação gráfica do som em seus dois
canais (esquerda e direita).
Para alterar o volume em algum dos canais, basta
clicarmos na janela correspondente e um quadro
representativo aparece.
Nesta janela quanto mais próximo da parte inferior
de algum canal mais baixo será o som e quanto
mais próximo do topo mais alto o volume será.
92
13- Teste o filme e veja que o filme será reproduzido segundo as configurações e efeitos
que configuramos.
Carregando Áudio Externo

Vimos como utilizar sons para trabalhar no Flash. Nesta lição veremos a possibilidade
do som não precisar ser previamente importado para o filme, mas que isso seja feito
através do ActionScript.
Vamos ver um exemplo que buscará um arquivo de som externo.
2- Crie uma nova layer e renomei-a para “controle de som”.
3- Nessa layer desenhe dois botões: um que

simbolize a Play e o outro o Stop.
4- Selecione o botão correspondente ao stop e transforme-o em um Button e instancie-o

para “parar”.
5- Selecione o botão correspondente ao play e transforme-o em um Button e instancie-o
para “tocar”.
Antes de controlarmos programaramos os botões iremos carregá-lo externamente
através de comandos em ActionScript.
6- Selecione o primeiro quadro da camada “acoes” e digite na primeira linha do painel
Actions (F9):
var audio:Sound = new Sound();
Nesta linha criamos uma instância chamada áudio a partir da classe Sound, responsável
por trabalhar com som no Flash.
7- Após, em uma segunda linha digite:
var endereco:URLRequest=new URLRequest(“sons_site/som_
site.mp3”);
audio.load(endereco);
Na primeira linha criamos uma instância chamada “endereço” a partir da classe
URLRequest que armazena o endereço para o arquivo que iremos carregar.
93
Na segunda linha, para a instância chamada “audio”carregamos o arquivo de som pelo

método load.
O arquivo de som já esta carregado, mas só será executado quando mandarmos ele fazer
isso.
8- Numa outra linha digite:
audio.play();
Agora sim, mandamos à instância chamada “audio” iniciar a reprodução do som pelo
método play( ).
9- Teste o filme e veja que o som será carregado e executado.
10- No painel Actions altere a linha:
audio.play();
Para:
var canal_de_som:SoundChannel=audio.play(0,int.MAX_
VALUE);
Continuamos a mandar que o arquivo seja executado pelo método play que agora
contém uma constante, ou seja, nosso som irá repetir (quando chegar ao final). O
método play foi associado a uma instância que foi criada chamada “canal_de_som”, do
tipo SoundChannel.
11- Para fazermos o som parar digite no painel Action:
parar.addEventListener(MouseEvent.CLICK,paraSom);
function paraSom(evento:MouseEvent):void {
canal_de_som.stop();
}
12- Para fazermos o som tocar novamente digite:
tocar.addEventListener(MouseEvent.CLICK,tocaSom);
function tocaSom(evento:MouseEvent):void {
canal_de_som = audio.play(0,int.MAX_VALUE);
}
12- Teste o arquivo e veja seu funcionamento.

94
Inserindo Áudio em Botões

Podemos associar sons aos diversos estados de um símbolo de botão. Como os sons são
armazenados junto com o símbolo, eles funcionam em todas as ocorrências do símbolo.
2- Arraste uma instância de botão para o palco do Flash através do

menu: Window > Common Libraries > Buttons.
3- Dê um duplo clique em cima do botão para entrar em sua edição.

4- Crie uma nova layer renomeando-a para “som”. Insira um
qaudro em cada estágio do botão.
5- Importe um som para a Library que está na pasta sons_botoes.

6- Selecione o estágio Down na camada som do botão e clique
no item Sound opção Name selecionando o som do botão.
7- Teste o filme e veja que quando o botão é pressionado emite o som.
95
Anotações:
96
• Utilizando Componentes
• Configurando o Envio de Dados
Utilizando Componentes
Os Componentes, como já vimos, são Movie Clips com parâmetros que permitem
modificar sua aparência.
Ao invés de criamos botões, combos e listas, podemos arrastar esses componentes para
o palco do Flash e adicionar funcionalidade a eles, configurando-os a nossa maneira.
1- Abra o arquivo compre.fla
2- Habilite o painel Componentes.
3- Selecione o componente TextInput e arraste-o para o palco do Flash colocando o
nome de instância de “nome”.
4- Aumente o tamanho deste Componente para 300x20.
Quando arrastamos um componente para o palco, automaticamente é criada um símbolo
dele junto a Biblioteca.
5- Selecione o símbolo TextInput da Biblioteca e arraste-o para o palco do Flash,
colocando-o logo abaixo do outro, deixando-o com a mesma largura e altura. Dê o nome
de instância para ele de “email”.
6- Agora, arraste uma instância do componente TextArea

para a palco, colocando abaixo dos outros componentes com
a largura de 300x40. Instancie-o para “mensagem”:
7- Arraste uma instância do componente Button para o palco do Flash, posicionando

abaixo dos outros componentes.
8- No painel Components Inspector mude o item label para “Enviar” e instancie-o para
“btn_enviar”.
9- Arraste outra instância do componente Button para o palco do Flash, colocando-o ao
lado do btn_enviar.
10- Mude a opção label para “Limpar”e instancie- o para “btn_limpar”:
98
11- Precisamos agora de um campo de erro. Selecione a ferramenta Text Tool no formato
Dynamic Text e clique e arraste uma caixa na parte superior dos componentes.
12- Instancie esta caixa de texto para “mensagemErro”.
13- Crie uma nova camada e renomei-a para “acoes”. Habilite o painel Actions e digite
na primeira linha:
btn_enviar.addEventListener(MouseEvent.CLICK, valida);
btn_limpar.addEventListener(MouseEvent.CLICK, limpar);
A função “valida” servirá para verificar se os campos foram digitados, se não retornará
uma mensagem.
A função “limpar” servirá para apagar os campos de texto.
14- Na terceira linha digite:
function valida(evento:MouseEvent):void{
mensagemErro.text = “”;
if (nome.text == “”){
mensagemErro.text = “Favor preencher o campo
nome \n”;
}
if (email.text == “”){
mensagemErro.text = String(mensagemErro.text)
+ “Favor preencher o campo email \n”;
}
if (mensagem.text == “”){
mensagemErro.text = String(mensagemErro.text)
+ “Favor preencher o campo mensagem \n”;
}
}
99
function limpar(evento:MouseEvent):void{
nome.text = “”;
email.text = “”;
mensagem.text = “”;
}
Caso as caixas de texto estejam vazias retornará

uma mensagem no campo de texto instanciado de
“mensagemErro”.
Teste o arquivo e veja que os botões estão funcionando.
Configurando o Envio de Dados

15- Abaixo dos ouvintes dos botões (na terceira linha) digite:
var nomeArquivo:String;
nomeArquivo = “processa.asp”;
O Flash conversa com o ASP e PHP através de envio e recebimento de variáveis,
executando as tarefas.
Neste exercício passaremos os dados para o ASP fazer o envio dos dados por e-mail
16- Abaixo das condicionais (if) acrescente mais uma para a função “enviar”, digitando:
if (mensagemErro.text = = “”){
this.enviar();
}
17- Abaixo iremos digitar a função “enviar”, responsável pelo envio dos nossos dados
do formulário:
function enviar():void {
var req:URLRequest=new URLRequest(nomeArquivo);
req.method=URLRequestMethod.POST;
var vars:URLVariables=new URLVariables;
100
vars.nome=escape(nome.text);
vars.email=escape(email.text);
vars.mensagem=escape(mensagem.text);
req.data=vars;
var loader:URLLoader=new URLLoader();
loader.load(req);
loader.addEventListener(Event.
COMPLETE,onVarsLoaded);
loader.addEventListener(IOErrorEvent.IO_ERROR,
onIOError);
}
function onVarsLoaded(event:Event):void{
var loader:URLLoader = URLLoader(event.target);
mensagemErro.text = “Email enviado com sucesso”;
}
function onIOError(event:IOErrorEvent):void {
mensagemErro.text = “Erro ao enviar o email”;
}
A função enviar pega todos os itens digitados nos campos e envia os dados. São criadas
variáveis para os objetos (nome, email, mensagem) para guardarem o conteúdo dos
dados digitados.
101
Anotações:
102
• Construindo um Preloader
Construindo um Preloader
1- Abra o arquivo index.fla que esta na pasta da lição.
2- Em todas as layers deste filme avance um frame, deixando-as todas iniciando a partir
do frame 2 da Timeline.
3- Crie uma nova layer abaixo da layer “acoes” e renomei-a para “preloader”.
4- Crie um campo de texto dinâmico com o nome de instância de “pct”.
5- Delete o segundo quadro da layer “preloader”, deixando somente o
quadro 1 com o objeto de texto.
6- Selecione o quadro 1 da camada “preloader”e habilite o painel Action digitando:

stop();
this.addEventListener(Event.ENTER_FRAME,loaded);
function loaded(EVENT:Event):void
{
var carregando:Number=int(loaderInfo.bytesLoaded/
loaderInfo.bytesTotal*100)
pct.text=carregando+”%”;
if(carregando==100)
{
removeEventListener(Event.ENTER_FRAME,loaded);
gotoAndPlay(2);
}
}
Criamos uma função “loaded”que executa o carregamento a partir da classe loaderInfo,
responsável pela execução do carregamento, que passa o resultado dos bytes carregados
divididos pelos bites totais e multiplicado por 100.
A instância “pct” é do tipo texto que quando carregada mostra o valor em porcentagem.
104
Se carregado todo o arquivo ele remove a função loaded e vai para o frame 2.
7- Desloque o quadro da ações da camada “acoes” para o segundo e coloque um stop na
primeira linha.
8- Teste seu filme. Para ver o preloader em

funcionamento pressione CTRL + Enter, novamente.
Quando chegar a 100% será carregado nosso filme.

9- Para adicionar uma barra que vai crescendo juntamente com a porcentagem crie um
retângulo de largura de 2 pixels e transforme-a em um símbolo do tipo Movie Clip com
nome de instância de “barra”.
9- Habilite o painel Action e digite na 7 linha:
barra.gotoAndStop(carregando);
10- Teste seu arquivo e veja como ficou.
105
Anotações:
106
• Criando um Banner
• Banner Expansível
• Usando Transições com Action Script
Criando um Banner
2- Clique no menu: File > Import > Import to stage e selecione o arquivo banner.psd que
esta na pasta imagens.
3- Selecione cada layer e marque a opção: Flattened bitmap image, a qual irá ser uma
imagem não editável.
Na layer Shape 1 marque a opção: Editable

paths and layer styles, que fará com que esta
imagem seja editável, deixando, no caso deste
arquivo, a forma separada do preenchimento.
Desmarque a layer background, pois não a
usaremos no arquivo fla.
Deixe marcada a opção Flash Layers.
As duas opções abaixo ficam marcadas:

- Place object at original position: os objetos importados para o Flash ficaram na mesma
posição que se encontravam no Photoshop;
- Set stage size to same size as Photoshop canvas: o placo do Flash será redimensionado
para as mesmas dimensões do Photoshop.
Veja que nossos arquivos estão

nas Layers do Flash exatamente
como estavam no Photoshop e
que na Biblioteca as imagens
encontram-se organizadas em
uma pasta.
108
4- Selecione o Movie Clip, localizado na layer Shape 1 e dê um duplo clique para

entrarmos em sua edição.
5- Exclua a layer 1, que corresponde à cor de

preenchimento do objeto.
6- Importe para a Biblioteca as imagens: flor1.jpg, flor2.jpg e flor3.jpg que esta na pasta
imagens.
7- Renomeia-e a layer 2 para mask.
8- Crie uma nova layer e renomeie-a para “flor1”. Posicione-a abaixo
da layer “mask”.
9- Com a layer “flor1” selecionada arraste a imagem

flor1.jpg para o palco do Flash. Redimensione e
posicione a imagem em cima do objeto.
10- Crie uma interpolação de movimento na layer “flor1” e redimensione os quadros

desta para o quadro 80.
11- Deixe a cabeça leitora posicionada no quadro 1 e diminua o Alpha para 0%.
12- No quadro 10 deixe o Alpha em 100%.
15- Estenda a layer “mask” até o
quadro 80, também.
17- Insira uma layer acima da layer “Flor1” e renomei-a para “Flor2”.
109
18- Posicone a cabeça leitora no quadro 70 e insira um quadro-chave (F6) na layer

“Flor2”.
19- Arraste a imagem flor2.jpg para o palco e diminua a mesma.
20- Crie uma interpolação de movimento nesta layer e arraste-a até o quadro 160.
21- Prolongue a layer “mask”, também.
22- No quadro 70 na layer “Flor2” deixe o Alpha em 0%.
23- No quadro 80 desta layer deixe o Alpha em 100%.
26- Teste a animação e veja as flores passando na máscara.
27- Retorne a Cena principal.

28- Selecione o bitmap correspondente as curvas da
parte de baixo do banner e transforme-a em um símbolo
Movie Clip.
29- Entre na edição deste MC e crie uma nova layer

desenhando um forma ao lado esquerdo da imagem.
30- Crie uma interpolação de movimento e no quadro final da layer aumenta a forma de
maneira que cubra toma a imagem.
31- Peça a propriedade de Mask para esta layer.
32- Coloque um stop no quadro final da animação.
33- Retorne a cena principal.
34- Insira uma nova layer e renomei-a para “btnInvisivel”.
35- Clique no menu: Insert > New Symbol e escolha a opção Button.
36- Insira um Keyframe no estado Hit do botão e desenhe um retângulo, configurando
a posição X e Y para 0.
110
37- Retorne a Cena principal.
38- Com a layer “btnInvisivel”selecionada arraste o

novo botão criado para o palco do Flash, posicionando-o
em cima do banner e redimensionando-o de forma que
ocupe toda a extensão do banner.
39- Instancie este botão para “btn”.
40- Crie uma nova layer e renomei-a para “acoes”. Habilite o painel Action e digite:
btn.addEventListener(MouseEvent.CLICK, banner);
function banner(event:MouseEvent):void {
navigateToURL(new URLRequest(“http://www.adobe.com.
br”), “_blank”);
}
O método navigateToURL é o responsável por abrirmos uma nova página.
41- Teste o filme.
Banner Expansível
2- Desenhe um retângulo no palco do Flash e transforme-o em um símbolo Movie Clip.
Instancie-o para “ativa”. Renomeie esta layer para “banner”.
3- Dê um duplo clique para entrar em sua edição e escreva “Passe o Mouse” como texto
estatico.
5- Retorne para a cena principal.
111
6- Crie um quadrado da mesma largura do retângulo já criado e posicione-o acima do

retângulo (na parte de fora do palco) em uma nova layer chamada “animacao”.
7- Transforme essa forma em um símbolo Movie Clip e instancie-o para “tela”.

8- Entre na edição do Movie Clip “tela” e transforme o Shape em um símbolo Gráfico.
9- Crie uma interpolação de movimento e no quadro final desloque
o objeto para baixo do símbolo.
10- Ainda dentro do Movie Clip “tela”crie uma nova camada e insira
um keyframe no frame 13. Escreva “Adobe Flash”na parte superior
fora do palco.
11- Crie uma interpolação de movimento e no quadro final desta

layer posicione o texto em cima do outro símbolo.
12- Crie uma nova camada e renomei-a para “acoes”. No seu primeiro frame coloque
um comando de Stop:
stop();
13- Retorne a cena principal e crie uma nova camada com o nome de “acoes”.
14- Coloque a ordem das camadas como na imagem.
Esta ordem é importante para o funcionamento correto do banner.

15- Habilite o painel Actions no primeiro frame da layer “acoes” e na primeira linha
digite:
stop();
ativa.addEventListener(MouseEvent.MOUSE_OVER,Exibe);
112
ativa.addEventListener(MouseEvent.MOUSE_OUT,Esconde);
ativa.buttonMode = true;
Quando o mouse passar em cima do Movie Clip “ativa” irá chamará a função “Exibe”;
e quando o mouse sair de cima do Movie Clip ‘ativa”chamará a função “Esconde”.
16- Na quinta linha digite:
function Exibe(evento:MouseEvent):void{
tela.addEventListener(Event.ENTER_FRAME, Abre);
tela.removeEventListener(Event.ENTER_FRAME,Fecha);
}
function Abre(evento:Event):void{
tela.nextFrame();
if (tela.currentFrame == tela.totalFrames) {
tela.removeEventListener(Event.ENTER_FRAME, Abre);
}
}
A função “Exibe” quando executa a função “abre” vai para o próximo frame até chegar
ao final no Movie Clip Tela, onde está nossa animação.
Na condição (if) temos: se o Frame atual for igual ao numero total de frames, remove
a função abrir.
17- Na linha seguinte digite:
function Esconde(evento:MouseEvent):void{
tela.addEventListener(Event.ENTER_FRAME, Fecha);
tela.removeEventListener(Event.ENTER_FRAME,Abre);
}
function Fecha(evento:Event):void{
tela.prevFrame();
if (tela.currentFrame == 1){
tela.removeEventListener(Event.ENTER_FRAME,Fecha);
113
}
}
Para a função “Esconde” temos a mesma lógica, alterando a condição (if) para: se o
frame atual for igual a 1, remove a função fechar da lista.
18- Pronto. Teste seu Movie Clip e veja a funcionalidade do banner.
Usando Transições com Action Script

Vamos ver outros tipos de efeitos possíveis com ActionScript 3.0 que são as transições.
O efeito Blinds mostra ou esconde o Movie Clip que está recebendo a transição aos
poucos através de áreas retangulares que vão aparecendo ou desaparecendo.
2- Importe para o palco do Flash a imagem: transicao.jpg que esta na pasta da lição.
3- Transforme esta imagem em um Movie Clip e coloque o nome de instância da
imagem de “imagem”.
4- Crie uma nova camada e no primeiro quadro desta camada abra o painel Actions e
digite:
import fl.transitions.*;
import fl.transitions.easing.*;
var transicao:TransitionManager=new
TransitionManager(imagem);
Nas duas primeiras linhas importamos as classes que vamos utilizar.
Na terceira linha criamos uma instância chamada “transição” a partir da classe
TransitionManager (classe que está presente somente do Action Script 3.0) que cuida
dos efeitos de transição.
5- Numa nova linha digite:
transicao.startTransition({type:Blinds,
114
direction:Transition.IN,duration:2,easing:Strong.easeOut,
numStrips:10, dimension:1});
O parâmetro numStrips define a quantidade de retângulos e o dimension indica se o
efeito será com retângulos na horizontal (valor 1) ou na vertical (valor 0).
Para a instância chamada “transicao” usamos o método starTransition que dará início
a transição.
Dentro dos parênteses desse método temos (entre as chaves) os parâmetros que vão
orientar a transição, o qual podemos mudar:
direction:Transition.IN que indica que o Movie Clip irá aparecer ou direction:Transition.
OUT que o mostrará se escondendo.
duration:2 é o tempo em segundos que essa transição irá durar até atingir o final.
6- Teste seu arquivo.

Os retângulos aparecem e revelam partes da imagem
até mostrá-la por completo.
Temos, também, o PixelDissolve que faz o Movie Clip aparecer ou desaparecer através
de um efeito em quadrados que vão aos poucos aparecendo ou desaparecendo.
7- Insira um novo quadro-chave na layer que contém a imagem e insira a imagem
transicao.3.jpg que esta na pasta imagens.
8-Transforme esta imagem em um Movie Clip e coloque o nome de instância da imagem
de “imagem1”.
9- Na camada das actions insira um novo quadro e digite:
var transicao1:TransitionManager=new
TransitionManager(imagem1);
10- Na próxima linha digite:
transicao1.startTransition({type:PixelDissolve,
direction:Transition.IN, duration:1, easing:Strong.easeOu
t,xSections:20,ySections:0});
Temos como parâmetros adicionais xSections (quantidade de quadrados no eixo x)
e ySections (quantidade de quadrados no eixo y). A Adobe aconselha valores de no
115
máximo 50 para estes parâmetros.

Iremso colocar uma função para controlar a passagem das imagens com as transições.
11- No primeiro quadro da layer das ações, digite:
stop();
var tempo = 10000;
function vai():void{
if(this.currentFrame != this.totalFrames)
nextFrame();
else
gotoAndStop(1);
}
setInterval(vai, tempo);
12- Teste o arquivo.
116
• Importando Vìdeos
• Usando o Adobe Media Encoder CS4
• Máscaras em Vídeos
• Vídeo em Tela Cheia
Importando Vìdeos
A partir da versão 8 do Flash o codec On2 VP6 compacta de forma muito eficiente os
arquivos de vídeo importados para o programa.
Uma série de formatos pode ser importado para o Flash, como: avi, dv, mpg, mpeg, mov
entre outros.
O formato para qual o Flash converte o vídeo que utiliza é o FLV, que se tornou muito
popular com o sucesso dos sites como You Tube e Google Vídeo.
1- Crie um arquivo novo.
2- Renomei-a para vídeo.
3- Para importar um vídeo, escolha a

opção: File > Import > Import vídeo (na
layer vídeo). Abre-se o painel Import
Vídeo.
4- Iremos escolher a opção On your computer, porque queremos escolher um vídeo

que esta na nossa máquina. E em seguida clicaremos no botão Browse para escolher o
arquivo que esta na pasta: videos > caffe_art.f4v
5- Deixe marcada a opção Load external with playback component. Esta opção
importa o vídeo e cria uma instância do componente FLVPlayback para controlar a
reprodução do vídeo. Quando estiver pronto para publicar o documento Flash como
SWF e enviá-lo para seu servidor da Web, também deve enviar o arquivo de vídeo para
um servidor Web ou para o Flash Media Server, e configurar o componente FLVPlayback
com o local do arquivo de vídeo enviado.
- Embed FLV in SWF and play in timeline incorpora o FLV ou F4V no documento do
118
Flash. Quando o vídeo é importado dessa maneira, ele é colocado na Linha do tempo,
em que é possível visualizar os quadros de vídeo individuais representados nos quadros
da Linha do tempo. Um arquivo de vídeo FLV ou F4V incorporado torna-se parte do
documento do Flash.
- Import as mobile device video bundled in SWF: da mesma forma que a incorporação
de um vídeo em um documento do Flash, compactamos um vídeo em um documento do
Flash Lite para implantação em um dispositivo móvel.
A outra opção: Already deployed to a web server, Flash Vídeo Streaming or Flash
Media Server seria para utilizar um vídeo que já esteja na web, num FVSS ( Flash
Vídeo Streaming Service que é um servidor de vídeos Flash em Streaming) ou ainda
num servidor Flash Media Server (servidor para aplicações relacionadas ao Flash).
5- Com o vídeo selecionado clique no botão next. Somos levados à etapa seguinte.
6- Escolha um tipo de Skin e Clique em

next.
7- Clique em Finish e nosso vídeo já esta no palco do Flash com

uma instância do componente para reproduzi-lo.
8- No painel Component Inspector podemos fazer algumas alterações

na configuração do componente.
119
Usando o Adobe Media Encoder CS4

Adobe Media Encoder é um aplicativo de codificação independente empregado por
programas como Adobe Premiere Pro, Adobe Soundbooth e Flash para impressão de
certos formatos de mídia. Dependendo do programa, o Adobe Media Encoder oferece
uma caixa de diálogo especializada Exportar configurações que acomoda as inúmeras
configurações associadas com certos formatos de exportação, como Adobe Flash Video
e H.264. Para cada formato, a caixa de diálogo Exportar configurações inclui uma série
de predefinições que são personalizadas para uma mídia de entrega em particular.
1- Crie um novo documento no Flash.
2- Abra o Adobe Media Encoder CS4.
3- Clique no botão Add e selecione o

vídeo cafe_art.vwm
4- Nos botão Preset selecione

a opção Edit export settings e
configure o vídeo.
5- Clique em OK
5- Na janela Adobe Media Encoder clique no botão Start Queue.

E o vídeo inicia a exportação para o formato FLV.
120
6- Retorne para o Flash e clique em Import > Import Video e escolha o arquivo cafe_art.
flv
7- Escolha a opção Embed FLV in SWF and play in timeline.
8- No item Symbol Type escolha a opçao Movie Clip.
Em Symbol Type escolhemos que o vídeo se encontrará dentro do filme do Flash como
incorporado: Embed Vídeo; em áudio track escolhemos que o áudio será integrado
com o vídeo: Integrated; marcando a opção: Place instance on stage, estamos dizendo
que queremos que uma instância do arquivo seja colocada no palco; a opção: Expand
timeline if needed marcada indicará que a timeline do filme poderá ser expandida para
acomodar todo o vídeo; marcando o item Embed the entire vídeo, iremos para a etapa
Encoding para editar o vídeo antes de ser incorporado ao filme.
9- Clique no botão next e finish.
O vídeo já esta no palco do Flash.
Máscaras em Vídeos
Da mesma forma que utilizamos máscaras para visualizar elementos por uma área
delimitada, também podemos criar máscaras que nos permitam que apenas áreas
específicas do vídeo sejam visualizadas.
10- Adicione uma nova layer (acima da layer “video”) e renomei-a para “mask”.
11- Desenhe um quadrado com os cantos arredondados sobre a área em que se encontra
o vídeo.
12- Selecione a layer “mask”e clicando nela com o botão direito do mouse, escolha a
121
opção Mask.
Pronto, foi criada uma máscara sobre nosso vídeo
Vídeo em Tela Cheia

Uma novidade incorporada a mais recente versão do player do Flash é a possibilidade
de exibir seu conteúdo em tela cheia.
Podemos criar um vídeo de forma semelhante ao que ocorre no You Tube, por exemplo.
1- Crie um aqruivo novo.
2- No painel Components arraste para o palco uma instância do componente
FLVPlayback.
3- No painel Component Inspector no item source escolha o video cafe_art.flv.
4- No item Skin escolha uma que tenha a opçao FullScreen.
5- Selecione o menu: File > Publish Settings.

6- Na área HTML ajuste o item template para: Flash Only – Allow Full Screen.
7- Clique no botão Publish.
8- Ao testarmos o arquivo html gerado clique no botão dedicado a exibir o filme em tela
cheia, localizado na extremidade inferior direita do skin.
Uma mensagem, que desaparece logo depois, avisa que é possível utilizar a tecla ESC
para sair do modo de tela cheia.
122
Será gerado um arquivo com a extensão .js (JavaScript) que deve ser enviado junto com
os arquivos para o seu website.
123
Anotações:
124
• Configurações de Publicação
• Flash
• HTML
• GIF
• PNG
• FullScreen
Configurações de Publicação
Após criarmos nosso filme é hora de disponibilizá-lo para que os usuários o assistam.
Para isso devemos definir suas configurações de exportação, que são efetuadas no painel
Publish Settings.
2- Selecione o menu: File > Publish Settigns. Nesta janela

escolhemos o formato desejado entre os disponíveis para
exportação.
- Flash (.swf): gera um arquivo swf;

- HTML (.html): gera um arquivo HTML, pronto para ser disponibilizado na Web;
- GIF (.gif): cria uma imagem no formato GIF, que pode ser estática ou animada;
- JPEG (.jpg): cria uma imagem no formato JPG;
- PNG (.png): cria uma imagem no formato PNG;
- Windows Projector (.exe): gera um executável para Window;
- Macintosh Projector: gera uma executável para MAC;
- QuickTime (.mov): cria um filme para QuickTime.
Para exportarmos em algum dos formatos disponíveis , devemos marcar a caixa de
seleção ao lado do formato.
126
Ao fazermos isso, novas abas são adicionadas ao painel Publish Settings para as
configurações do formato.
Os formatos de arquivos executáveis não abrirão abas, pois não terão elementos para
serem configurados.
Observe que ao lado de cada formato existe um campo chamado File, no qual podemos
escolher separadamente o nome e local de cada arquivo que será gerado.
►► Para realmente criarmos os arquivos devemos clicar no botão Publish que efetua a
publicação. O botão OK apenas serve para confirmarmos as configurações.
Flash
As configurações disponíveis para este formato são:
- Player: a versão do player necessário para visualizarmos

o arquivo swf.
- Script: escolhemos a versão do ActionScript que será
utilizada no filme.
HTML
Podemos configurar o arquivo HTML que o Flash vai

gerar. Esse arquivo pode ser colocado no nosso site para
que os usuários visualizam nosso filme. Não esquecendo
de levar o arquivo swf junto.
127
- Template: contém opções de modelos de códigos HTML predefinidos para serem

usados em nossas paginas;
- Detect Flash Version: essa opção faz com que o arquivo HTML possua um código
anexo que verifica a versão do player;
- Dimensions: podemos definir o tamanho que o filme ocupará na página HTML;
- Paused at start: com essa opção selecionada o filme se inicia parado, aguardando que
um comando mande reproduzi-lo;
- Loop: faz com que o filme recomece ao atingir seu ponto final, desde que nenhuma
ação no último frame mande o filme parar;
- Display menu: quando o usuário clica com o botão direito do mouse no filme, um
menu contextual se abre. Caso não deseje exibir o menu completo (alguns itens são
obrigatórios), podemos desmarcar essa opção;
- Device font: essa opção substitui fontes existentes no filme por existentes na máquina
do usuário;
- Quality: define a qualidade do filme;
- Window mode: no Internet Explorer podemos definir o comportamento visual da
área do filme. Temos as opções: Window (modo padrão), Opaque Windowless (evita
que elementos que estejam por trás do filme sejam exibidos através dele) é uma opção
bastante utilizada para evitar que um menu DHTML se sobreponha ao filme e não
funcione corretamente e o Transparent Windowless (torna o fundo do filme transparente).
- HTML alignment: configura o alinhamento que a área do filme ocupará no navegador;
- Scale: configura como o conteúdo do Flash ire se comportar caso tenha sido alterada
alguma das dimensões do filme: Default (Show all) não distorce o filme, No Border
mantém a proporção do filme, cortando-o se ultrapassar a área especificada, Exact Fit
faz com que todo o conteúdo do filme seja compreendido na área especificada para ele,
não se importando com a proporção, podendo acarretar distorção e o No Scale que é
sem escala;
- Flash alignment: configura o alinhamento que o filme terá dentro da área especificada.
- Show warning messages: se marcada, mostra alertas sobre eventuais erros.
Para termos um controle maior do nosso HTML com as Tags DIV recomenda-se que o
HTML do seu Website seja gerado através do Adobe Dreamweaver e inserido o arquivo
swf posteriormente.
128
GIF
- Dimensions: define o tamanho da imagem. Se marcada
a opção Match Movie, teremos as dimensões do filme
do Flash; caso desmarcada, poderemos definir nossas
dimensões;
- Playback: opção para definir se a imagem GIF será
estática (Static) ou animada (Animated);
Quando definida a opção Animated, é necessário escolher se
a imagem estará em um loop infinito (Loop continuously)
ou o número de quantidades de vezes que a image será
reproduzida até parar (Repeat).
- Optimize colors: remove cores não utilizadas na tabela de cores da imagem GIF;
- Interlace: mostra a imagem rapidamente, melhorando sua qualidade aos poucos
enquanto faz o download dela;
- Smooth: suaviza a imagem a ser exportada;
- Dither solids: utiliza pontilhamentos (utilização de duas cores próximas para simular
uma terceira) para simular uma gama maior de cores;
- Remove gradients: converte os gradientes em cor sólida;
- Transparent: configura como será a transparência da imagem: Opaque (sem
transparência), Transparent (faz com que o fundo do filme seja exportado como área
transparente na imagem), Alpha (transparência parcial da imagem).
No campo Threshold definimos um valor de 0 a 255 que corresponderá a um limite para
a transparência.
- Dither: configura o pontilhamento: None (não pontilha e substitui cores não presentes
na tabela de cores da imagem pelas mais próximas), Ordered (pontilhamento com
qualidade razoável sem aumentar muito o tamanho do arquivo), Difusion (melhor
qualidade, entretanto com aumento do arquivo);
- Palete type: tipo de paleta a ser utilizada na imagem: Web 216 (cores seguras da
Web), Adaptive (cria uma tabela com as cores utilizadas no arquivo, alterando algumas
para se manter no limite do formato), Web Snap Adaptive (semelhante à adaptive, só
que converte cores semelhantes em cores da paleta segura da Web), Custom (podemos
buscar uma tabela de cor).
129
PNG
- Dimensions: define o tamanho da imagem. Se marcada
a opção Match Movie, teremos as dimensões do filme
do Flash; caso desmarcada, poderemos definir nossas
dimensões;
- Bit depth: profundidade de cores utilizada na imagem
que será gerada, sendo sua opções: 8 bits (256 cores), 16
bits (milhares de cores), 24 bits com with Alpha (milhares
de cores com transparência);
- Optimize colors: remove cores não utilizadas na tabela de cores da imagem GIF;
- Interlace: mostra a imagem rapidamente, melhorando sua qualidade aos poucos
enquanto faz o download dela;
- Smooth: suaviza a imagem a ser exportada;
- Dither solids: utiliza pontilhamentos (utilização de duas cores próximas para simular
uma terceira) para simular uma gama maior de cores;
- Remove gradients: converte os gradientes em cor sólida;
- Dither: configura o pontilhamento: None (não pontilha e substitui cores não presentes
na tabela de cores da imagem pelas mais próximas), Ordered (pontilhamento com
qualidade razoável sem aumentar muito o tamanho do arquivo), Difusion (melhor
qualidade, entretanto com aumento do arquivo);
- Palete type: tipo de paleta a ser utilizada na imagem: Web 216 (cores seguras da
Web), Adaptive (cria uma tabela com as cores utilizadas no arquivo, alterando algumas
para se manter no limite do formato), Web Snap Adaptive (semelhante à adaptive, só
que converte cores semelhantes em cores da paleta segura da Web), Custom (podemos
buscar uma tabela de cor).
- Filter: são as maneiras como a imagem será filtrada para facilitar sua compressão.
FullScreen
O Flash também pode criar arquivos executáveis, que contém todos os elementos
necessários para visualizar o filme, sem a necessidade do usuário precisar de um
navegador para isso. O arquivo torna-se um pouco maior por conter os elementos
necessários incorporados a ele.
Podemos criar arquivos no Flash para gravar um CD-ROM multimídia, basta gerarmos
130
um arquivo executável e gravarmos este arquivo no CD.

Para gerarmos arquivos executáveis em Tela Cheia, sem aumentar as imagens evitando
uma perda de qualidade das imagens do filme, devemos colocar os comandos abaixo na
Timeline no filme:
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.displayState = StageDisplayState.FULL_SCREEN;
O Flash ainda gera arquivos no formato de vídeo compatível com o QuickTime. Esses
filmes podem ser assistidos por usuários que não possuem o plugin do Flash.
131
Anotações:
132
• Organização da Linha de Tempo e da Biblioteca

• Gravação de arquivos e controle de versão
• Organização do ActionScript em um aplicativo
• Convenções de vídeo
• Exportação, compressão e hospedagem de arquivos FLV
• Otimização dos arquivos FLA para saída SWF
Organização da Linha de Tempo e da Biblioteca

Os quadros e as camadas em uma linha do tempo mostram aonde estão colocados os
recursos e determinam como seu documento funciona. A forma de configurar e usar a
linha do tempo e a biblioteca afetam todo o arquivo FLA e sua aplicabilidade global
As diretrizes a seguir ajudam a criar conteúdos com eficiência e permitem que outros
autores que usam seus documentos FLA tenham maior compreensão da estrutura do
documento.
- Dê a cada camada um nome intuitivo de camada e reúna os recursos relacionados no
mesmo local. Evite usar os nomes padrão de camada (como layer 1, layer 2).
- Descreva com clareza a finalidade ou o conteúdo de cada camada ou pasta, quando
for nomeá-los.
- Se aplicável, coloque suas camadas que incluem o ActionScript e a camada para
rótulos dos quadros na parte superior da pilha de camadas na linha do tempo.
- Use pastas de camadas para agrupar e organizar as camadas semelhantes, para facilitar
a localização das camadas que incluem códigos e rótulos.
- Bloqueie as camadas que não estiver usando ou não deseja modificar.
- Nunca coloque quaisquer símbolos ou recursos em camada que inclua o ActionScript.
Como isso pode, potencialmente, causar conflitos entre os recursos no Palco e no
ActionScript que os aplicam, mantenha todos os seus códigos em sua própria camada
de ações e bloqueie depois de criá-la.
- Use rótulos de quadros (label) em um arquivo FLA, em vez de usar números de
quadros no código ActionScript. Se esses quadros mudarem posteriormente, quando
for editar a linha do tempo, e se usar rótulos de quadros e movê-los na linha do tempo,
não há necessidade de mudar nenhuma referência no seu código.
- Uso de pastas de biblioteca.
- Use pastas na biblioteca para organizar os elementos semelhantes (como símbolos
e recursos de mídia) em um arquivo FLA. Se nomear as pastas de biblioteca
consistentemente, todas as vezes que criar um arquivo, fica mais fácil lembrar onde
colocou os recursos. Normalmente, os nomes de pastas usados são Botões, Clipes de
134
filme, Gráficos, Recursos, Componentes e, algumas vezes, Classes.
Gravação de Arquivos e Controle de Versão

Para gravar os arquivos FLA, use um esquema de nomes consistente para seus
documentos. Isso é especialmente importante se gravar múltiplas versões de um único
projeto.
Use nomes intuitivos para os seus arquivos, de leitura fácil, não crípticos, e que
funcionem bem on-line:
• Não use espaços, letras maiúsculas ou caracteres especiais.
• Use apenas letras, números, barras e sublinhados.
• Se gravar múltiplas versões do mesmo arquivo, desenvolva um sistema de numeração
consistente como menu01.swf, menu02.swf e assim por diante.
• Pense em usar apenas caracteres em minúscula em seus esquemas de nomeação, pois
alguns software do servidor diferenciam maiúsculas e minúsculas.
• Considere um sistema de nomeação que use a combinação substantivo-verbo ou
adjetivo-substantivo para dar nomes ao arquivo, por exemplo, planejamentoclasse.swf
e meuprojeto.swf.
Organização do ActionScript em um Aplicativo

Sempre que possível, coloque o ActionScript em um único local. A organização do
código em um lugar ajuda a editar os projetos com mais eficiência, pois podemos evitar
a busca em locais diferentes quando depuramos ou modificamos o ActionScript.
Se colocar código no arquivo FLA, coloque o ActionScript no Quadro 1 ou no Quadro
2, em uma camada chamada ações na camada mais alta da Linha do tempo.
Convenções de Vídeo
Há muitas opções disponíveis para editar o vídeo, antes de importarmos para um
documento FLA, ou para carregar um arquivo FLV para um arquivo SWF. O Flash e o
Adobe Media Encoder têm controles melhores para compressão de vídeo. A compressão
cuidadosa do vídeo é importante porque ela controla a qualidade da seqüência de
imagens do vídeo e o tamanho do arquivo. Os arquivos de vídeo, mesmo comprimidos,
são grandes em comparação com a maioria dos outros recursos do arquivo SWF.
Antes de importar o vídeo para o Flash, considere a qualidade de vídeo que necessita, que
135
formato de vídeo usar com o arquivo FLA e como fazer o download. Se importar vídeo
para um arquivo FLA (chamado vídeo incorporado), ele aumenta o tamanho do arquivo
SWF para publicação. O download deste vídeo começa a ser feito, progressivamente,
para o computador do usuário, seja o vídeo visualizado ou não.
Podemos exibir o vídeo externo FLV usando um componente ou um objeto de vídeo.
Um componente facilita o desenvolvimento de aplicativos com o vídeo FLV, porque
os controles do vídeo são pré-construídos e há necessidade apenas de especificar o
caminho do arquivo FLV para reproduzir o conteúdo.
Para manter o arquivo SWF o menor possível, exiba o vídeo em um objeto de vídeo e
crie seus próprios recursos e códigos para controlar o vídeo. Considere, também, o uso
do componente FLVPlayback do Flash CS4 Professional, que tem tamanho de arquivo
menor do que os componentes de Media (Flash MX Professional 2004 e posterior).
É uma boa idéia dar algum controle aos usuários (como a capacidade de parar, dar
pausa, reproduzir e reiniciar o vídeo, além de controlar o volume) sobre o vídeo em um
arquivo SWF.
Para conquistar algum tipo de flexibilidade sobre o vídeo, como manipular o vídeo com
animação ou sincronizar diversas partes dele com a linha do tempo, incorpore o vídeo
no arquivo SWF, em vez de carregá-lo usando o ActionScript ou um dos componentes
Media.
Para maior controle sobre um símbolo de vídeo que a classe Vídeo permite, coloque
o vídeo dentro de um Movie Clipe. A linha do tempo do vídeo é reproduzida
independentemente de uma linha do tempo do Flash e podemos colocar o conteúdo
dentro de um clipe de filme para controlar as linhas de tempo.
Exportação, Compressão e Hospedagem de Arquivos FLV

Podemos exportar arquivos FLV dos ambientes de criação do Flash. Após a exportação
do vídeo para o documento, ele aparece como símbolo de vídeo na biblioteca. Para
exportar o vídeo como FLV, selecione o vídeo e depois selecione Biblioteca >
Propriedades. Para definir configurações de exportação, clique em Exportar na caixa de
diálogo Propriedades do vídeo incorporado.
O exportador QuickTime do FLV comprime vídeos de software de edição de vídeo de
terceiros.
Quando for comprimir o vídeo, lembre-se das seguintes recomendações:
• Não comprima novamente o vídeo. Recomprimir novamente um vídeo provoca
degradação da qualidade, como artefatos. Use seqüências filmadas não processadas, ou
as menos comprimidas, que tenha disponíveis.
136
• Faça o seu vídeo o mais curto possível. Apare o início e o fim do vídeo e edite para
remover todo o conteúdo desnecessário. Isso pode ser conseguido diretamente no Flash
usando o assistente de importação de vídeo.
Otimização dos Arquivos FLA para Saída SWF

Na medida em que aumenta o tamanho do arquivo de documentos, também aumenta
o tempo de download e a velocidade da reprodução. Podemos tomar diversas medidas
para preparar nosso documento para uma melhor reprodução.
Como parte do processo de publicação, o Flash executa automaticamente alguma
otimização nos documentos. Antes de exportar um documento, podemos otimizá-lo
ainda mais usando diversas estratégias para reduzir o tamanho do arquivo. Podemos,
também, comprimir o arquivo SWF na publicação.
Enquanto fazemos as mudanças, teste o documento executando-o em diversos
computadores, sistemas operacionais e conexões da internet.
Para otimização de documentos siga as seguintes diretrizes:
• Use símbolos, animados ou não, para todos os elementos que aparecem mais de uma
vez.
• Use animações interpoladas sempre que possível na criação de seqüências animadas.
As animações interpoladas usam menos espaço de arquivo do que uma série de quadros-
chave.
• Use clipes de filme em vez de símbolos gráficos para seqüências de animação.
• Limite a área de mudança em cada quadro-chave; faça a ação acontecer na menor área
possível.
• Evite elementos de bitmap animados; use imagens de bitmaps como elementos
estáticos ou de fundo.
• Use mp3, o menor formato de som, sempre que possível.
• Limite o número de tipos de linhas especiais, como tracejadas, pontilhadas, irregulares
e assim por diante. As linhas sólidas exigem menos memória. As linhas criadas com a
ferramenta Lápis exigem menos memória que os traçados com pincel.
• Limite o número de fontes e de estilos de fonte. Use fontes incorporados com
moderação, pois elas aumentam o tamanho do arquivo.
• Use gradientes com moderação. O preenchimento de uma área com cor gradiente
exige cerca de 50 bytes a mais do que preenchê-la com cor sólida.
137
• Use transparência alfa com moderação, pois ela retarda a reprodução.

►► O melhor formato de bitmap a ser importado para o Flash é o PNG, o formato nativo
do Adobe Fireworks. Os arquivos PNG têm informações RGB e alfa para cada pixel.
A taxa mais alta de quadros (medida em quadros por segundo, ou fps) produz uma
animação suave em um arquivo SWF mas pode exigir muito do processador,
principalmente em computadores mais antigos. Teste as animações em taxas de quadros
diferentes, para encontrar a menor taxa de quadros possível.
O bitmap em cache ajuda a melhorar o desempenho de clipes de filmes de conteúdo
estático nos aplicativos. Quando definimos as propriedades MovieClip.cacheAsBitmap
ou Button.cacheAsBitmap para verdadeiro, o Flash Player coloca em cache a
representação interna do bitmap do clipe de filme ou da ocorrência do botão. Isso pode
melhorar o desempenho dos clipes de filme com conteúdo vetorial complexo. Todos
os dados vetoriais de um clipe de filme que têm bitmaps em cache são desenhados no
bitmap, em vez de no Palco principal.
138

Flash cs4

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Flash cs4

Transféré par

Droits d'auteur :

Formats disponibles

Adobe Flash CS4:

Adobe Flash CS4: Multimídia Interativo

Unidade 2: O Ambiente de Trabalho do Flash CS4

Unidade 3: Modos de Desenho e Objetos Gráficos

Unidade 4: Usando Símbolos e Animando

Painel Motion Presets..........................................................................................34

Unidade 5: Trabalhando com Camadas e Textos

Unidade 6: Máscaras na Animação

Unidade 7: Cinemática Inversa (IK)

Unidade 8: Criando Botões

Unidade 9: Introdução ao ActionScript

Unidade 10: Navegação no Flash

Unidade 11: Trabalhando com Textos Dinâmicos

Unidade 12: Áudio no Flash

Unidade 13: Criando Formulário

Unidade 14: Preloader

Unidade 15: Criando Banners Animados

Unidade 16: Importando Vídeo

Unidade 17: Publicando Documentos no Flash

Unidade 18: Melhores Práticas

Otimização dos Arquivos FLA para Saída SWF.................................................137

• A Tela Inicial (Start Page)

Unidade 2: O Ambiente de Trabalho do Flash CS4

Na versão CS4 o Flash não vem mais com dois

A Tela Inicial (Start Page)

Do lado direito temos os painéis juntos. Podemos expandi-los ou retraí-los apenas

Ao escolher esta opção vemos os painéis em forma de ícones:

É possível gravar as configurações que tenhamos criado para escolhê-la posteriormente,

Dependendo da seleção atual, este painel exibe informações e configurações para o

- Na área Dimensions definimos Largura (Width) e altura (Height) do Stage do Flash.

por segundo do documento.

As camadas em um documento são listadas em uma coluna no lado esquerdo da Linha

Para configurarmos essa velocidade, no painel de propriedades, basta

Este painel contém as ferramentas necessárias para desenharmos, criarmos objetos,

Toda a ferramenta que possui uma pequena seta preta na parte

►► Dependendo da ferramenta selecionada, talvez um conjunto de modificadores seja

Podemos, também, personalizar este painel clicando

• Modo Object Drawing

Unidade 3: Modos de Desenho e Objetos Gráficos

Modo Object Drawing

Quando as duas formas forem de cores iguais e estiverem com o

Quando criamos retângulos ou formas ovais usando as ferramentas

Formas Rectangle e Oval

Clicando no palco e arrastando já teremos uma estrela.

Desenhando com a Ferramenta Pencil

- Straighten: para desenhar linhas retas e converter aproximações de triângulos, ovais,

Pintando com o Brush

Selecione a forma e o tamanho do pincel

Para excluirmos um ponto de ancoragem, posicionamos o ponteiro

Ajustando e Remodelando os Segmentos

- Para transformar a seleção, arraste as alças.

- Para mover a seleção, posicione o ponteiro sobre o objeto na caixa

- Para definir o centro de rotação ou dimensionamento, arraste o ponto

- Para girar a seleção, posicione o ponteiro perto da parte de fora

- Para inclinar a seleção, posicione o ponteiro no contorno entre as alças de transformação

O painel Color permite que modifiquemos a paleta de cores de

Laboratório: Iniciando a Montagem do Hotsite

Unidade 4: Usando Símbolos e Animando

Os elementos desenhados no Flash com as suas ferramentas de desenho correspondem

2- Com essa forma selecionada, clique no menu:

clique em Options e selecione a opção Star

8- Vamos entrar no modo de edição do símbolo “estrela”.

Trabalhando com Linhas de Tempo