2

U
I

-

C
o
n
c
e
i
t
o
s

B

s
i
c
o
s

d
o

F
l
a
s
h

M
X
3
Contedo da Unidade
Unidade I -
Conceitos Bsicos
do Flash MX
A1. Introduo
u O que o Macromedia Flash MX
u Novidades do Flash MX
u Imagens bitmap versus imagens vetoriais Imagens bitmap versus imagens vetoriais
u Arquivos .SWF e .FLA
u Sites em Flash
u Atividades
A2. Interface do Flash MX
u Interface Interface
u Menus Menus
u Palco Palco
u Painis Painis
u Criando um novo flme Criando um novo flme
u Atividades Atividades
A3. Desenhando no Flash
u Ferramentas de desenho Ferramentas de desenho Ferramentas de desenho
u Ferramentas de seleo e encaixe Ferramentas de seleo e encaixe Ferramentas de seleo e encaixe
u Seleo de Objetos Seleo de Objetos Seleo de Objetos
u Modifcando desenhos Modifcando desenhos Modifcando desenhos
u Edio de texto Edio de texto
u Rguas e grade Rguas e grade
A4. Atividades - Projeto
4
A
1

-

I
n
t
r
o
d
u

o
5
4
A
1

-

I
n
t
r
o
d
u

o
5
A1 - Introduo
O que o Macromedia Flash MX
O Macromedia Flash um software para desenvolvimento
de animaes e aplicaes multimdia, tanto para World
Wide Web como para Cd-rom, utilizando tecnologia
vetorial. considerado atualmente um padro mundial
Wide Web como para Cd-rom, utilizando tecnologia Wide Web como para Cd-rom, utilizando tecnologia
para desenvolvimento multimdia e multiplataforma,
uma vez que flmes feitos no Flash podem ser executados
nas mais diversas plataformas (Computadores Desktop,
HandHelds, entre outros).
Apesar de necessitar que o navegador tenha um plug-
in instalado para visualizar contedo Flash, atualmente
cerca de 90% dos computadores pessoais j vm com
tal plug-in embutido no sistema operacional.
A primeira verso do software
de animao padro do mercado
chamava-se Future Splash
e como oferecia bastantes
recursos para criao de sites,
interfaces animadas, arquivos
interativos e pequenos, a
Macromedia comprou o software
e relanou-o com o nome de
Flash, nas verses 2, 3, 4, 5 e
em 2002 a verso MX.
Novidades do Flash MX
A macromedia vem se empenhando desde as primeiras A macromedia vem se empenhando desde as primeiras A macromedia vem se empenhando desde as primeiras
verses do Flash para torn-lo um produto cada vez verses do Flash para torn-lo um produto cada vez verses do Flash para torn-lo um produto cada vez
mais poderoso, oferecendo possibilidades crescentes mais poderoso, oferecendo possibilidades crescentes mais poderoso, oferecendo possibilidades crescentes
para os designers e programadores que o utilizam. para os designers e programadores que o utilizam. para os designers e programadores que o utilizam.
A atual verso MX, que sucedeu o Flash 5, trouxe no A atual verso MX, que sucedeu o Flash 5, trouxe no
apenas mudanas visuais na interface como tambm apenas mudanas visuais na interface como tambm
novos processos e ferramentas de trabalho, como por novos processos e ferramentas de trabalho, como por
exemplo:
Suporte a vdeo
Crie apresentaes multimdia sofsticadas Crie apresentaes multimdia sofsticadas
incorporando vdeo. O Flash MX possibilita a incorporando vdeo. O Flash MX possibilita a
importao de arquivos padro de vdeo, incluindo importao de arquivos padro de vdeo, incluindo
MPEG, DV (Digital Video), MOV (QuickTime) e AVI.
Redimensione, gire, incline, mascare e anime objetos
de vdeo, tornando-os interativos atravs de scripts.
O Macromedia Flash Player 6 oferece suporte nativo
a vdeo.
Inspetor de propriedades
O gil e poderoso inspetor de propriedades, antes
elemento do Macromedia Dreamweaver, agora est
presente em todos os produtos da linha MX da
Macromedia.
Pastas para as Camadas
Visto que em projetos complexos o nmero de
camadas tende a ser enorme, a nova verso do
Flash permite criar pastas para organizar e agrupar
camadas.
Ferramenta Transformao Livre
Simplifca o processo de criao permitindo
dimensionar, girar e distorcer elementos grfcos a
partir de uma nica ferramenta.
Acessibilidade
Todo o contedo produzido em Flash pode ser
preparado para ser acessado por pessoas portadoras
de defcincia.
Imagens bitmap versus Imagens
vetoriais
O grande sucesso das animaes feitas em Flash se
deve ao fato de ele utilizar a tecnologia vetorial para
construir os objetos e as animaes, proporcionando
arquivos extremamente pequenos e rpidos de serem
carregados atravs da Internet.
O Flash tambm pode importar arquivos bitmap,
porm recomenda-se o uso limitado destes tipos
de arquivo para no aumentar demasiadamente o
tamanho do flme e, conseqentemente, seu tempo
de download.
Mas afnal, o que so arquivos bitmap e arquivos
vetoriais?
O computador trabalha utilizando uma linguagem
binria. Assim, para armazenar uma imagem qualquer
o computador precisa converter a informao em o computador precisa converter a informao em
zeros e uns. As maneiras mais comuns de se fazer isso zeros e uns. As maneiras mais comuns de se fazer isso
atravs de um atravs de um mapa de bits ou de um arquivo
com instrues vetoriais. com instrues vetoriais.
Experimente aumentar o tamanho de uma imagem Experimente aumentar o tamanho de uma imagem
bitmap e voc ver uma srie de pontos. Cada um
dos pontos, ou pixels, so gravados seqencialmente
como uma srie de zeros e uns representando sua
cor e posio.
Arquivos bitmap, como fotos, por exemplo, costumam
ser grandes em tamanho de arquivo. Exemplos de
imagens do tipo bitmap so .GIF, .JPG, .BMP, .TIF...
Imagens vetoriais tendem a ser mais reduzidas, pois
no armazenam a imagem em si, mas dados referentes
a posio, ao tamanho, cor de preenchimento, entre
outras variveis. Quando o arquivo aberto, estas
informaes so lidas e o arquivo remontado
rapidamente na tela do computador. As grandes
vantagens de um arquivo de imagem vetorial so o
tamanho reduzido do arquivo e o fato de ele poder ser
redimensionado sem perda de qualidade.
5Exemplo de imagem Bitmap com aproximao de
1000%
6
A
1

-

I
n
t
r
o
d
u

o
A
T
I
V
I
D
A
D
E
S

7
Arquivos .SWF e .FLA
Os arquivos gerados pelo Flash so salvos no formato
FLA. So arquivos sem compactao que podem ser
abertos novamente para alterar seu contedo.
Para utilizar os flmes em um site preciso exportar
para o formato Shockwave Flash, que usa a extenso
SWF. Este formato compactado, o que permite
um tempo menor de download, e no permite mais
alteraes. Atravs de arquivos SWF podemos
tambm criar arquivos para CDs.
Sites em Flash
Para ter uma idia mais ampla sobre as
potencialidades do Macromedia Flash MX, procure
visitar sites produzidos utilizando esta tecnologia.
Alguns exemplos so:
www.macromedia.com.br Pgina em Portugus da Macromedia
www.madonna.com Site ofcial da Madonna
www.hiddenclue.co.uk/ Resolva crimes on-line
www.questacon.edu.au/vt/ Visita realmente virtual ao museu
www.pixelpharmacy.com/ Site do designer Alxis Trepanier
www.emotioncard.com.br Cartes virtuais em portugus
www.motherscustomcycles.com/ Motos e design
www.memphiszoo.org/ Zoolgico interativo
www.zoozoom.com/ Premiado site de moda e estilo
www.zeramalho.com.br Z Ramalho em verso digital
www.charges.com.br Site de animaes atualizado constantemente
www.fashkit.com Tutoriais e exemplos de Flash
www.kirupa.com Tutorias e exemplos de fash
6
A
1

-

I
n
t
r
o
d
u

o
A
T
I
V
I
D
A
D
E
S

7
1. Qual o tipo de imagem usado pelo Flash? Por que?
2. Uma das novidades do Flash MX suporte a acessibilidade. Por que importante implementarmos esta caracterstica
em nossos projetos?
3. Cite exemplos de sites em Flash que voc conhece e que no faam parte da listagem que foi apresentada nesta aula. 3. Cite exemplos de sites em Flash que voc conhece e que no faam parte da listagem que foi apresentada nesta aula.
8
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
9
8
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
9
A2 - Interface do Flash MX
Interface
A interface do Flash MX pode parecer estranha ou
mesmo assustadora primeira vista, porm, ao se
familiarizar com seu uso voc poder perceber que foi
concebida para ser gil e fexvel.
Os recursos personalizveis incluem layout de painis,
teclas de atalho e confguraes para publicao.
A interface de usurio a mesma utilizada em
outras ferramentas da Macromedia, o que aumenta
a produtividade dos usurios que utilizam outros
produtos.
5 Interface do Macromedia Flash MX
Menus
Uma boa parte dos menus possui ferramentas
correspondentes na barra de ferramentas padro. So
apresentados os principais:
Menu Arquivo
Possui opes comuns em muitos programas como
Novo, Abrir, Salvar e Fechar um arquivo. Permite:
u importar e exportar flmes;
u alterar as confguraes de publicao e publicar o
flme atual;
u imprimir um flme e confgurar a folha de
impresso;
u enviar arquivos .FLA anexados por e-mail;
u exibir arquivos recentes;
u fnalizar o Flash.
Menu Editar
Comuns no Menu Editar so as aes Recortar,
Copiar e Colar. Permitem:
u desfazer e refazer uma ao;
u selecionar todos os objetos, duplicar objetos
selecionados ou cancelar seleo;
u editar smbolos (geralmente o ltimo trabalhado),
editar objetos selecionados ou editar tudo, que
edita todo um grupo.
u Preferncias: Geral,Edio e rea de trabalho.
u Modifcar Atalhos do Teclado.
u Mapear fontes no encontradas.
Menu Exibir
Permite:
u ir para, recurso ligado ao trabalho com cenas;
u controlar o zoom;
u visualizao dos objetos dispostos no palco
(Contorno, Modo Rpido, Sem Serrilhado ou
Texto Sem Serrilhado);
u linha do tempo e rea de trabalho;
10
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
11
u ativar e desativar rguas e grades;
u encaixar objetos e ajustar aos pixels;
u ocultar bordas e painis.
Menu Inserir
Permite:
u criar um smbolo ou converter um objeto em
smbolo;
u inserir camada, pastas de camadas, quadros e
quadros-chave;
u interpolao de movimento e guia de
movimento;
u inserir e remover cena.
Menu Modifcar
Permite:
u modifcar propriedades da Camada, cena e
documentos;
u modifcar formas;
u duplicar e trocar smbolo;
u duplicar e traar (vetorizar) bitmaps importados. duplicar e traar (vetorizar) bitmaps importados.
Menu Texto
Para textos existem os recursos padro para a Para textos existem os recursos padro para a
formatao, como: Fonte, Tamanho, Estilo, Alinhar, formatao, como: Fonte, Tamanho, Estilo, Alinhar,
Controle (Aumentar ou Diminuir), Carter, Pargrafo Controle (Aumentar ou Diminuir), Carter, Pargrafo
e Opes.
Menu Controlar
Permite:
u reproduzir, retroceder, avanar e recuar quadros; reproduzir, retroceder, avanar e recuar quadros; reproduzir, retroceder, avanar e recuar quadros;
u testar flme, depurar flme e testar cena (atual); testar flme, depurar flme e testar cena (atual); testar flme, depurar flme e testar cena (atual);
u ativar aes quadro simples, ativar botes ativar aes quadro simples, ativar botes ativar aes quadro simples, ativar botes
simples e sem sons.
u Visualizar componentes em tempo de edio. Visualizar componentes em tempo de edio.
Menu Janela
Possui:
u barra de ferramentas, ferramentas (comuns); barra de ferramentas, ferramentas (comuns);
u todos os painis
u conjuntos de painis e salvamento do layout de
painel;
u fechamento de todos os painis;
u aes, movie explorer, sada, depurador;
u biblioteca, biblioteca comuns, objetos do
generator;
u organizao das janelas: em cascata ou lado a
lado.
u Acesso ao Sitespring Ferramenta de
gerenciamento de projetos da Macromedia.
Menu Ajuda
Possui as opes:
u arquivos muito completos de ajuda no uso do
Flash e Actionscript;
u Centro de Suporte Flash: Suporte On-Line.
Palco
A rea branca no meio da interface do Flash MX
chamada de Palco. O nome claro e quer dizer o
lugar onde as coisas acontecem. uma rea vital
chamada de Palco. O nome claro e quer dizer chamada de Palco. O nome claro e quer dizer
para o Flash, pois l que criamos todos os elementos
grfcos e animaes que comporo nossos sites e
apresentaes.
Somente os elementos que estiverem posicionados
no palco estaro visveis no flme, porm repare que
existe uma rea acinzentada circundando o palco.
Podemos utilizar este espao como ponto de partida
para um objeto que cruza a tela, como um letreiro, por
exemplo.
Painis
Painis so janelas acoplveis ou cortinas onde podemos
visualizar as propriedades dos elementos existentes no
palco. Os painis facilitam o trabalho, disponibilizando
acesso rpido s diversas funes disponveis no
programa. Um painel pode ser personalizado de acordo
com as necessidades do usurio; eles so carregados a
qualquer instante, fechados e reposicionados da melhor
maneira para facilitar o trabalho.
1. Para carregar os painis
u Acesse o menu Janela.
u Selecione o painel desejado. Selecione o painel desejado.
Ou para carregar todos os painis Ou para carregar todos os painis:
u Acesse o menu Acesse o menu Janela.
u Aponte para o Conjunto de Painis, e selecione
algum Lay-Out previamente preparado.
Para melhorar a funcionalidade da interface do Flash MX,
os painis podem ser posicionados nas laterais da janela
do programa de modo a no interferir com os outros
elementos.
5 Painis laterais fechados
Ao lado do nome de cada painel h um pequeno
tringulo cuja funcionalidade recolher ou expandir o
painel quando clicado.
10
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
A
2

-

I
n
t
e
r
f
a
c
e

d
o

F
l
a
s
h

M
X
11
5 Ao clicar no tringulo, o painel se expande ou recolhe
Na extrema esquerda, ao lado do nome do painel e do Na extrema esquerda, ao lado do nome do painel e do
tringulo, existe ainda uma rea pontilhada. Sua funo tringulo, existe ainda uma rea pontilhada. Sua funo
destacar o painel da rea lateral, tornando-o uma destacar o painel da rea lateral, tornando-o uma
janela independente ou o contrrio, acoplar uma janela janela independente ou o contrrio, acoplar uma janela
de painel rea lateral.
5 O painel Cena sendo acoplado na rea lateral
Um dos painis mais utilizados devido sua fexibilidade
o Inspetor de propriedades. Sua fexibilidade deve-
se ao fato do contedo do painel mudar dinamicamente
mostrando sempre as propriedades do objeto
selecionado em tela.
5 Neste exemplo, o inspetor de propriedades est
exibindo as propriedades do documento
Criando um documento
Cada vez que o Flash aberto, o programa cria um
novo arquivo com a extenso FLA. Podemos alterar o
tamanho, nmero de quadros por segundo (fps), cor
de fundo e outras propriedades do novo documento
que foi carregado.
1. Alterar as propriedades de um
documento
u Acesse ao menu Modifcar.
u Aponte para o comando documento....
5 Janela Propriedade do documento
Estas confguraes so importantes, pois defnem Estas confguraes so importantes, pois defnem
a rea do flme (Palco) e como o flme aparecer a rea do flme (Palco) e como o flme aparecer
no Navegador (Browser). As possveis confguraes no Navegador (Browser). As possveis confguraes
desta janela: desta janela:
u Taxa de Quadros Taxa de Quadros Defne quantos quadros
sero apresentados por segundo, ou seja, quanto
maior a freqncia, mais rpida ser a animao
e vice-versa. O valor padro 12, podendo variar
de 0.01 a 120.
u Dimenses Defne a rea do palco
propriamente dita. Os valores das dimenses so
preenchidos de acordo com a unidade de rgua.
u Corresponder Podemos reescalar o flme para
corresponder com a rea do papel da impressora
ou ajustar ao tamanho dos objetos existentes no
palco. O boto Padro, retorna as opes aos
valores padro.
u Cor de Fundo Defne a cor de fundo do Filme.
u Unidades de Rgua Defne a unidade de
rgua a ser utilizada. Recomenda-se pixels para
unidade de medida.
Depois de escolher as propriedades que julgar
adequadas, voc pode clicar no boto OK para iniciar
o trabalho ou clicar no boto Tornar Padro, que faz
com que suas propriedades sejam sempre utilizadas
como valores padro.
12
A
T
I
V
I
D
A
D
E
S
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
13
1. Para que utilizamos o palco? E para que serve a rea cinza que o circunda?
2. O que so e para que utilizamos os painis?
3. Marque a alternativa incorreta:
o possvel inserir um novo smbolo no menu inserir/Novo smbolo possvel inserir um novo smbolo no menu inserir/Novo smbolo
o O inspetor de propriedades tem seu contedo alterado dependendo do objeto selecionado O inspetor de propriedades tem seu contedo alterado dependendo do objeto selecionado
o possvel modifcar a cor de fundo do palco atravs das propriedades do documento. possvel modifcar a cor de fundo do palco atravs das propriedades do documento.
12
A
T
I
V
I
D
A
D
E
S
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
13
O Flash contm uma srie de ferramentas que sero
de muita utilidade para o desenvolvimento do design.
Com estas ferramentas podem-se fazer linhas livres e
precisas, desenhar formas e preencher objetos.
Enquanto voc desenha, voc pode aproximar o desenho
com a ferramenta de lupa, alterar algumas propriedades
do tipo cor de linha e cor de preenchimento.
Todos os objetos que voc precisa para criar no Flash
encontram-se na barra de ferramentas:
5 Barra de ferramentas
Ferramentas de Desenho
Inclui-se neste conjunto todas as ferramentas da barra Inclui-se neste conjunto todas as ferramentas da barra
de ferramentas responsveis pela criao de elementos de ferramentas responsveis pela criao de elementos
na tela:
Linha Utilizada para fazer linhas. Sempre que
pressionada a tecla <SHIFT> possvel fazer linhas
mltiplas de 45.
5 Desenhando com a ferramenta Linha
Caneta Utilizada para desenvolver caminhos,
linhas, curvas com grande preciso. Ao clicar em dois
pontos distintos, a ferramenta gera uma reta, e ao clicar
e arrastar o mouse, a caneta gera uma curva.
5 Desenhando com a ferramenta Caneta
Oval Utilizada para fazer formas ovais ou
crculos perfeitos, caso tenha sido pressionada a
tecla <SHIFT>.
5 Utilizando o Oval com a tecla <Shift> pressionada
Retngulo Tendo as mesmas caractersticas
de funcionamento da ferramenta Oval, est ferramenta
permite fazer retngulos ou quadrados, se a tecla
<SHIFT> tiver sido pressionada durante o processo
de edio. Atravs do modifcador defnimos, atravs
de pontos, a curva nos cantos da forma retngulo.
Modifcador do retngulo
5 Retngulo com bordas arredondadas
A3 - Desenhando no Flash
O Flash tem um conjunto de
ferramentas para criao rpida.
Assim, ao sobrepor dois elementos
na mesma camada de cores
idnticas, os elementos se fundem.
Ao sobrepor elementos de cores
diferentes, o elemento de cima
perfura o de baixo.
14
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
15
Lpis Desenha formas livres sobre o palco,
com uma caracterstica interessante, as linhas podem
ser mais ou menos suavizadas.
5 Modifcadores da ferramenta lpis
Modifcadores:
u Acertar: Formas mais angulares.
u Suavizar: Curvas mais suaves.
u Tinta: Linha livre, semelhante ao suavizar : Linha livre, semelhante ao suavizar
Borracha Esta borracha possui alguns Esta borracha possui alguns
recursos que auxiliam bastante o desenvolvimento recursos que auxiliam bastante o desenvolvimento
de desenhos em Flash. Com ela podemos apagar de desenhos em Flash. Com ela podemos apagar
somente segmentos de linha (ou preenchimentos), somente segmentos de linha (ou preenchimentos),
podemos selecionar o que ser apagado, defnir podemos selecionar o que ser apagado, defnir
que tipo e tamanho de cursor ser utilizado e, com que tipo e tamanho de cursor ser utilizado e, com
o modifcador torneira, podemos apagar somente o modifcador torneira, podemos apagar somente
preenchimentos ou contornos clicando neles. preenchimentos ou contornos clicando neles.
Modifcadores da ferramenta Borracha
Pincel Semelhante ao lpis, esta ferramenta Semelhante ao lpis, esta ferramenta Semelhante ao lpis, esta ferramenta
permite alterar a espessura da linha, cor da linha, permite alterar a espessura da linha, cor da linha,
formato do cursor e o mais importante, pode defnir formato do cursor e o mais importante, pode defnir
que rea estar pintada.
5 Modifcador do Pincel
5 Tipos de Pincel (Da esquerda para direita: Original,
Pintar Normal, Pintar Atrs, Pintar Seleo, Pintar
Preenchimentos e Pintar Dentro)
Ferramentas de seleo e encaixe
Para possibilitar a alterao da posio (ou mesmo
forma) de um objeto utilizamos as ferramentas deste
grupo.
Seta Permite selecionar linhas, preenchimentos
ou ambos e objetos em geral.
Subselecionar Esta ferramenta permite
modifcar os pontos de uma curva, ajustando-a da
melhor maneira possvel.
5 Modifcaes de uma curva com a ferramenta
Subselecionar
Lao Permite selecionar formas irregulares
com grande facilidade.
Encaixar Esta ferramenta ajuda na criao e
movimentao de objetos, permitindo que os mesmos movimentao de objetos, permitindo que os mesmos
grudem nas bordas dos outros. grudem nas bordas dos outros.
Seleo de objetos
Quando se trabalha com formas pode-se selecionar s o
contorno, s o contedo ou, com duplo clique, selecionar
toda a forma (contorno e preenchimento). Para unir o
contorno e o preenchimento necessrio agrup-los.
1. Agrupamento de objetos
Clique duas vezes no objeto para selecionar o contorno
e o preenchimento.
u No menu Modifcar, escolha o comando
Agrupar.
Dessa maneira estaremos tornando todo o conjunto, um
nico objeto.
14
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
15
5 Elementos agrupados
2. Desagrupando objetos
u
u Clique no menu Modifcar e escolha a opo
Desagrupar.
3. Desagrupando textos
O objeto texto como um grupo especial, com todas O objeto texto como um grupo especial, com todas
as letras agrupadas em um nico objeto e com a as letras agrupadas em um nico objeto e com a
propriedade de edio do texto. A desvantagem do propriedade de edio do texto. A desvantagem do
objeto texto no permitir a metamorfose de um para objeto texto no permitir a metamorfose de um para
outro. Para isto ser possvel necessrio desmembrar o outro. Para isto ser possvel necessrio desmembrar o
texto, transformando-o em forma (shape). texto, transformando-o em forma (shape).
Para transformar um texto em forma:
u Selecione o objeto texto.
u No menu Modifcar, escolha o comando , escolha o comando
Desmembrar.
4. Ajuste de contorno
Algumas vezes precisamos ajustar as formas para que Algumas vezes precisamos ajustar as formas para que Algumas vezes precisamos ajustar as formas para que
possam obter formatos mais consistentes. Muitas vezes possam obter formatos mais consistentes. Muitas vezes possam obter formatos mais consistentes. Muitas vezes
precisamos suavizar ou deixar as bordas mais retas. precisamos suavizar ou deixar as bordas mais retas. precisamos suavizar ou deixar as bordas mais retas.
Estas ferramentas so ativadas quando a ferramenta Estas ferramentas so ativadas quando a ferramenta
Seta est ativada.
5 Tipos de Suavizao
Para suavizar:
u Selecione a forma.
u Clique na ferramenta Suavizar.
Para acertar:
u Selecione a forma.
u Clique na ferramenta Acertar.
Ferramentas Suavizar e Acertar
5. Organizao dos objetos (Ordem)
Os objetos do Flash so colocados em uma ordem de
sobreposio conforme so criados. Os objetos mais
recentes so colocados sobre os mais antigos.
Para alterar a ordem de sobreposio dos objetos:
u Selecione o objeto a ser ordenado.
u No menu Modifcar, escolha Organizar (se o
objeto selecionado for uma forma, as opes de
organizao estaro desabilitadas).
u Escolha a maneira que deseja organizar o
objeto: Trazer para Frente, Trazer um Nvel
para Frente, Enviar um Nvel para Trs,
Enviar para Trs
5 Ordem de objetos
6. Alinhamento de objeto
Alm de alinhar os objetos em relao a outros ou Alm de alinhar os objetos em relao a outros ou
em relao ao palco, pode-se tambm distribuir os em relao ao palco, pode-se tambm distribuir os
espaos entre os objetos e ajustar o tamanho deles.
5 Painel Alinhar
Para alinhar objetos:
u Selecione os objetos que deseja alinhar.
u No menu Janela, selecione a opo Alinhar.
u Na caixa de dilogo escolha o tipo de
alinhamento que deseja para os objetos.
Modifcando desenhos
Este conjunto de ferramentas tem como fnalidade
alterar desenhos e objetos que estiverem no palco.
Transformao Livre Esta ferramenta agrupa
em si uma sria de funcionalidades para distorcer
objetos: redimensionar, inclinar, rotacionar e moldar.
16
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
17
5 Na seqncia: Redimensionar, girar, inclinar,
distorcer e envelopar.
Balde de Tinta Esta ferramenta permite
preencher reas fechadas com cores slidas,
gradientes ou bitmaps. Pode-se preencher reas
fechadas e tambm confgurar o Flash para que
ignore pequenas falhas na imagem utilizando o
modifcador a seguir.
5 Modifcadores da ferramenta Balde de tinta.
Para preenchimentos especiais com degrades e cores Para preenchimentos especiais com degrades e cores
fora da palheta padro, utilize o painel fora da palheta padro, utilize o painel Misturador Misturador
de Cores:
u Escolha o tipo de preenchimento que deseja Escolha o tipo de preenchimento que deseja Escolha o tipo de preenchimento que deseja
utilizar: Slido, Gradiente ou Bitmap. utilizar: Slido, Gradiente ou Bitmap. utilizar: Slido, Gradiente ou Bitmap.
u No caso do gradiente (degrad), utilize as No caso do gradiente (degrad), utilize as No caso do gradiente (degrad), utilize as
ferramentas de seleo de cor para personalizar ferramentas de seleo de cor para personalizar ferramentas de seleo de cor para personalizar
o efeito que deseja.
Transformar Preenchimento Esta
ferramenta complementar ao preenchimento
degrad, pois permite alterar seu ponto de incio e
raio de ao, como mostra a imagem.
5 Alterando um degrade radial
Tinteiro (Nanquim) Trata-se de uma
ferramenta muito peculiar. Seu uso se restringe a
modifcar as propriedades do contorno de formas, ou
seja, as cores, tamanhos e formas das bordas dos
desenhos.
O inspetor de propriedades complementa a funo
do tinteiro, uma vez que quando a borda de algum do tinteiro, uma vez que quando a borda de algum
elemento selecionada, o contedo do inspetor se elemento selecionada, o contedo do inspetor se
altera para mostrar as opes possveis de confgurao altera para mostrar as opes possveis de confgurao
de contornos.
5 Inspetor de Propriedades exibindo confguraes de
contorno
Conta-Gotas Utilize o conta-gotas para
capturar cores de linhas e preenchimentos (cores
slidas, gradientes ou bitmaps) e imediatamente aplicar
a outro objeto ou forma.
1. Painis Info e Transformar
Para alterar imagens e elementos no palco temos
disposio diversas ferramentas e temos ainda os
painis Info e Transformar.
No painel Info encontramos:
logo abaixo e direita, informaes sobre a posio X
e Y do cursor;
u esquerda, temos informaes sobre a intensidade
das cores RGB (Vermelho, Verde, Azul) e A (grau
de Alpha transparncia), que so exibidas assim
que o cursor passado sobre os objetos.
u acima e esquerda temos informaes sobre o
tamanho do objeto;
16
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
17
u e fnalmente direita, a posio do objeto, que
pode ser em relao ao seu centro ou ao canto
superior esquerdo.
5 Painel Info
O painel Transformar serve para alterarmos
propriedades como tamanho, inclinao e rotao,
entrando com valores numricos de forma mais precisa
do que a utilizao manual da ferramenta Transformao
livre.
5 Painel Transformar
Edio de texto
Textos so elementos bsicos na criao de sites Textos so elementos bsicos na criao de sites
e apresentaes em Flash. Para criar um texto, clique e apresentaes em Flash. Para criar um texto, clique
na ferramenta carter na barra de ferramentas e, em na barra de ferramentas e, em
seguida no palco.
Antes de editarmos um texto podemos fazer as Antes de editarmos um texto podemos fazer as
devidas confguraes de fonte, tamanho, cor, estilo, devidas confguraes de fonte, tamanho, cor, estilo,
espaamentos e outros recursos, usando o inspetor
de propriedades que assim que a ferramenta texto
acionada muda seu contedo para opes de texto.
5 Inspetor de propriedades exibindo confguraes de
caracteres
Durante a digitao voc trabalha dentro de um
retngulo que se expande medida que forem
acrescentados mais caracteres. Quando clicamos
criada uma pequena caixa para que possamos iniciar
o trabalho. medida que vamos digitando, esta caixa
criada uma pequena caixa para que possamos iniciar criada uma pequena caixa para que possamos iniciar
vai se expandindo; se defnirmos o tamanho da caixa
antes de digitar, a largura ser fxa.
5 Tipos de blocos de texto.
Rguas e grade
Quase todos os programas grfcos disponveis
no mercado permitem ao criador utilizar-se de
ferramentas de apoio como rguas e grades. No Flash
no poderia ser diferente.
1. Rguas
As rguas facilitam a criao do design pois orientam
quanto a posio dos objetos. Elas podem ser
confguradas nas propriedades do documento para
exibir valores em diversas escalas, incluindo valores
mtricos, como centmetros ou valores tcnicos, como
pixels.
Para exibir as rguas: Para exibir as rguas:
u Clique no menu Exibir Clique no menu Exibir
u Selecione a opo rguas. Selecione a opo rguas.
Depois de ter exibido as rguas, possvel puxar
delas referncias guias, que servem para orientar o
designer mas no aparecem para o usurio fnal:
u Clique em cima da rgua horizontal ou lateral.
5 Cursor sobre a rgua horizontal
u Arraste o cursor at o ponto onde deseja que a
guia seja criada.
18
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
T
I
V
I
D
A
D
E
S

19
5 Guia na posio escolhida
2. Grades
Grades (tambm conhecidas como grids) so como
papis quadriculados que designers grfcos e
engenheiros utilizam para desenhar. A grade facilita
a organizao visual e o alinhamento interno dos
elementos.
Para exibir a grade:
u Clique no menu exibir
u Escolha a opo Grade
u Finalmente clique em mostrar grade. Finalmente clique em mostrar grade.
18
A
3

-

D
e
s
e
n
h
a
n
d
o

n
o

F
l
a
s
h
A
T
I
V
I
D
A
D
E
S

19
Vamos iniciar o projeto deste curso. Este projeto se estender por todo o material e criar um site multimdia para uma
empresa fctcia de turismo espacial, a Space Tour.
1. Crie um novo arquivo no Flash MX e confgure o documento da seguinte maneira:
Dimenses 760 pixels de largura x 420 pixels de altura.
Cor de fundo - #3366cc (Azul Claro)
Taxa de quadros 16 qps
Unidade da rgua pixels
No se esquea de exibir as rguas
2. Crie guias horizontais nas posies (aprox.) 50, 100, 350 e 400 pixels. 2. Crie guias horizontais nas posies (aprox.) 50, 100, 350 e 400 pixels.
3. Crie guias verticais nas posies (aprox.) 140, 180, 500 e 540 pixels. 3. Crie guias verticais nas posies (aprox.) 140, 180, 500 e 540 pixels.
Neste ponto o seu documento deve se parecer com a imagem a seguir: Neste ponto o seu documento deve se parecer com a imagem a seguir:
4. Utilizando retas ou a ferramenta caneta, trace uma forma geomtrica utilizando as guias como referncia. 4. Utilizando retas ou a ferramenta caneta, trace uma forma geomtrica utilizando as guias como referncia.
5. Preencha as formas geomtricas que voc criou utilizando a cor #000066 (Azul escuro). 5. Preencha as formas geomtricas que voc criou utilizando a cor #000066 (Azul escuro).
Neste ponto, seu projeto deve estar semelhante ao exemplo a seguir:
A4 - Atividades - Projeto
20
A
T
I
V
I
D
A
D
E
S
U
I
I

-

S

m
b
o
l
o
s

e

a
n
i
m
a

o

n
o

F
l
a
s
h
21
Contedo da Unidade
6. Est na hora de criarmos o logotipo da empresa de turismo espacial. Apesar de parecer complexo primeira
vista, o arco do logo pode ser criado sobrepondo parcialmente dois ovais de cores diferentes, aproveitando
a caracterstica do Flash de perfurar o elemento de baixo quando duas formas na mesma camada so
sobrepostas. Utilize a cor #FF9900
7. Para fnalizar o logotipo, instale a fonte Nasal.ttf em seu computador. Ela ser fornecida pelo professor e
ser de grande importncia para a criao do logo.
8. Escreva SpaceTour abaixo do arco que criamos utilizando a cor #FF9900 e posicione tudo no projeto como
mostra a imagem.
9. Salve o projeto como projeto_fase1.fa 9. Salve o projeto como projeto_fase1.fa