Macromedia Flash MX
Márcio Bueno
Conteúdo




Visão Geral
Gráficos Bitmaps e Vetoriais
Interface do Flash MX
Área Principais da Interface
Visão Geral


O Macromedia Flash MX é a ferramenta de
criação de padrão profissional para produzir
experiências de alto impacto na Web .
Se você desejar criar logotipos com
animação, controles para navegação em
sites da Web, animações extensas, sites da
Web inteiros do Flash ou aplicativos da
Web, o Flash é a ferramenta ideal para a
sua criatividade devido a sua eficiência e
flexibilidade.
Gráficos Bitmaps e Vetoriais


Gráficos Bitmaps  formados por
um conjunto de pontos (pixels). São
grandes e não escalam perfeitamente.
Gráficos Vetoriais  formados por
equações matemáticas que
especificam localização, direção e cor.
São mais leves e podem sofrer
transformações (escala, rotação, etc)
facilmente.
Propriedades do Documento




Dimensões
Cor do Fundo
Taxa de Quadros (por segundo)
Unidades de Régua
Área Principais da Interface




Ferramentas
Cena
Linha de Tempo
Biblioteca
Seta e Subselecionar
Linha e Laço
Cor do Traço
Cor do
Preenchimento
Caneta e Texto
Oval e Retângulo
Lápis e Pincel
Sensível ao
Contexto!
Transformação Livre e
Transformar Preenchimento
Tinteiro e Balde de Tinta
Conta-Gotas e Apagador
Mão e
Zoom
Ferramenta Seta



Clique Simples seleciona um objeto
(só o preenchimento ou só o contorno)
Clique duplo  seleciona o objeto
completo (preenchimento com o
contorno)
Clicar e Arrastar  Seleciona um
retângulo, move o objeto selecionado,
ou se for no contorno deforma o
objeto.
Ferramenta Subselecionar


Uso restrito a linhas e contornos
Para um ponto selecionado, pode-se:



Mover
Mudar o ângulo
Excluir
Ferramentas: Seta, Oval e
Retângulo



Para desenhar deve-se clicar no ponto
inicial e arrastar até o ponto final.
A ferramenta Retângulo possui a
opção Raio do Retângulo
Arredondado.
Cada ferramenta possui sua guia
propriedades sensível ao contexto
Ferramenta Laço



Seleciona uma área desenhada à mão
livre.
Pode-se configurar o grau de
similaridade para a seleção.
Pode-se selecionar definindo um
polígono.
Ferramenta Lápis


Cria retas e curvas bezier.
Para desenhar siga os seguintes passos:
 Dê um clique para iniciar a figura.
 Dê um clique para desenhar uma reta.
 Dê um clique e arraste para desenhar
uma curva.
 Dê um clique dupla para finalizar a
figura.
Ferramenta Lápis
Ferramenta Texto

Mais intuitiva impossível!
Ferramenta Lápis


Utilizada para fazer
desenho à mão
livre.
Existem 3 opções
de formato para
esta ferramenta:
Ferramenta Lápis

Praticamente o mesmo desenho
utilizando as 3 opções de formato.
Ferramenta Pincel


Pinta à mão livre,
utilizando um
pincel.
Pode escolher as
seguintes opções
de pincel:



Tipo
Tamanho
Formato
Ferramenta Transformação
Livre

Utilizada para:




Girar e Inclinar
Dimensionar
Distorcer
Envelopar
Ferramenta Transformar
Preenchimento


Utilizada para alterar o preenchimento
do tipo gradiente ou bitmap.
Ajustando os seguintes itens:



Tamanho
Direção
Centro
Ferramenta Tinteiro

Utilizada para alterar:



Cor do traço.
Largura e o estilo do linhas ou de
contornos de formas.
Deve-se primeiro alterar estas opções
na guia propriedades e depois clicar
no objeto que se deseja alterar.
Ferramenta Balde de Tinta


Utilizada para
preencher
espaços fechados
vazios, ou já
preenchidos.
Pode ser
configurada para
fechar lacunas.
Ferramenta Conta-Gotas

Utilizada para copiar os atributos de
traço e preenchimento de um objeto e
aplicá-los imediatamente a outro
objeto.
Ferramenta Apagador


Utilizada para
apagar uma área
do desenho.
As opções
disponíveis são:



Tipo
Torneira
Formato
Ferramenta Zoom e Mão


A ferramenta Zoom é utilizada para
alterar a ampliação da figura.
A ferramenta Mão é utilizada para
mover a área de exibição sem alterar
o zoom.
Ferramentas Cores





Alterar a cor do
traço.
Alterar a cor do
preenchimento.
Preto-e-Branco.
Sem Cor.
Trocar Cores.
Cena


É a área de desenho para desenvolver
a cena.
Pode-se ter várias cenas, quando o
filme for publicado, as cenas serão
apresentadas na ordem em que estão
exibidas no painel Cena.
Voltar
Editar Símbolos
Nome da Cena
Painel Cena
Editar Cena
Zoom
Linha de Tempo


Organiza e controla o conteúdo de um
filme em camadas e quadros ao longo
do tempo.
Os seus componentes mais
importantes são:



Quadros
Camadas
Reprodução
Quadro


É a unidade mais básica do filme, um
quadro representa um instante da
cena no tempo.
Existem dois tipos de quadros:


Quadro-Chave  Representa quadros
que possui figuras (vetoriais ou bitmaps)
compondo a cena.
Quadro  Representa um quadro
normal, onde o seu conteúdo é igual ao
do Quadro-Chave anterior.
Quadro x Quadro-Chave



Quadro-Chave  1
Quadros  2 a 9
Quadro-Chave em Branco  10
Interpolação Forma



O Flash MX faz o morphing de uma
forma geométrica simples em outra,
gerando todos os passos intermediários.
Para este tipo de interpolação não
podem ser utilizados figuras agrupadas.
Pode-se utilizar dica de forma para
melhorar o morphing.
Criando uma Interpolação de
Forma

Siga os seguintes passos:




Crie um quadro-chave e faça o desenho
da 1ª figura geométrica.
Crie um outro quadro-chave e faça o
desenho da 2ª figura geométrica.
Selecione na linha do tempo estes dois
quadros-chaves e todos os quadros
intermediários.
Na guia propriedades, selecione Forma na
opção Interpolação.
Interpolação de Forma
Interpolação de Movimento


Nesta interpolação, o Flash MX pode
interpolar as alterações de posição,
rotação e também mudar a cor do
objeto de forma gradativa.
Para alguns tipos desta interpolação é
necessária a conversão da figura em
um símbolo.
Criando uma Interpolação de
Movimento

Siga os seguintes passos:




Crie um quadro-chave e faça o desenho da
figura desejada (transforme em símbolo).
Crie um outro quadro-chave e altere algo no
símbolo (posição, rotação, cor, etc).
Selecione na linha do tempo estes dois
quadros-chaves e todos os quadros
intermediários.
Na guia propriedades, selecione Movimento
na opção Interpolação.
Interpolação de Movimento
Animação Quadro-a-Quadro


É a tarefa mais fácil (tecnicamente) de
se fazer no Flash MX, basta ir criando
quadros-chaves na linha do tempo e em
cada quadro-chave fazer o desenho em
cada posição do tempo.
Porém, é o processo mais trabalho que
tem, pois é necessário fazer, por
exemplo 12 desenhos para 1 segundo
de animação.
Camadas



As camadas são utilizadas para separar
os diversos elementos que compõem
uma cena.
Por exemplo: a música, a paisagem, os
personagens, etc.
As camadas são superpostas, portanto,
os elementos das camadas superiores
se sobrepõem aos das camadas
inferiores.
Camadas
Guia de Movimento



Existe uma camada especial chamada guia de
movimento.
Esta camada pode ser utilizada para descrever
o caminho que o objeto animado por
interpolação de movimento realizará.
Para isto basta adicionar uma guia de
movimento para a camada que possui a
interpolação e desenhar nesta guia com a
ferramenta lápis a trajetória que o objeto
descreverá.
Interpolação de Movimento
com Guia de Movimento
Biblioteca



Ao criar uma animação ou filme em Flash
MX, é necessária uma grande quantidade
de símbolos.
Na biblioteca são armazenados todos os
símbolos criados, pois eles podem ser
reutilizados em várias cenas, e em vários
quadros de uma mesma cena.
É possível importar símbolos
desenvolvidos em outros projetos do
Flash MX, ou clipes de mídia.
Criação de Símbolo

Existem duas maneiras de se criar um
símbolo:



Convertendo uma figura existente em
símbolo. Para isto é só selecionar a figura,
clicar com o botão direito na figura e
selecionar Converter em símbolo.
Criando um símbolo novo a partir do menu
inserir.
Nestes dois casos, você deve escolher o
tipo de símbolo através de uma caixa de
diálogo.
Caixa de Diálogo
Criar/Converter Símbolo
Comportamentos do Símbolo

Clipe de Filme

Use símbolos de clipe de filme para criar
animações reutilizáveis. Os clipes de filme
possuem sua própria Linha de Tempo
composta por vários quadros, que é
reproduzida independentemente da Linha de
Tempo do filme principal — considere-os
como minifilmes que podem conter controles
interativos, sons e até mesmo outras
instâncias de clipe de filme.
Comportamentos do Símbolo

Botão

Use símbolos de botões para criar
botões interativos no filme que
respondam a cliques do mouse,
sobreposições ou outras ações. Defina
os gráficos associados aos vários
estados dos botões e, depois, atribua
ações a uma instância de botão.
Comportamentos do Símbolo

Gráfico

Use símbolos gráficos para imagens
estáticas e para criar peças reutilizáveis
de animação, ligadas à Linha de Tempo
do filme principal. Os símbolos gráficos
operam em sincronismo com a Linha de
tempo do filme.
Dicas para realizar uma
animação

Antes de mais nada defina um roteiro
para a sua animação, pois com ele
você poderá dividir as tarefas e
concentrar os esforços na direção
correta da concretização do filme a ser
produzido.
Dicas para realizar uma
animação



Crie símbolos que possam ser
reaproveitados o máximo possível.
Crie as animações quadro-a-quadro
como símbolos, e use interpolação de
movimento para evitar precisar criar
muitos desenhos.
Crie muitas camadas para deixar
separados os itens de uma cena (sempre
é bom o som/música estar numa camada
separada)
Dicas para realizar uma
animação

Se você não souber desenhar no
computador, pode utilizar como auxílio
um bitmap que contenha a figura
desejada em uma camada, e em outra
camada fazer um desenho a mão livre
com a ferramenta lápis (opção de
suavizar ativada) para “decalcar” a
figura desejada.
Resumo


O Flash MX é uma ótima ferramenta
para construção de material
multimídia.
Possui cena, linha do tempo e
camadas para a construção de
animações (do mesmo modo que em
um cinema).
Resumo



Possui diversas ferramentas para
criação e manipulação de figuras.
Disponibiliza três tipos de animações:
quadro-a-quadro, interpolação de
forma e interpolação de figura.
Planejamento na hora de criar uma
animação é fundamental.
Materiais para Consulta

No próprio Flash MX, no menu Ajuda,
possui um tutorial para dominar as
ferramentas disponíveis.
No site da Macromedia:

http://www.macromedia.com/software/flash/
Livros sobre Flash MX, como:




Dominando Macromedia Flash MX
Macromedia Flash MX Guia Autorizado de
Treinamento Macromedia
Flash MX Passo a Passo