You are on page 1of 89

PARTE

1 ............................................................................................... 4

Parte 1 - Introduo .................................................................................. 4


Enquadramento do curso .................................................................................. 5
Objectivos Pedaggicos .................................................................................... 6
1.2.

Objectivos Gerais ............................................................................... 6

1.3.

Objectivos Especficos ......................................................................... 6

Estrutura Programtica .................................................................................... 7


PARTE

2 ............................................................................................... 8

Parte 2 - Desenvolvimento .......................................................................... 8


2.

3.

4.

Flash .................................................................................................... 9
2.2.

Flash o que ?.................................................................................. 9

2.3.

A quem se destina .............................................................................10

2.4.

Flash Player .....................................................................................10

2.5.

Caractersticas gerais .........................................................................11

PROJECTOS MULTIMDIA ............................................................................13


3.1.

A riqueza da multimdia ......................................................................13

3.2.

Concepo dos projectos .....................................................................14

DINMICA DO FLASH .................................................................................16


4.1.

Metforas .......................................................................................16

4.2.

Interface ........................................................................................17

4.2.1.
4.3.

Etapas ...........................................................................................23

4.3.1.

Criao/Importao do contedo ......................................................23

4.3.2.

Organizao e Sincronizao ...........................................................24

4.3.3.

Adicionar interactividade/programao (opcional) .................................25

4.3.4.

Publicao/ Exportao do filme ......................................................25

4.4.
5.

Gesto dos painis .......................................................................22

Ajuda ............................................................................................26

DO PALCO AOS BASTIDORES ........................................................................27


5.1.

Separadores de documentos..................................................................27

5.2.

Palco (stage) ....................................................................................27

5.3.

Camadas (layers) ...............................................................................29

5.3.1.

Criar/remover camadas .................................................................31

5.3.2.

Criar/renomear pastas ..................................................................31

5.3.3.

Gerir pastas ...............................................................................32

5.3.4.

Apagar camadas e pastas ...............................................................32

5.3.5.

Alterao da ordem das camadas e pastas ...........................................33

5.3.6.

Seleccione camadas e pastas ...........................................................33

An i m a o 2D
|

5.3.7.

Copiar camadas ..........................................................................34

5.3.8.

Copiar pastas .............................................................................34

5.3.9.

Modos de visualizaro das camadas e pastas .......................................34

5.3.10.

Propriedades das camadas e pastas ...................................................35

5.4.

Linha do tempo (Timeline) ...................................................................36

5.4.1.

Mover ......................................................................................37

5.4.2.

Redimensionar ............................................................................37

5.4.3.

Barra de estados .........................................................................38

5.4.4.

Cabea de leitura (Playhead) ..........................................................38

5.5.

Frames ...........................................................................................38

5.5.1.

Tipos de frames ..........................................................................39

5.5.2.

Modos de visualizao ...................................................................40

5.5.3.

Operaes sobre frames ................................................................41

5.5.4.

Rtulos, Comentrios e ncoras .......................................................44

5.5.5.

Onion skin .................................................................................44

5.6.

Smbolos .........................................................................................46

5.6.1.

Tipos de smbolos ........................................................................46

5.6.2.

Criao genrica de smbolos ..........................................................48

5.6.3.

Graphics ...................................................................................49

5.6.4.

Botes .....................................................................................49

5.6.5.

Clips de filme .............................................................................50

5.6.6.

Edio de smbolos .......................................................................51

5.6.7.

Duplicao de smbolos .................................................................51

5.7.

Biblioteca (libraries)...........................................................................52

5.7.1.

Painel Library.............................................................................52

5.7.2.

Redimensionar a janela .................................................................53

5.7.3.

Ordenar itens .............................................................................54

5.7.4.

Menu Options .............................................................................54

5.7.5.

Bibliotecas comuns common libraries) ...............................................56

5.7.6.

Biblioteca de outros filmes .............................................................58

5.7.7.

Bibliotecas partilhadas (shared libraries) ............................................58

5.7.8.

Smbolos de outros Filmes ..............................................................59

5.8.

Instncias .......................................................................................59

5.8.1.

Criao de instncias ....................................................................60

5.8.2.

Propriedades das instncias ............................................................60

5.8.3.

Quebra de ligao das instncias ......................................................62

5.9.

Um painel com histria .......................................................................63

An i m a o 2D
|

6.

Desenho de Objectos ................................................................................65


6.1.

7.

Cor e transparncia ............................................................................65

6.1.1.

Painel Color Mixer .......................................................................66

6.1.2.

Gradientes ................................................................................68

6.1.3.

Paletas .....................................................................................69

6.2.

Personalizao das ferramentas de desenho...............................................70

6.3.

Ferramentas de desenho e pintura ..........................................................70

TCNICAS DE ANIMAO ............................................................................76


7.1.

Cenas ............................................................................................76

7.2.

Animao frames-by-frame ..................................................................77

7.3.

Animao interpolada (tweening) ...........................................................78

7.3.1.

Interpolao de formas (shape tweening) ............................................78

7.4.

Distribuir objectos pelas camadas ...........................................................82

7.5.

Guias de movimento ...........................................................................83

7.5.1.

Parte 3 - Concluso ......................................................................87

Concluso ...................................................................................................88
Bibliografia .................................................................................................89
Nota ....................................................................... Erro! Marcador no definido.

An i m a o 2D
|

PARTE 1
Introduo

Parte 1 - Introduo

An i m a o 2D
|

Enquadramento do curso
hoje fundamental, para o desenvolvimento dos diversos sectores, dinamizar e valorizar os
recursos humanos atravs de programas formativos adaptados s novas tecnologias.
reconhecida a importncia que as novas tecnologias desempenham no trabalho e na vida
moderna. Os computadores deixaram de ser considerados como objectos estranhos, tornandose um auxiliar precioso e indispensvel ao desenvolvimento das actividades econmicas e com
um profundo reflexo nas outras vertentes da vida humana, sejam elas de carcter social,
administrativo, cientifico, cultural e at do laser.
Esta situao, no permite que hoje, na generalidade das actividades profissionais, se possa
prescindir da utilizao de recursos informticos.

An i m a o 2D
|

Objectivos Pedaggicos
1.2.

Objectivos Gerais

O curso de Produo Multimdia para a Internet O Flash visa dotar os formandos dos
conhecimentos necessrios para desenvolvimento de animao para sites com Flash MX,
animaes com imagens, grficos 2D, som e interactividade.

1.3.

Objectivos Especficos

Em termos de competncias especficas a adquirir, pretende-se que no final do curso os


formandos sejam capazes de:

Criar smbolos;

Trabalhar com layers;

Manipular Frames;

Tweening motion com motion guide;

Publicar e exportar projectos.

An i m a o 2D
|

Estrutura Programtica
A estrutura programtica do curso de formao foi desenvolvida tendo por base as
caractersticas do pblico-alvo, as suas necessidades de formao e os objectivos pedaggicos
que se pretendem alcanar com a interveno formativa. Os contedos programticos a
desenvolver visam, globalmente, o reforo do nvel de conhecimentos e aptides dos
formandos, de forma a potenciar a melhoria do seu desempenho profissional.
No mbito do curso de formao, ser prosseguido o seguinte plano de estudos:

Apresentao

Comportamento organizacional

Introduo ao multimdia local e em rede

Interface e ferramentas

Introduo time line

Criao de smbolos

Introduo aos layers

Frame by Frame

Tweening

Comandos bsicos

Test movie

Publicar e exportar projectos

An i m a o 2D
|

PARTE 2
Desenvolvimento

Parte 2 - Desenvolvimento

An i m a o 2D
|

2. Flash
2.2. Flash o que ?
Semelhante histria de muitos outros programas, o Flash comeou por ser Future Splasch
Animator, um pequeno programa de criao e de animao vectorial. Contudo, em 1997,
adivinhando o que viria a ser a base tecnologia da disponibilizao de contedo multimdia
na web, a Macromedia compra a Future Wave technologies e modifica o nome do programa
para Flash, promovendo-o como uma ferramenta de autor para a criao de interfaces de
navegao para a web. Em 2005 a Macromedia foi comprada pela Adobe e muda o nome do
programa para Adobe Flash CS.
O formato VECTORIAL aplicado aos objectos desenhados no Flash. Assentando em equaes
matemticas ou vectores, que incluem informao acerca das dimenses dos, objectos da
forma de preenchimento, da cor e da posio, este formato independente da resoluo, o
que significa que uma imagem que ocupe todo o ecr do monitor no sofre nenhuma
degradao de qualidade aps ter sido redimensionada a partir de outra mais pequena.
Este tipo de formato contrasta com o formato bitmap (mapa de bits), que representa uma
imagem atravs de um conjunto de PIXELS (unidade de medida dos pontos visveis num ecr)
agrupados de forma a criarem determinadas reas coloridas. Devido ao facto de determinados
efeitos s poderem ser aplicados sobre este formato, o suporte a este tipo de imagens est
garantido no Flash, sendo posteriormente aplicada uma tecnologia de compresso optimizada
para a web.
A chave do sucesso do Flash muito simples: integrar, interligar e compatibilizar na sua
gnese tudo o que seja necessrio (som, imagem fixa e animada, texto e vdeo) para criar
web sites, sejam ferramentas para CRIAO/EDIO DE IMAGENS, HTML necessrio para
visualizao do contedo nos browsers; PROGRAMAO bsica e avanada... tudo isto
possvel manipular de maneira simples e consistente, obtendo-se em contrapartida um
resultado profissional e atractivo.
Aplicaes web, interfaces de utilizador (ex. CD-ROM, DVD, telemveis, PDA e outros
dispositivos mveis) ou e-learning so apenas algumas das reas que utilizam contedo criado
com o Macromedia Flash. Proponho uma visita aos links seguintes para observar algumas das
potencialidades do Flash:

An i m a o 2D
|

www.evb.com
www.virtualbyron.com/vb.htm
www.ideum.com/sunearthviewer.html
www.hummer.com

2.3. A quem se destina


Estudos conduzidos pela independente NPD, revelam que 98 % dos browsers utilizados na web
esto em condies de apreciar as animaes ou outros elementos criados no Flash.
Este programa tem interesse para a generalidade das entidades que utilizam a Web como
plataforma de distribuio de informao de carcter institucional, educativo, lazer,
publicidade ou de outros tipos. De entre os utilizadores do Flash, destacam-se:
Profissionais

(ex. web desingners /programadores ) ligados produo/ publicao de

interfaces de navegao para a web (ou outros suportes do tipo CD-ROM, DVD, televiso
interactiva, PDA, Pochet PC, consolas de jogo/entretenimento, etc.) e de animao rica em
multimdia;
Alunos, formadores de cursos nas reas da Internet, multimdia ou ferramentas digitais.
Apesar de ser um programa com uma complexidade tcnica maior do que, por exemplo, um
processador de texto vulgar, isto no significa que aqueles que no dia-a-dia apenas realizam
processamento de texto no possam criar web sites de grande riqueza visual, com elementos
de navegao, vdeo, logtipos animados, animaes potentes e sincronizados com sons e com
um nvel substancial de interactividade e programao.

2.4. Flash Player


Para visualizarmos os filmes criados no Flash, necessitamos de uma aplicao denominada
Macromedia Flash Player.
Ao tornar-se um standard na web ganhou o estatuto de ser suportado por diversas
plataformas, browsers e dispositivos. Apple, Microsoft, Netscape e AOL so alguns dos
exemplos de terceiros que suportam esta aplicao.
An i m a o 2D
|

10

Com o Macromedia Flash MX Professional 2004 surgiu a possibilidade de criar contedo


multimdia para uma verso especfica do Flash Player, denominada Flash Lite, dirigida aos
dispositivos mveis. uma verso semelhante ao Flash Player 4, sendo que est optimizada
para a memria, velocidade do processador e rea de ecr caractersticas dos dispositivos
mveis. O contedo criado no Flash Profissional pode ser validado para ser suportado pelo
Flash Lite, sendo que este contm algumas caractersticas, entre as quais:
Estarem reservadas determinadas teclas para efeitos de navegao (estas teclas podem variar
de dispositivo para dispositivo);
Algumas das funes e propriedades do ActionScript no suportadas;
Os formatos de som suportados so apenas o MIDI e o MFi.
Os dispositivos MicrosoftTV, Symbiam EPOC,PocketPC e outros podem disfrutar da
compatibilidade com o Macromedia Flash Player. O Flash Player poder ser distribudo em
diferentes suportes (ex: CD-ROM; Intranet), pelo que dever consultar os seguintes endereos
para obter mais informaes:
http://www.macromedia.com/support/ shockwave/info/licensing/faq.html
http://www.macromedia.com/shockwave/dowload/license/desktop/
Com a pr-instalao nos browsers de maior relevo, no de estranhar que principais
empresas lderes nos seus mercados tenham adoptado esta tecnologia.
S para citar algumas: Cisco, Compaq, Intel, Microsoft, IBM, Netscape, America
Online, Apple, Oracle, Disney, Paramount, Dreamworks, Fox, Sony Peugeot. Audi, Ford,
Volkswagen, Pepsi, etc...
Uma outra aplicao da Macromedia, o Macromedia Shochwave Player, tambm permite
visualizar contedo multimdia.

2.5. Caractersticas gerais


inquestionvel que vivemos hoje em dia o sonho digital. A mensagem, a ideia ou a linha
de fora tm de vir revestidas de impulsos digitais instantneos atractivos, interactivos e num
formato diversificado.
A incorporao de suportes como o CD-ROM nos computadores pessoais veio abrir uma luz ao
fundo do tnel no que diz respeito experincia multimdia, principalmente ao nvel da
percepo de cariz pessoal.
An i m a o 2D
|

11

Mas, depressa a necessidade individual se tornou um imperativo global. Sendo um fenmeno


de massas, nomeadamente a partia da dcada de 90, a www acelerou a convergncia macia
de diferentes formatos de informao numa plataforma comum de comunicao. Aliadas
diversidade, surgiram tambm a morosidade e a (falta de) atractivamente.
Dvidas cada vez mais unnimes pairavam na cabea dos utilizadores: porqu suportar
tamanha lentido nas ligaes, para no fundo aceder a repositrios estticos de informao,
sem qualquer tipo de interactividade? Para quando formatos de informao estandardizados e
optimizados para uma plataforma comum? Texto dinmico, imagens fixas e animadas, som e
vdeo...ser possvel compatibilizar e sincronizar todos estes itens?
Estavam criadas as premissas para a vaga de fundo que ainda hoje se faz sentir, por exemplo,
no mbito dos MTODOS DE COMPRESSO aplicados aos diferentes formatos, PNG, SWF, XML,
MP3 e outros tipos de formatos/tecnologias permitem perspectivar um universo dinmico de
sensaes digitais cada mais realistas.
A mais-valida do Flash reside basicamente em dois pontos: formato vectorial das imagens e
controlo rigoroso sobre as mesmas.
Uma caracterstica implcita ao funcionamento do flasch diz respeito a uma inteligente
REUTILIZAO DE ELEMENTOS MULTIMDIA (um pouco semelhante filosofia do Macromedia
Director). Como por exemplo imagens e sons, convertendo-os primeiro em elementos de uma
biblioteca e s depois aplicando diversas INSTNCIAS desses mesmos elementos em diferentes
situaes, no contribuindo este facto para o aumento dos ficheiros de suporte, mas antes
mantendo tamanhos indicados para distribuio na web. Inclusive, as instncias de um mesmo
objecto podero ter caractersticas e comportamentos diferentes consoante o contexto em
esto inseridas.
Existe ainda a possibilidade de criar bibliotecas partilhadas com elementos (ex: um
determinado som que invocado ao longo de um site) que podero ser utilizado pelos
diferentes indivduos que intervm na concepo do projecto.
Os SCRIPTS e os COMPONENTES oferecem funcionalidades acessveis aos mais inexperientes ao
mesmo tempo que garantem aos profissionais uma sofisticao na interactividade.
SCRIPTS so combinaes de expresses que do origem a determinadas instrues. Estas
instrues so criadas no Flash atravs da linguagem de programao ActionScrit, controlando
aquelas o comportamento de determinados objectivos e do filme em geral. Estas instrues

An i m a o 2D
|

12

so despoletadas atravs de determinadas atravs de determinadas eventos (ex: efectuar um


clique sobre determinado boto), desencadeando-se logo em seguida aces predefinidas.
Importa referir que o Flash

est orientado para a criao e posterior distribuio de

contedo via web. No entanto, se assim o desejar, este mesmo contedo pode ser visto como
vdeo digital em ambas as plataformas Windows e Macintosh ( formato A V I ou QuickTime),
em CD-ROM, DVD ou noutro suporte digital compativel, num formato do tipo stand-alone,
juntamente com o Flash Payer devidamente

licenciado.

PDA, televiso interactiva

consolas de jogos/entretenimento so outros dispositivos onde o Flash comea

a ganhar

terreno.
Eis algumas das caractersticas gerais deste programa:
SUPORTE EM DIFERENTES PLATAFORMAS E DESPOSITIVOS entre outras: Dispositivos portteis,
consolas de jogos, televiso interactiva, rtc.;
SUPORTE PARA DIVERSOS STANDARDS INTERNET HTML, MP3, XML.,ECMAScript, etc.;
INTEGRAO CLIENTE-SERVIDOR atravs do Flash Remoting MX existe a intergao com o
ColdfFusion MX, Java e Microsoft.NET, entre outros;
CONTEDO COM ACESSIBILIDADES suporte para utilizadores com incapacidade de vrias
ordem;
TEMPLATES a criao de templates personalizados e componentes de interface prconcebidos poder originar ganhos de produtividade;
CONJUNTO PROFISSIONAL DE FERRAMENTAS no seu ambiente de edio so disponibilizadas
ferramentas profissionais de design multimdia e de desenvolvimento para a web;
FERRAMENTAS DE DESENVOLVIMENTO utilizao de uma linguagem(ActonScript) potente,
verstil e eficaz com recurso a depurao de cdigo.
Para os programas nesta rea, a Macromedia disponibilizou o FLASH PLAYER SDK que contm
documentao sobre a portabilidade para qualquer plataforma, com referncia s
implementaes em Windows 32 ActiveX, Windows CE 3.0 para o PocketPC 2002 ActiveXe
Linux.

3. PROJECTOS MULTIMDIA
3.1. A riqueza da multimdia

An i m a o 2D
|

13

Ao tratarmos os elementos multimdia, (imagem, texto, som, vdeo e outros) como


OBJECTOS, estes tornam-se MODULARES, ou seja, podem ser movimentados livremente entre
aplicaes desde que exista compatibilidade.
Vdeos, sons, textos, imagens fixas ou animadas e demais objectos so manipulados e o
respectivo comportamento pode ser definido via programao.
Para o Flash convergem vrios tipos de formato de informao, enriquecendo assim os web
sites.
Imagens (BMP, JPEG, GIF, PNG), vdeo (QuickTime) e sons (WAV, MP3) so alguns dos tipos de
informao suportados. No Flash possvel EDITAR alguns destes elementos, INTERLIG-LOS e
SINCRONIZ-LOS.
Uma das potencialidades do Flash na capacidade de diviso dos filmes em CENAS,
aumentando assim a flexibilidade na estruturao das animaes.

3.2.

Concepo dos projectos

A questo da DEFINIO DA AUDIENCIA fulcral.


Quem trabalha nesta rea sabe que o seu seguro morreu de velho... por isso, antes de
meter a mo na massa usual dedicar grande parte do tempo do projecto anlise de pr
requisitos. Inicialmente, teremos de dar resposta a questes do gnero:
A quem se destina o filme? Qual o pblico-alvo?
Qual vai ser a mensagem? Em que formato?
uma animao simples, linear ou destina-se a ser uma ferramenta de pesquisa interactiva
de formao? Sendo este ltimo caso o pretendido, qual a extenso do grau

de

interactividade?
Quais os elementos mdia necessrios? O documento ir conter, para alm de imagens
Vectoriais, bimtaps, vdeo e sons?
Qual ir ser o suporte de distribuio? Ser atravs da Internet, em CD-ROM do tipo standalone?
De quanto o oramento afecto a este projecto?
Se a televiso j faz parte da nossa famlia, tal facto deve-se a uma cada vez MAIOR
PERSONALIZAO DA MENSAGEM, isto , cada um de ns sente se cada vez mais representado
An i m a o 2D
|

14

nos seus gostos. A sofisticao da publicidade daquele meio de comunicao serve de


ensinamento para as plataformas tecnolgicas mais recentes e, quando acompanhada de
humor, a combinao pode ser explosiva!
muito comum no cinema os realizadores utilizarem folhas com as descries das cenas (um
dos que recorre ao STORYBOARDING o realizador Steven Spielberg). Este tipo de mtodo
visa expor, de forma simples, as ideias e descreve de uma forma sumria o contedo. Ao
mesmo tempo, um mtodo eficaz de identificar potenciais problemas. Este tipo de
abordagem deve contemplar os itens do projecto: layout, tipos de animaes e movimentos,
durao e sincronizao, pontos de interactividade e outros que se acharem relevantes. Para
alm de permitir explorar vrias opes naqueles tpicos, este documento poder servir de
suporte para discusso entre os intervenientes no projecto.
Muito importante para levar em considerao o processador dos computadores... Mas
ateno! O PROCESSADOR DOS COMPUTADORES DE DESTINO e no as nossas super mquinas.
um erro frequente julgar os outros nossa imagem, imaginando uma audincia com meios
tecnolgicos fartos, obtendo-se muitas vezes documentos desajustados s necessidades.
sabido que em computadores lentos mesmo as animaes mais dinmicas podero parecer
autnticos zombies. Para MENHORAR A PERFOMANCE, dever ser evitada a animao
simultnea de muitos objectos, principalmente utilizando a interpolao (explicado mais
adiante), para alm de, sempre que possvel, restringir esta animao a pequenas reas.
A VELOCIDADE DE PRODUO tambm muitas vezes um factor mal compreendido. No
devemos seguir a ideia de quando mais rpido melhor, j que para uma mquina que no
mximo reproduz 25 fps, de nada adianta estar definido no filme 100 fps. Recomenda-se 12
fps como um valor elevado e 24 fps como o mximo dos mximos. A excepo acontece
quando o filme exportado no formato QuickTime ou AVI, em que se podem definir outros
valores.
A DIMENSO DO FILME tambm importante e varia consoante a natureza do projecto. Sabese que, em princpio, um filme em ecr inteiro (full sreen executado de forma mais lenta
do que outro com 1/3 do tamanho. Contudo, muitas vezes necessitamos de filme de ecr
inteiro, por exemplo, para promover determinados produtos em que importante visualizar
detalhes.

An i m a o 2D
|

15

A primeira impresso muitas vezes decisiva e se ainda no existe um lema no que diz
respeito visualizao dos filmes Flash na web, arriscaria um do gnero grandes demoras
implicam grandes desistncias. Para fugir a este lema, muitos sites utilizam PRELOADERS,
que mais no so do que pequenas sequncias animadas que so executadas enquanto o
contedo do filme carregado. No entanto, estas sequncias no devero ultrapassar 5 a 10%
da durao do filme, caso contrrio, grandes demoras implicam grandes desistncias.

4. DINMICA DO FLASH
Depois de descodificarmos alguns termos que fazem parte do lxico de tralho do Flash, ser
focada a interface do programa, bem como toda a dinmica subjacente elaborao dos
filmes, i.., as etapas a executar para a realizao dos filmes flash. Vamos ento perceber a
razo pela qual o flash considerado o mago da web.

4.1. Metforas
No Flash vamos encontrar cenrios, elencos, cenas, efeitos especiais, montagens, sons e
muitas outras coisas.
Alguns termos que desde j convm descodificar:
DOCUMENTO- o filme que vai sendo criado durante a fase de edio; tem como suporte o
ficheiro nativo do Flash, com extenso Fla; neste formato h sempre a possibilidade de editar
os elementos que o integram;
FILME FLASH- uma verso optimizada tendo em vista a distribuio na web; tem como
suporte o ficheiro com o formato .swf (conhecido como swif, derivado de Shochwave Flash);
para efectuar alteraes nestes filmes, estas tero de recair sobre o documento associado;
ANIMAES parte de um filme, resultante de um conjunto de objectivos animados;
PROJECTOS (executveis)- formato de publicao, com extenso .exe no ambiente Windows
e, hpx em Macintosh; so ficheiros que permitem correr os filmes nos computadores sem

An i m a o 2D
|

16

que seja necessrio ter instalado o Macromedia Flash; este formato no permite a edio dos
contedos, sendo neste caso necessrio editar os documentos de origem (fla);
EXECUTAR (fora)/REPRODUZIR (dentro)- embora o resultado seja semelhante, o que os
destingue o facto de o filme estar ou no no ambiente de edio do Flash.
O Macromedia Flash um programa que corre em diferentes sistemas operativos e estes
podem estar configurados para suportar diferentes utilizadores. Para lidar com as diferentes
configuraes/personalizaes, o Flash utiliza duas pastas;
First Run contm os ficheiros comuns a todos os utilizadores;
Configuration contm os ficheiros que cada utilizador personalizou durante a sesso da
aplicao.
Cada vez que iniciamos uma sesso do Flash, feita uma comparao entre as duas pastas e
caso algum dos ficheiros comuns no se encontre na pasta Configuration (por exemplo, se foi
apagado), este reposto.

4.2. Interface
primeira vista a interface do Macromedia Flash pode parecer muito complicada, com muitas
reas, muitos painis acoplveis, etc. provvel que um designer personalize o ambiente de
edio de forma diferente de um programador, j que desempenhando diferentes papis
utilizam diferentes recursos (por exemplo, ferramentas).

An i m a o 2D
|

17

A partir do comando Preferentes do menu Edit, temos acesso ao separador General da caixa
de dilogo Preferences. Na parte inferior deste separador existem vrias opes para o
arranque da aplicao: Show Start Page (mostrar pgina inicial), New Document (criar novo
documento), Last documents open (abrir documentos recentes) e No document ( sem
documento).

Panormica geral da interface do Flash:

An i m a o 2D
|

18

Painis
Palco

Linha do tempo

Camada
Ferramentas de desenho e pintura
Inspector de propriedades

Atravs dos comandos Toolbar e Tools do menu Window, possvel personalizar a interface ao
nvel das barras de ferramentas a incluir. So quatro as barras que se podem incluir:
FERRAMENTAS PADRO (Main)

An i m a o 2D
|

19

New criar ficheiro

Open abrir ficheiro;

Save gravar ficheiro;

Print Imprimir;

Cut cortar;

Copy copiar;

Paste colar;

Undo desfazer aco;

Redo refazer aco;

Snap encaixar objectos; uma espciedeman;

Smooth suavizar linhas e contornos;

Straighten endireitar linhas e contornos;

Rotate and Sskew rodar e inclinar objectos;

Scale redimensionar objectos;

Align alinhar objectos.

FERRAMENTAS DE DESENHO E DE PINTURA (Tools)

An i m a o 2D
|

20

BARRA DE EDIO (Edit Bar )

Retroceder ao modo de edio do documento;

Cena corrente;

Smbolo editado;

Menu pendente de acesso s cenas do filme;

Menu pendente de acesso aos smbolos do filme;

Percentagem de visualizao do palco.

CONTROLADOR (Controller)

Semelhante a um vulgar comando de vdeo, permite aplicar sobre o filme determinadas


aces:
An i m a o 2D
|

21

Stop- para a reproduo

Rewind rebobinar o filme para o frame 1;

Step Back retroceder frame a frame;

Play reproduzir;

Step Forward avanar frame a frame;

Go To End saltar para o ltimo frame.

A BARRA DE MENU

uma das formas de aceder a alguns comandos do Flash. Para alm destes menus, esto
tambm disponveis menus de contexto, cujos comandos surgem referenciados posio do
cursor do rato (efectuar um clique com o boto direito do rato sobre o palco, objectos,
frames, camadas, etc.)
As barras Main e Controller podero estar flutuantes sobre a interface. Uma maneira rpida
para efectivar esta opo a combinao <Ctrl> + Para voltar ao estado inicial, bastar
efectuar um duplo clique sobre a barra de ttulo.

4.2.1. Gesto dos painis


O ambiente de edio no Flash pode tornar-se confuso para quem no estiver habituado a
tantos painis com diferentes tipos de informao.
Os PAINIS ajudam-nos a ver, organizar e modificar propriedades de diferentes elementos
que constam num determinado documento (por exemplo, frames, smbolos, instncias, cores,
etc.). Os diversos painis so invocados a partir do menu Window e esto divididos em trs
categorias:
DESIGN PANELS (painis ligados ao design) Align, Color Mixer, Color Swaychs, Info, Scene e
Transform;
An i m a o 2D
|

22

DEVELOPMENT PANELS (painis ligados programao) Actins, Bbehaviors, Componentes,


Componentes Inspector , Debugger, Output e Web Services;
OTHER PANELS (outros painis) Accessibility, History, Movie Explorer, String e Common
Libraries.

4.3. Etapas
Para entendermos melhor a elaborao das animaes, devemos seguir as seguintes etapas
bsicas inerentes criao de filmes no Flash.
4.3.1.

Criao/Importao do contedo

Criamos novos documentos a partir da pgina inicial ou do menu File -> New. H ainda a
possibilidade de criar a partir de um modelo/template. Um filme no mais do que um
conjunto de OBJECTOS, criados com as ferramentas ao dispor no Flash ou importados de
outras fontes complementares e que se encontram, ou no, animados. Muitas das
propriedades destes objectos podem ser alteradas recorrendo a PAINIS especficos.

An i m a o 2D
|

23

Depois de personalizados, estes ou qualquer outro tipo de documentos podero ser gravados
como template, atravs do comando Save as Template do menu File.
O contedo dos filmes do Flash suportado por dois tipos de ficheiros: um de edio, com a
extenso .fla, onde so criadas as animaes e aplicada a interactividade; ao outro, com
extenso .swf, aplicada a compresso, de forma a obter uma verso optimizada para a
web, Como lgico, o ficheiro de edio (documento) tem um tamanho maior

quando

comparado ao filme Flash,


Os objectos criados ao ambiente de edio do Flash transformar-se-o em elementos
efectivos do elenco logo que sejam convertidos em SMBOLOS (Modify ->Convert to Symbol)
e estejam assim armazenados numa BIBLIOTECA (library), facilitando desta forma a sua
gesto. Estes smbolos podero ser criados de raiz no documento, atravs do comando New
Symbol do menu Insert.
A mais-valia do Fash consiste em aplicar diversas INSTNCIAS de um mesmo smbolo em
diferentes cenrios e com diferentes propriedades.
4.3.2.

Organizao e Sincronizao

Agora que j temos elementos disponveis para o nosso filme, teremos de posiciona-lo no
PALCO (stage), a partir do qual visualizamos o decorrer de toda a aco.
A estrutura e a sequncia da aco esto definidas na LINHA DO TEMPO (timeline), na qual
esta descrito onde e quando se passa determinado evento. Assim, utilizamos o palco e a Linha
do tempo para organizar os elementos no espao e no tempo, atravs dos FRAMES.
OS FRAMES representam instantes temporais onde visualizamos o contedo do filme num
determinado momento, permanecendo este contedo visvel enquanto o frame est no ar.
Dito de outra forma, ao reproduzirmos o filme, existe um PONTEIRO/CABEA DE REPRODUO
que se move de frame em frame (da esquerda para a direita na Linha do tempo, caso no
exista programao que altere esta ordem), lendo a informao que vai sendo visualizada no
palco. A velocidade do filme tem assim uma relao directa com o nmero de frames
(fotogramas) processados num segundo, i.., fps.

An i m a o 2D
|

24

Quando estruturarmos o contedo dos nossos filmes, pensamos e agimos numa lgica de
sobreposio de diferentes objectos, de forma a criar determinados efeitos, noes de
profundidade, transparncias, mscaras, etc. Para este efeito, utilizamos as CAMADAS
disponveis na Linha do tempo.
As aplicaes de diferentes TCNICAS DE ANIMAO, de que exemplo a interpolao,
tambm esto contempladas no Flash.
Uma outra vantagem do Flash a possibilidade de dividir o filme em CENAS para uma melhor
distribuio do contedo, obtendo-se assim uma flexibilidade inexistente noutros programas
similares. Como bvio, todas estas cenas vo constar da publicao do filme.

4.3.3.

Adicionar interactividade/programao (opcional)

A INTERACTIVIDADE num filme pode estar representada atravs de botes ou noutros pontes,
permitindo a navegao por diferentes seces, cenas ou at saltos para o exterior (por
exemplo, para determinado URL).
O flash coloca disposio do leitor determinados COMPONENTES que mais no so do que
elementos visuais de interface pr-concebidos (por exemplo, caixa de verificao caixa de
listagem, caixa de combinao, boto de opo, boto de comando, barras de deslocamento,
etc.).
A programao ACTIONSCRIPT 2.0 vem estender as capacidades do filme para alm daquilo
que efectuado no palco e na Linha do tempo.
Mas para quem a programao se resume a aplicar num filme o mnimo de interactividade,
esto disponveis BEHAVIORS que poupam o utilizador de aprofundar a linguagem de
programao.
4.3.4.

Publicao/ Exportao do filme

medida que finalizamos o filme, vamos utilizando o CONTROLADOR (uma espcie de


comando de vdeo) para o reproduzir dentro do ambiente de edio do Flash, bem como para
efectuar TESTES.
An i m a o 2D
|

25

Depois de confirmado o pleno funcionamento, chega a altura de decidir o formato de


distribuio do filme (caso seja esse o seu destino)- ou EXPORTAR para um dos formatos
suportados ou PUBLICAR em diferentes formatos, com caractersticas especficas inerentes a
cada um deles.

4.4.

Ajuda

Atravs dos comandos do menu Help acedemos ao painel Help que contm dois separadores:
Help- informao de ajuda generalizada;
How Do I...-

pequenas lies sobre as funcionalidades

do Flash; por aqui que os

utilizadores menos experientes devero comear.


Assim, s temos que clicar nas matrias do lado esquerdo dos separadores e vizualizar o
contedo pretendido no lado direito. No painel existem ainda alguns botes:

History Back retroceder um passo;

History Forward avanar um passo;

Table of Contents- mostrar o ndice de contedos dos separadores;

Sarch- pesquisar palavras ou expresses;

Print- imprimir contedo;

Update- actualizar contedos via Internet.

No ambiente Windows possvel aumentarmos o tamanho da letra nos painis de ajuda. Para
isso, prima (e no largue) a tecla <Ctrl> e rode o terceiro boto (normalmente um boto em
forma de roda) do rato.
Atravs do menu Help temos acesso a diferentes manuais em formato digital:

An i m a o 2D
|

26

GETTIN STARTED- serve de introduo ao Flash;


USING FLASH informao acerca do ambiente de trabalho (interface, comandos, etc.) do
Flash;
USING COMPOTADORES informadores sobre como criar, configurar e adicionar componentes
nos filmes;
ACTIONSCRIPT REFERENCE GUIDE introduo aos conceitos da programao ActionScript.

5. DO PALCO AOS BASTIDORES


Como se processa a criao de um filme, focando para isso o palco onde decorre a aco e o
modo de interligar e compor os diferentes tipos de contedos.

5.1.

Separadores de documentos

A forma de acesso aos documentos atravs de separadores identificado com os nomes que
do ttulos aos ficheiros. Para aceder ao documento basta efectuar um clique sobre o
separador que contm o nome do filme, destacando-se esse separador em primeiro plano
relativamente aos restantes.

Sempre que editamos um documento, e at gravamos as alteraes, aparece um asterisco


direita do novo separador.

5.2. Palco (stage)


no palco que criamos e visualizamos o contedo da nossa animao. Serve assim, de pano
de fundo para o nosso filme.
An i m a o 2D
|

27

Dizendo isto de uma outra forma: no palco que est representado o contedo do filme, isto
o palco representa o contedo, num determinado momento, da(s) camada(s). atravs do
palco e os objectos nele apresentados que interagimos directamente com o filme.
Para uma melhor preciso e orientao, temos disposio no palco uma rgua (View ->
Rulers), uma grelha (View -> Grid -> Show Grid) e guias (View -> Guides -> Show Guides).

Quando criamos um novo documento, devemos definir logo de incio algumas propriedades,
atravs da caixa de dilogo Document Properties que encontramos no menu Modify ->
Document:

An i m a o 2D
|

28

Dimensions especificar o tamanho do filme, atravs da largura ( Width) e da altura (Height);


as unidades so representadas em pixels;
Em relao ao tamanho padro do filme, ele de 550x400 pixels; no que diz respeito aos
valores mnimo e mximo, eles so de 1x1 pixels e de 2880 x 2880 pixels, respectivamente.
Match:
Printer- ao efectuar um clique neste boto faz coincidir o tamanho do palco com a rea de
impresso definida para a impressora;
Contents ao efectuar um clique neste boto atribui um espao idntico s margens do palco;
se o objectivo for minimizar o tamanho do filme, dever alinhar todos os elementos ao canto
superior esquerdo do palco antes de efectuar o clique neste boto;
Default ao efectuar um clique neste boto atribui ao palco o tamanho por valor assumido;
Background Color definir a cor de fundo do palco atravs da paleta;
Frame Rate definir a velocidade de reproduo do filme, i. ., o nmero de frames
(fotogramas ou quadros) exibidos num segundo (fps);

Se, por exemplo, definirmos uma velocidade de 10 frames por segundo para determinado
filme, isto quer dizer que num segundo vo ser percorridos 10 frames ou, por outras palavras,
os objectos de cada frame permanecero no palco (no ar) cerca de 1/10 segundos. O valor
normal indicado para a reproduo de animaes nos web sites varia entre 8 e 12 fps. No
entanto, no custa nada ir testando diferentes velocidades...
Ruler Units -

unidade de medida da rgua (Inches, Inches decimal, Points, Centimeters,

Milimeters e Pixels);
Make Default aplica as definies escolhidas a todos os novos documentos.

5.3.

An i m a o 2D
|

Camadas (layers)

29

As CAMADAS so o corao do Flash. Reparem no seguinte: com uma ferramenta deste tipo,
com todas as potencialidades disponveis e com uma inspirao divina, podemos cair (e
bem!) na tentao de criar animaes complexas, com uma variedade de objectos distintos,
com diferentes posies perspectivas, tamanhos, formas, cores, transparncias, etc...!
Ora, at aqui tudo bem. Mas... como possvel organizar toda esta panplia de itens, de uma
forma integrada, coerente, realstica e independente? Atravs das camadas.

A analogia recorrente para a abordagem das camadas imagin-las como um conjunto de


folhas transparentes, do tipo papel vegetal, sobrepostas umas em cima das outras.
Transpondo isto para o Flash, vemos que as camadas so linhas horizontais que atravessam a
Linha do tempo (timeline).

Por valor assumido, ao criar um documento no Flash criada apenas uma camada na Linha do
tempo. Sabendo ns que o aumento do nmero de camadas no contribui para o aumento de
tamanho do documento possvel ir adicionando camadas sucessivas at ao limite imposto
pela memria disponvel no computador.
A vantagem desta abordagem. Comum a outros programas, como por exemplo, o Adobe
Photoshop e o prprio Macromedia Director (com os canais do Score) recai na separao
entre, por exemplo, objectos estticos e objectos animados, permitindo, por um lado, uma
fcil identificao das pores que compem a animao e, por outro, a edio independente
de determinados objectos, sem interferir assim nos demais.
Para aplicar sons e aces a um filme, utilizam camadas separadas.
An i m a o 2D
|

30

No Macromedia Flash existe a possibilidade de criao de PASTAS na Linha do tempo que nos
permitem organizar as camadas segundo determinados critrios (por exemplo, de acordo com
o tipo de objectos nela contidos).

5.3.1.

Criar/remover camadas

Sempre que uma nova camada adicionada Linha do tempo, esta colocada acima da
camada ou pasta previamente seleccionada. Efectue um dos seguintes processos:
Invoque o comando Layer do menu Insert;
Efectue um clique no boto Insert Layer que est posicionado na parte inferior da rea das
camadas.
O nome que o Flash aplica camada est directamente relacionado com o nmero de
camadas ou pastas j criadas (Layer 1, Layer 2, Layer 3... Layer n). Ora, este critrio pode
no ser o mais coerente para o nosso projecto, pelo que sempre que possvel aquele nome
dever reflectir o tipo de objectivos e as aces a eles associadas. Para alterar este nome,
podemos efectuar um duplo clique sobre a camada ou invocar o comando Layer do menu
Modify (explicado mais adiante) e escreve o novo nome.
5.3.2.

Criar/renomear pastas

Sempre que uma nova pasta adicionada Linha do tempo, esta colocada acima da camada
ou pasta previamente seleccionada. Efectue um dos seguintes processos:

An i m a o 2D
|

31

Invoque o comando Layer Folder do menu Insert;


Efectue um clique no boto Insert Layer Folder que est posicionado na parte inferior da rea
das camadas.
O nome que o Flash aplica pasta est directamente relacionada com o nmero de pastas ou
camadas j criadas (Folder

1,

2, Folder 3... Folder n). Ora, tal como acontece com a

criao de camadas, este critrio pode no ser o mais coerente para o nosso projecto, pelo
que sempre que possvel aquele nome dever reflectir o tipo de camadas que residem na
pasta. Para alterar este nome, podemos efectuar um duplo clique sobre a pasta ou invocar o
comando Layer do menu Modify e escrever o novo nome.
5.3.3.

Gerir pastas

As estruturas de pastas no Flash seguem a filosofia de directrio que encontramos em


alguns sistemas operativos. Assim as pastas podem conter no s camadas, mas tambm
outras pastas.
Podemos utilizar o tringulo logo atrs no nome da pasta para EXPANDIR ou FECHAR PASTAS.
Para MOVER UMA PASTA ou UMA CAMADA PARA DENTRO DE UMA PASTA, basta arrast-los.
No processo de arrastamento das camadas para uma nova posio, e para que nenhuma caia
inadvertidamente numa pasta, mantenha fechada (s) a(s) pasta (s) por onde ir passar a
camada.
5.3.4.

Apagar camadas e pastas

Para APAGAR UMA CAMADA ou UMA PASTA, e assim todos os objectos nelas contidos,
efectuarmos um dos seguintes processos:
Seleccione a camada ou a pasta e efectue um clique no boto Delete Layer que est
posicionado na parte inferior da Linha do tempo;
ou
Arraste a camada at ao boto Delete Layer.
Pode utilizar a tecla de <Shift> para seleccionar blocos de camadas/pastas adjacentes ou a
tecla de <Ctrl> para camadas/pastas no adjacentes. O que pode acontecer que vai apagar

An i m a o 2D
|

32

algumas vezes coisas por engano. No se esquea do comando Undo do menu Edit que
permite desfazer aces.
5.3.5.

Alterao da ordem das camadas e pastas

A HIERARQUIA DE SOBREPOSIO no palco o reflexo directo da forma como esto ordenadas


as camadas na Linha do tempo. Assim, os objectos que pertencem as camadas posicionadas
mais acima na rea das camadas so exibidos frente dos outros objectos contidos nas
camadas mais abaixo.

Dito de forma, um objectivo est mais perto de ns e mais visvel em relao aos restantes,
quando mais acima (na rea das camadas) estiver a camada que o contm. Para alterar esta
ordem: arraste a camada ou a pasta que se pretende reordenar para uma nova posio.
5.3.6.

Seleccione camadas e pastas

A SELECO DE UMA DETERMINADA CAMADA pode ser efectuada com um dos seguintes
processos:
Seleccionar um objecto no palco;
Seleccionar um determinado frame na Linha do tempo;
Efectuar um clique sobre o nome da camada na Linha do tempo.
Pode utilizar a tecla de <Shift> para seleccionar blocos de camadas adjacentes ou a tecla de
<Ctrl> para camadas no adjacentes.

An i m a o 2D
|

33

Para SELECCIONAR PASTAS, basta efectuar um clique no nome.


5.3.7.

Copiar camadas

O processo de cpia no Flash assume um papel importante, j que com ele possvel copiar
todo o contedo de uma camada ou apenas algumas seces da sequncia de uma
determinada animao. Mais, esta cpia pode ocorrer entre camadas do mesmo filme. A
camada que ir receber a informao copiada herda o nome da camada atrvs do qual
derivou o contedo.
Assim, para efectuar a CPIA DE UMA CAMADA:
Efectue um clique no nome da camada que ir ser copiada, de forma a seleccion-la;
Invoque o comando Copy Frames atrvs do menu Edit; ->Timeline;
Carregue no boto Insert Layer; temos assim uma nova camada criada que ir receber o
contedo entretanto copiado;
Clique na nova camada e invoque o comando Paste Frames do menu Edit
5.3.8.

Copiar pastas

Para COPIAR PASTAS:


Efectue um clique no tringulo esquerda da pasta de forma a fecha-la; depois um clique no
nome da pasta cujo contedo ir ser copiado, de forma a seleccion-la;
Invoque o comando Copy Frames do menu Edit;
Carregue no boto Insert Layer Folder ou invoque o comando Layer Folder do menu Insert;
temos assim uma nova pasta criada que ir receber o contedo entretanto copiado;
Clique na nova pasta e invoque o comando Paste Frames do menu Edit.
5.3.9.

Modos de visualizaro das camadas e pastas

Uma das vantagens do Flash tem a ver com a flexibilidade ao nvel da edio das camadas
(apenas uma de cada vez), i e ., durante o processo de edio podemos apenas querer
camadas, para impedir que a edio de algumas interfira no contedo de outras. Assim so
quatro os modos de visualizao para efeitos de edio:
NORMAL - o modo que o Flash aplica, por valor assumido, assim que criamos uma nova
camada ou pasta, ou quando determinado objecto importado, criado criado ou colado no
An i m a o 2D
|

34

palco; cone (sob a forma de lpis) logo a seguir ao nome da camada indica-nos qual a camada
actual;
OCULTO - ocultar o contedo de camadas ou pastas de maneira a realar de forma a aparecer
um X; ao ocultar uma pasta est tambm a ocultar todas as camadas ou pastas nela contidas;
caso queiramos todas as camadas e pastas, efectuamos um clique na coluna com um olho;
mantendo a tecla <Alt> premida e efectuando um clique sobre a primeira coluna direita do
nome de determinada camada ou pasta, ocultamos todas as outras; para mostrar de novo o
contedo, repetimos a operao;
As camadas ou pastas ocultas, apesar de poderem ser exportadas, no podero ser editadas.
A ocultao das camadas ou pastas no preservada quando o filme publicado.
BLOQUEADO -

bloquear o contedo de camadas ou pastas para que seja visualizado o

contedo das mesmas, mas impossibilitada a sua edio, evitando erros acidentais. Para
ocultar determinada camada ou pasta, efectue um clique na segunda coluna direita do
nome dessa camada ou pasta de forma a aparecer um cadeado ; ao bloquear uma pasta est
tambm a bloquear todas as camadas ou pastas nela contidas; caso queiramos bloquear todas
as camadas e pastas, efectuamos um clique na coluna com um cadeado (Figura 4.19);
mantendo a tecla <Alt> premida e efectuada um clique sobre a segunda coluna direita do
nome de determinada camada ou pasta, bloqueamos todas as outras; para desbloquear de
novo, repetimos a operao;
CONTORNOS - aplicar contornos coloridos ao contedo de camadas ou pastas para que este
seja facilmente identificado no palco; para aplicar um determinado contorno aos objectivos
de uma camada, efectue um clique na ltima coluna direita do nome dessa camada de
forma a aparecer um quadrado sem preenchimento; ao efectuar um clique na ltima coluna
direita do nome de uma pasta, aplica contornos a todos os objectos camadas, efectuamos um
clique na ltima coluna; mantendo a tecla >Alt> premida e efectuado um clique sobre uma
camada, aplicamos contornos a todas as outras; para retirar os contornos, repetimos a
operao.
Diferentes camadas podem ter diferentes modos de visualizao e a mesma camada pode
acumulada cada um destes modos. Por exemplo, ter uma camada

bloqueada e com um

determinado contorno, enquanto outra est oculta.


5.3.10.

Propriedades das camadas e pastas

Muitas das operaes descritas anteriormente esto disponveis na caixa de dilogo Layer
Properties, acessvel a partir do menu Modify ->Timeline -> Layer Properties:
An i m a o 2D
|

35

Name- atribuir um nome camada ou pasta.

Show - ocultar/mostrar contedo da camada ou pasta.

Lock - bloquear/desbloquear camadas ou pastas.

Type definir o tipo de camada.

Normal - camada normal ou converter pasta em camada .

Guide - vincular camadas camada guia de movimento.

Mask - definir camada como mscara.

Masked vincular camadas camada de mscara.

Folder -

converter camada em pasta; se a camada tiver contedo, deparamo-nos

com uma caixa de dilogo.

Outline color definir cor do contorno aplicado camada.

View layer as outlines visualizar o contedo da camada atravs de contornos.

Layer Height - definir altura da camada (uma maior altura pode ser til para Camadas
que contm sons, por exemplo).

Para aceder rapidamente caixa de dilogo Layer Properties, efectue um duplo clique sobre
o cone Layer esquerda do nome da camada.

5.4. Linha do tempo (Timeline)


Se as camadas so o corao do Flash, o crebro dos filmes reside na LINHA DO TEMPO.
Aqueles que j trabalham no Macromedia Director decerto encontram algumas semelhanas
entre a Timeline e o Score, pois bem, a lgica quase a mesma...

An i m a o 2D
|

36

Um FRAME pode conter vrias camadas, i. ., podemos (e

devemos) dividir os diversos

componentes da nossa animao por diferentes camadas, seguindo uma lgica de


sobreposio, tendo sempre em vista a composio final dos objectos.
Pense, pense e volte a pensar na composio dos elementos no palco, i. e., a sobreposio
de objectivos tendo em conta as respectivas camadas. a parte mais criativa, interessante
e importante do Flash!
na Linha do tempo que iremos temporizar e sincronizar os objectivos, definindo os
respectivos Timings de entrada e sada. Quando um filme inicializado, a Linha do tempo
percorrido da esquerda para a direita pela CABEA DE LEITURA (playhead), para que a
informao contida nos frames seja processada.
A sequncia do filme no obrigatoriamente linear, dependendo da estrutura elaborada e da
programao aplicada.

5.4.1.

Mover

A dinmica de funcionamento com a Linha do tempo similar adoptada para os painis.


Assim, podemos desacoplar a Timeline atravs do canto superior esquerdo e coloc-la noutras
posies ou convert-la numa janela flutuante.
Basta apenas arrast-la pelo ambiente de edio do Flash; para evitar o encaixe,
pressionamos a tecla <Ctrl>.
A Linha do tempo ainda ser expandida ou fechada, utilizando para o efeito o tringulo que se
encontra esquerda do nome Timelie ou efectuando um duplo clique sobre esse mesmo
nome.
5.4.2. Redimensionar

An i m a o 2D
|

37

A Linha do tempo pode ser redimensionada. Para isso, colocamos o cursor no limite da janela
e arrastamos para redimensionar. Com isto alargamos verticalmente a rea das camadas. Esta
rea tambm pode ser alargada horizontalmente.
5.4.3.

Barra de estados

A barra de estados fornece-nos algumas informaes.


Current Frame frame actual, cujo contedo est visvel no palco;
Frame Rate quando o filme no est a ser executado indica a velocidade de reproduo
especificada na caixa de dilogo Document Properties ( ao efectura um duplo clique nesta
rea, acedemos quela janela); quando reproduzimos o filme, o valor vai sendo
constantemente, reflectindo a velocidade real, que poder estar afastada da velocidade
previamente especificada devido s caracteristicas do computador que processa a animao;
Elapsed Teme espao tempo (segundos) decorrido entre o primeiro frame actual.
5.4.4.

Cabea de leitura (Playhead)

A CABEA DE LEITURA permite identificar qual o frame actual. Podemos percorrer os frames
arrastando a cabea para a esquerda ou direita. O boto Center Frame permite centrar a
Linha do tempo relativamente ao frame actual:

5.5. Frames
Os FRAMES so instantes temporais do filme que nos mostram o contedo das camadas.
tambm no frame que poder residir determinada programao

direccionada

para o

comportamento do filme.
Provavelmente j ouviu a expresso tweening, um conceito referente aos frames, est
subjacente na sua dinmica. Designam-se IN-BETWEEN FRAMES

(frames intermdios) os

frames que esto determinados por frames mestre e que representam pequenos incrementos
necessrios para simular determinado ou efeito. O mais espectacular que o prprio Flash se
se encarrega de os criar, poupando-nos muito trabalho.

An i m a o 2D
|

38

5.5.1.

Tipos de frames

Consoante o tipo de animao requerido, vamos ter associados diferentes frames.


Assim temos:
FRAMES VAZIOS so frames desprovidas de contedo (com um fundo branco) e que so
inseridos por valor assumido na Linha do tempo assim que criamos um novo documento; a
reproduo cessa a partir do ponto em que todas as camadas contm frames vazios;

FRAMES ESTTICOS estes frames so sempre precedidos por keyframes; assim o contedo do
keyframe aparece reflectido em todos os frames estticos seguintes at ser encontrado um
novo keyframe; so representados a cinzento claro;

FRAMES MESTRES/CHAVES (KEYFRAMES)- neste tipo de frames que se definem modificaes


a diversos nveis, como por exemplo alteraes no movimento ou nas caractersticas dos
objectos (por exemplo, cor e dimenso); adio ou remoo; para criar um keyframe
invocamos o comando Keyframe atravs de Insert -> Timeline ou pressionamos a tecla de
funo F6. Por valor assumido, o primeiro frame de cada camada automaticamente um
frame mestre.
Para melhor identificarmos este tipo de frames e os respectivos tipos de animao associados
(explicados no captulo das animaes), vejamos:
os frames mestres com um pequeno a apenso representam frames com programao;

os frames mestres que referenciam interpolao de movimento esto representados por um


ponto preto e os respectivos frames intermdios tm uma seta preta com um fundo azul
claro a represent-lo;

An i m a o 2D
|

39

os frames mestres que referenciam interpolao de forma (explicado no mbito das


animaes) esto representados por um ponto preto e os respectivos frames intermdios tm
uma seta preta com um fundo verde claro a represent-los;

Frames com uma linha tracejada referenciam um processo de interpolao


5.5.2.

Modos de visualizao

Atravs do menu de exibio dos frames, no canto superior direito da Linha do tempo
possvel acedemos a vrias opes no diz respeito s dimenses das clulas (quadrculas que
resultam da interseco da camada com o frame):

Tiny Clulas com largura mnima;

Small clulas com largura pequena;

Normal clulas com largura normal;

Mdium- clulas com largura mdia;

Large clulas com largura grande. Este formato indicado por exemplo para frames
que contenham sos, de forma a melhor visualizar o formato das ondas sonoras;

Short- encurtar as linhas;

Tinted Frames colorir os frames que tm contedo;

Preview- permite visualizar apenas o contedo de cada frame,

informao esta

redimensionada de forma a encaixar nas dimenses dos frames , da Linha do tempo,


podendo assim ocorrer variaes aparentes no tamanho do contedo;

Preview In Contet- permite visualizar totalmente cada frame do filme, informao


esta redimensionada de forma a encaixar nas dimenses dos frames da Linha do
tempo. Esta forma de visualizao permite assim observar a movimentao dos
objectos dentro dos respectivos frames durante a reproduo da animao. No
entanto, os elementos que a constituem podero parecer ter uma menor dimenso.

An i m a o 2D
|

40

5.5.3.

Operaes sobre frames

Agora que j sabemos quais os tipos de frames disponveis na Linha do tempo, vamos
descrever as principais operaes que incidem sobre eles:
Para SELECCIONAR UM DETERMINADO FRAME:

efectue um clique sobre o frame, com a tecla < Ctrl > premida.

Para SELECCIONAR UM INTERVALO DE FRAMES:


efectue um clique no primeiro frame do intervalo e arraste at alcanar o ltimo frame;
liberte o boto do rato para se certificar que o intervalo seleccionado o desejado.
Para INSERIR FRAMES ESTTICOS:
seleccione um frame vazio na Linha do tempo e invoque o comando Frame atravs de Insert
-> Timeline.
Para INSERIR FRAMES ESTTICOS NUM INTERVALO DE FRAMES:
seleccione um frame ou uma poro do intervalo de frames j existente; o nmero de
frames a inserir equivale ao numero de frames seleccionados;
invoque o comando Frame atravs de Insert -> Timeline; os novos frames so introduzidos
direita daqueles previamente seleccionados.
Para INSERIR FRAMES MESTRES NUM FRAME VAZIO:
seleccione um frame vazio na camada;
invoque o comando Blank keyframe atravs de Insert -> Timeline; deparamo-nos agora com
um rectngulo branco que indica onde acaba o contedo de um frame mestre e comea
outro.

An i m a o 2D
|

41

Para INSERIR FRAMES MESTRES VAZIOS NUM INTERVALO DE


FRAMES:
seleccione um determinado frame de um intervalo frames;
invoque o comando Bank keyframe atravs de Insert -> Timeline; o frame previamente
seleccionado foi convertido num frame mestre e o contedo dos frames subsequentes foi
removido.
Para INSERIR UM FRAME MESTRE:
seleccione um frame vazio ou esttico;
invoque o comando Keyframe

atravs de Insert -> Timeline; se o frame previamente

seleccionado for um frame vazio, sero um frame estticos; caso a seleco prvia tenha
incidido sobre um frame esttico, este convertido em frame mestre.
Para INSERIR UM FRAME MESTRE NUM INTERVALO DE FRAMES:
seleccione um intervalo de frames;
invoque o comando Keyframe atravs de Insert -> Timeline; automaticamente o ltimo frame
seleccionado convertido em frame mestre.

Para COPIAR E COLAR FRAMES so utilizados os comandos Copy


Frames e Paste Frames, ambos atravs de Edit -> Timeline, com funes
diferentes em relao aos tradicionais comandos de copiar e de colar outros objectos. Para
entender melhor estes conceitos, vamos realizar o seguinte exerccio:
crie um novo documento, com frames mestres nas posies 1,3,5,7 e 9:

An i m a o 2D
|

42

em cada destes frames mestre desenhe o nmero da respectiva posio, com a ajuda da
ferramenta Text da barra de desenho;
seleccione o keyframe 3 e invoque o comando Copy Frames atravs de Edit - Timeline;
com o frame 4 seleccionado, invoque o comando Paste frames atravs de Edit -> Timeline ;
este frame (que antes era um frame intermdio) recebe o novo contedo e converte-se num
frame mestre;
com o keyframe 5 seleccionado, invoque de novo o comando Paste Frames atravs de Edit ->
Timeline; verificamos que o contedo substitudo pelo novo contedo proveniente do
keyframe 3;
com o frame 4 seleccionado, invoque de novo o comando Paste Framesatravs de Edit ->
Timeline; vereficamos que so criados novos frames intermdios e existe agora o novo frame
mestre 14;
Para MOVER OU DUPLICAR FRAMES:
seleccione um frame ou um intervalo frames;
arraste os frames para uma nova seco da Linha do tempo; ao manter

pressionada a tecla

<Alt> enquanto arrasta, efectua uma duplicao.


Para ELIMINAR O CONTEDO E REMOVER FRAMES:
O comando Clear Keyframe do menu Modify -> Timeline retira o caracter de frame mestre
especfico ou a um intervalo de frames ; ao invocarmos este comando o contedo do frames
mestres, estes tornam-se frames intermdios e o respectivo contedo o contedo do frame
precedente; no entanto, este comando no interfere quanto ao nmero de frames num filme;
o comando Remove

Frames

do menu

Edit -> Timeline

elimina efectivamente frames,

frames mestres ou sequncia de frames, retirando-os inclusive do filme, reduzindo assim o


nmero de frames que o constituem.
Muitas vezes torna-se difcil eliminar um frame mestre sem primeiro eliminar os

frames

intermdios. Para evitar esta situao, seleccione todos os frames intermdios entre os
frames mestres que se querem eliminar ou elimine todo o

contedo do frame

mestre antes de invocar o comando Remove Frame. Pode, em alternativa, invocar primeiro o
comando Clear Keyframe e s depois o Remove Frame, caso o objecto seja reduzir o nmero
de frames do filme.
An i m a o 2D
|

43

5.5.4.

Rtulos, Comentrios e ncoras

Para CRIAR UM RTULO, UM COMENTRIO ou UMA NCORA;


seleccione um frame mestre; caso o inspector de propriedades no esteja visvel, invoque o
comando Properties do meu window;

Digite uma descrio na caixa de texto Frame;

A partir do menu pendente Label Type defina qual o tipo associado descrio:

Para visualizarmos a informao, necessitamos de posicionar o cursor sobre o frame mestre.


Os rtulos so identificados na Linha do tempo atravs de uma pequena bandeira vermelha;
os comentrios por duas barras verdes.
5.5.5.

Onion skin

O termo ONION SKIN deriva do processo utilizado pelos desenhadores convencionais que
utilizam diversas folhas transparentes (da a analogia
An i m a o 2D
|

com

casca de cebola)

para
44

desenharem determinados elementos, tendo como referncia um ou mais elementos que


compem a animao. A aplicao desta tcnica no contexto de edio de filmes do Flash
permite-nos visualizar mltiplos frames simultaneamente, efectivando a sua edio.
Para visualizarmos o contedo de vrios frames atravs do onion skin:
Efectue um clique no boto Onion Skin:

repare que o contedo de todos os frames includos nos marcadores de onion skin aparece
esbatido Os objectos deste contedo no podem ser editados, apenas os objectivos do frame
actual, i. e., onde est posicionada a cabea de leitura;
O contedo assente em camadas bloqueadas ou ocultas no visvel quando est
activo o onion skin.
Para visualizar apenas os contornos do contedo de vrios frames atravs do onion skin:
Efectue um clique no boto Onion Skin Outlines; repare que do contedo de todos os frames
includos nos marcadores de onion Skin aparecem apenas os contornos. O funcionamento
deste boto semelhante ao boto citado anteriormente;
No esquea que para cada camada pode atribuir uma cor diferente no que diz respeito ao
contorno, facto este que poder facilitar o processo de edio.
Para modificarmos o nmero de fraes pertencentes ao intervalo definido pelos marcadores
de onion skining:
Efectue um clique no boto Modify Onion Markers;
Deparamo-nos com um menu de contexto e vrias operaes:

Always Show Marke quando seleccionada, permite visualizar os marcadores mesmo quando o
onion Skin est desactivado;
An i m a o 2D
|

45

Anchor Onion aplica o onion skin a um intervalo fixo de frames, i, e., o Intervalo no se
desloca medida que avanamos para outras seces da Linha do tempo. O intervalo poder
ainda ser rendimensionado arrastando cada um dos marcadores para uma nova posio, i., e
para um novo frame;
Onion 2 aplica o onion skin os dois frames esquerda e direita do frame actual, i. e., da
cabea de leitura;
Onion 5 aplica o onion skin aos cinco frames esquerda e direita do frame actual;
Onion All inclui o onion Skin em todos os frames esquerda e direita do frame actual.
Para editarmos mltiplos frames (e no s o frame actual) pertencentes ao intervalo definido
pelos marcadores de onion skinnig:
Efectue um clique no boto Edit Multiple Frames;
Efectue um clique no boto Modify Onion Markers e escolha a opo Onion All; podemos assim
seleccionar, redimensionar, mover ou rodar todos os frames simultaneamente.

5.6.

Smbolos

Um SMBOLO criado uma nica vez e vai sendo utilizado ao longo do documento (ou noutros
documentos, i. e., noutros filmes), sem que isto contribua de forma significativa para o
aumento do filme, j que armazenado na bilioteca e o download do smbolo ocorre uma
nica vez, podendo haver vrias INSTANCIAS a ele referenciadas.
Apenas os smbolos efectivamente utilizados no documento sero includos na biblioteca do
filme publicado.
Qualquer objecto criado no palco ou importado para o documento pode ser convertido em
smbolo.
Para um melhor performance, dever sempre pensar em converter os objectos em smbolos.
5.6.1.

Tipos de smbolos

No Macromedia Flash existem trs tipos de smbolos; GRAPHICS, BOTES e CLIPS DE FILME.
Cada um deles tem uma Linha do tempo e um palco especficos. Tm assim diferentes
An i m a o 2D
|

46

particularidades, mas basicamente o que os distingue a forma como interagem com a Linha
do tempo do filme principal:
GRAPHICS (imagens) imagens geralmente estticas que iro ser reutilizadas ao longo do
filme. Estes smbolos operam em sincronia com a Linha do tempo do filme principal a que
pertencem e o seu ambiente de edio especfico semelhante ao do filme principal; A nica
diferena efectiva entre a Linha do tempo do filme principal e a linha do tempo especfica
destes smbolos diz respeito a esta ltima no suportar os sons interactividade. Apesar desta
limitao, possvel efectuar animaes na Linha do tempo graphis. O comportamento destas
animaes est, no entanto, condicionado pelo comportamento da Linha do tempo do filme
principal.

Buttons (botes) como o prprio


e., que reagem aos cliques

nome indica,

refere-se a

objectos interactivos, i

do rato; os botes tm a sua prpria linha do tempo com

quatro frames a representar os quatro estados possveis : Up (sobre), Down (pressionado),


Hit (rea til de clique). Um boto poder assim desencadear um conjunto vasto de
aces consoante a interactiva aplicada e est representado na linha do tempo do filme
principal. Para poder interagir com os botes no ambiente de edio, invoque o comando
Enable Simple buttons do menu Control.
MOVIE CLIP

(clips

independente da

de filme) a linha do tempo dos clips


Timeline

de filme

totalmente

do filme princpal fazendo com que estes sejam os mais

interactivos e versteis elementos do Flash; so como minifilmes independentes que podem


conter sons, animaes, botes ou outros clips de filme. Uma das utilizaes mais eficazes
consiste em colocar uma instncia destes clips de filme dentro da Linha do tempo dos botes
e assim criar botes animados.
An i m a o 2D
|

47

No se enervem se a interactividade e a animao dos clips de filme no funcionar no


momento da reproduo do filme principal. mesmo assim! Para as visualizar, necessitamos
de invocar o comando Test Scene, ambos do menu Control.
5.6.2.

Criao genrica de smbolos

A criao pode ser de dois tipos convertendo um objecto previamente seleccionado no palco
ou criado um smbolo a partir da caixa de dilogo Create New Symbol,

gerando

posteriormente o contedo no ambiente de edio do prprio smbolo.


Para os do primeiro tipo:
Seleccione o objecto no palco;
Invoque o comando Convert to Symbol do menu Modify; deparamo-nos com a caixa de dilogo
Convert to Symbol;

Name - nome do smbolo;

Behavior - tipo de smbolo;

Registration posio do ponto de registo;

Advanced - alterar entre opes bsicas ou avanadas.

O objecto transforma-se num smbolo, sendo adicionado biblioteca do filme.


Para os do seguinte tipo:
Certifique-se que no existem objectos seleccionados no palco;
Invoque o comando New Symbol do menu. Uma outra forma seria atravs da janela Library
(explicada mais adiante); deparamo-nos com a caixa de dilogo Create New Symbol,

An i m a o 2D
|

48

semelhante caixa Convert to Symbol; Depois de preenchida a caixa de dilogo anterior,


passamos para o ambiente de edio do smbolo, onde identificamos o seu nome no canto
superior esquerdo do palco e o respectivo ponto de registo; Depois de ter criado/importado
os objectos, invoque o comando Edit Document do menu Edit para sair do modo de edio dos
smbolos (ou efectuar um clique sobre o nome da cena)e voltar ao ambiente de edio do
filme.
Muitas vezes, quando entramos neste modo de edio, no conseguimos visualizar o ponto de
registo, porque este esta fora de rea de visualizao. Para o chamar razo invocamos
View -> Magnification -> Show Frame.

5.6.3.

Graphics

Na criao de imagens no existem diferentes substanciais ao nvel do ambiente de edio


destas em relao ao filme de edio. Palco Linha do tempo, barra de ferramentas, camadas
e animao coincidem na aparncia e na dinmica de trabalho.
5.6.4.

Botes

A nica diferena efectiva entre a linha do tempo destes botes reage s interaces
provocadas pelo utilizador atravs do rato.
Para CRIAR BOTES:
Depois de certificar-se que no existem elementos seleccionados no palco, invoque o
comando New Symbol do menu Insert. Na caixa de dilogo Creat New Symbol escolha a opo
Button

para o comportamento do smbolo e indique um nome. Neste passo, o Flash

proporciona o ambiente de edio especfico dos botes;


Na linha do tempo temos agora quatro Frames consecutivos, referentes aos quatro estados do
boto: Up (normal), Over (sobre) Down (pressionando), Hit (rea). No estado Up deparamonos com um frame chave em branco;
Na criao do boto no estado Up possvel utilizar ferramentas de desenho disposio do
Flash, importar imagens ou colocar determinada instncia de um smbolo no palco;
An i m a o 2D
|

49

Para a criao de botes, possvel a utilizao de smbolos do tipo clip de filme ou imagens,
mas no de um outro boto. Os botes animados so criados com recurso aos clips de filme.
Efectue um clique no frame Over e invoque o comando Keyframe atravs Insert -> Timeline; a
imagem do frame anterior repetida para um novo instante temporal;
Segue-se a respectiva edio neste estado; repita o passo anterior e a respectiva alterao da
imagem para os estados Down e Hit;
O frame Hit define a rea do clique que activa o boto, i, ., rea til de clique. Devera ser
uma rea slida suficiente para contemplar todos os elementos afectos aos restantes estados,
no existindo problema caso ultrapasse estes limites. Caso no seja especificado este filme, a
rea do estado normal (Up) ser utilizada, por valor assumido, como rea til de clique.
Para terminar, ivocamos o comando Edit Document do menu Edit e arrastamos uma instncia
do novo smbolo para o palco.
O comando Enable Simple Buttons do menu Control activa/desactiva os botes no ambiente
de edio.
Um boto tem que ser suficientemente atractivo e explcito acerca da aco que desencadeia
porque afinal de contas o ponto de interactividade com o utilizador. Os botes animados
so uma forma de valorizar os filmes e trair a ateno. Outros aspectos relacionados passam
por adicionar sons e texto, valorizando assim a interactividade.
5.6.5.

Clips de filme

Estes smbolos so pequenas animaes que funcionam como minifilmes, j que contm toda
a interactividade, som funcionalidade do filme principal. A linha do tempo dos clips de filme
independente da linha do tempo do filme principal. possvel transformar determinada
animao j criada no palco num clip de filme.
A animao dos clips torna-se independente da Linha do tempo do filme principal, pelo que
pode ser utilizada ao longo do nosso filme, sendo arrastadas instncias da biblioteca para o
palco.

An i m a o 2D
|

50

5.6.6.

Edio de smbolos

Quando se fala em edio de smbolos, esta pode ocorrer ao nvel do contedo e a Linha do
tempo a ele associada.
No se esquea que, ao editar determinado smbolo, est a efectuar todas as instncias que
dele derivam.
Para invocar os diferentes ambientes de edio, basta efectuar um clique com o boto direito
do rato sobre o smbolo e do menu de contexto escolher um dos seguintes comandos:
Edit aqui visualizamos apenas o smbolo; repare que no topo do palco tem informao
acerca do nome do smbolo e da cena em que est inserido; para voltar ao ambiente do filme
principal, pode efectuar uma destas trs aces:
invocar o comando Edit Document do menu Edit;
ou
efectuar um clique no nome da cena.
Edit In Place - aqui estamos a editar o smbolo no respectivo contexto/local;
decerto reparou que os outros objectos no palco ficaram em 2 plano para que fosse possvel
diferenci-los do smbolo a editar; para voltar ao ambiente do filme principal, pode efectuar
uma destas trs aces:
invocar o comando Edit Document do menu Edit;
efectuar um clique um clique no boto de retorno;
efectuar um clique no nome da cena.
Edit In New Window aqui podemos editar o smbolo numa janela separada e visualizar o
palco e a Linha do tempo associados ao smbolo, bem como estes itens associados ao filme
principal; para voltar ao ambiente no filme principal feche a janela no boto fechar do canto
superior direito.
5.6.7.

An i m a o 2D
|

Duplicao de smbolos

51

Caso se queira poupar tempo na criao de smbolos semelhantes, mas que tenham por
exemplo comportamentos diferentes, umas hipteses a duplicao, onde todo o contedo
ou apenas uma parte de determinado smbolo utilizada.
Seleccione o smbolo na bilbioteca (invoque a bilbioteca a partir do comando Library do
menu Window);
Efectue um clique com o boto direito do rato e do menu de contexto escolha Dupicate;
Preencha o nome do novo smbolo na caixa de dilogo Duplicate Symbol e escolha o
respectivo comportamento, repare no novo elemento na biblioteca.
Esta duplicao tambm pode ser efectuada partindo de uma instncia do smbolo:
Seleccione no palco uma instncia do smbolo a duplicar;
Efectue um clique com o boto direito do rato e do menu de contexto escolha Duplicate
Symbol;
Preencha o nome do novo smbolo na caixa de dilogo Duplicate Symbol; Repare no novo
elemento biblioteca.
A instncia seleccionada no primeiro ponto foi entretanto substituda por uma instncia do
novo smbolo.

5.7.

Biblioteca (libraries)

Uma BIBLIOTECA funciona como um repositrio dos elementos (itens) que constituem o nosso
filme. Smbolos, sons, vdeos e bimaps so alguns daqueles elementos cujas instncias
(explicado mais adiante) sero colocados em diversas partes do filme.
Na biblioteca vamos poder organizar, segundo uma lgica personalizada, os diversos itens em
pastas (folders), semelhante ao processo desenvolvido no nosso sistema operativo em relao
aos diferentes tipos de ficheiros.
5.7.1.

Painel Library

Para invocarmos a biblioteca do filme principal, invocarmos o comando Library do menu


Window :

An i m a o 2D
|

52

nome da biblioteca;

nmero de itens que constituem a biblioteca, incluindo as pastas;

rea reservada visualizao do item; Ao premir o boto direito do rato na rea


reservada visualizao do item, poder escolher, a partir do menu de contexto, o
tipo de fundo a aplicar.

botes de play para visualizao de smbolos no estticos ou com interactividade;

colunas com informaes sobre algumas caractersticas dos itens (explicadas mais
adiante);

ordenar os itens;

expandir o tamanho da janela;

reduzir o tamanho da janela;

criar um novo smbolo; acedemos caixa de dilogo Create New Simbol;

criar uma nova pasta;

propriedades do item;

apagar itens da biblioteca (inclusive pastas); basta arrast-los para cima deste cone;
Ao contrrio das verses anteriores do Flash, o comando Undo (desfazer aco)
permite recuperar itens eliminados. Noentanto, estude muito bem a situao antes de
tomar m,edidas concretas.

menu Options (explicado mais adiante ).


5.7.2.

Redimensionar a janela

Atravs dos botes de reduo e expanso do tamanho da janela, podemos ajustar o detalhe
da informao fornecido.
As dimenses das colunas Name (nome), Kind (tipo). Use Count (nmero de instncias
associadas), Linkage (associado a uma biblioteca partilhada) e Date Modified (data de
An i m a o 2D
|

53

modificao) podero ser modificadas posicionando o cursor na divisria desses campos,


arrastando-a posteriormente para a esquerda ou para a direita.
Por valor assumido, a coluna Use Count no actualizada automaticamente.
Para este efeito, teremos de seleccionar o comando Keep Use Counts Updated do menu
Options.
5.7.3.

Ordenar itens

Para ordenarmos os itens atravs das propriedades associadas, basta efectuar um clique sobre
a coluna com o nome da propriedade. O boto de ordenar os itens permite organiz-los de
forma alfanumrica.

5.7.4.

Menu Options

No menu Options da janela Library, temos as seguintes opes:

New Symbol criar um novo smbolo. Tem o mesmo efeito que efectuar um clique no boto
New Symbol; depois de escolhido o nome e o tipo de comportamento associado, vamos
directamente para o ambiente de edio especfico, com os respectivos palcos e Linhas do
tempo;

An i m a o 2D
|

54

New Folder criar uma nova pasta na raiz da estrutura da biblioteca; esta nova pasta poder
estar residente dentro de outra pasta, bastando para isso arrast-lo e larg-la em cima da
pasta com nvel superior;
New Font criar determinado smbolo de texto para partilhar;
New Vdeo adicionar vdeo ao filme. Ao criar este item na biblioteca, efectua sobre ele um
duplo clique; a partir do boto Import da caixa de dilogo Embedded Video Propeties
importante um determinado vdeo:

Rename renomear itens;


Move to New Folder mover determinado item para uma nova pasta; o nome desta pasta
definido atravs da caixa de New Folder;
Duplicate duplicar um determinado smbolo; definir um nome e um comportamento para o
novo smbolo;
Delete apagar determinado item; o mesmo efeito que efectuar um clique no boto Delete;
deparamo-nos com uma caixa de dilogo para confirmar este acto. possvel seleccionar
mltiplos itens e sobre eles aplicar este comando;
O comando Undo (desfazer aco) no tem efeito o comando Delete, por isso necessrio
estudar muito bem a situao antes de tomar medidas concretas.
Edit e Edit With editar determinado item dentro ou fora do Flash; neste segundo caso
escolher o editor externo a partir da caixa de dilogo Select External Editor;
Properties aceder s propriedades de determinados itens; no caso dos smbolos, acedemos
caixa de dilogo Symbol Properties, onde para alm do nome podemos modificar o
comportamento associado
An i m a o 2D
|

determinado smbolo;
55

Linkage -

definir

propriedades associados

aos

smbolos partilhados (explicado mais

adiante);
Component

Definition

- definir determinados

parmetros

para

os componentes

(explicados no mbito dos componentes);


Select Unused Items seleccionar itens que no foram utilizados no filme;
Os objectos no utilizados no nosso filme, apesar de constarem na biblioteca, no vo
aumentar o tamanho do filme publicado. No entanto, estes itens itens devero ser apagados,
j que pesam no documento (fla). Se pretender retir-los definitivamente (e assim j no
poder invocar o comando Undo) pode utilizar o comando Save and Compact do menu File.
Update actualizar itens importados; deparamo-nos com a caixa de dilogo Update Library
Items;
Bitmaps, sons e vdeos tm caractersticas diferentes dos smbolos. Atravs do boto Update
da caixa de dilogo Update Library Items fazemos reflectir sobre o elemento incorporado no
nosso filme qualquer alterao ocorridao sobre ele no exterior.
Play executar determinado item (por exemplo: boto, som);
Expand Folder - expandir determinada pasta;
Collapse Folder fechar determinada pasta,
Expandir All Folders expandir todas as pastas;
Shared Library Properties especificar um URL para uma biblioteca partilhada;
Keep Use Counts Updated manter actualizada a coluna Use Count;
Update Use Counts Now actualizar instantaneamente a coluna Use Count;
Help ajuda sobre bibliotecas;
Maximize Panel expandir painel;
Close Panel fechar painel.
5.7.5.

Bibliotecas comuns common libraries)

Para alm da biblioteca standard do filme principal, o Macromedia Flash incorpora algumas
bibliotecas com itens j incorporados e acessveis atravs do comando Common Libraries do
menu Window -> Other Panels:

An i m a o 2D
|

56

Estas bibliotecas mais no so do que documentos do Flash armazenados na pasta Libraries,


subpasta da pasta de instalao do programa. Assim, qualquer ficheiro que esteja inserido na
pasta Libraries encontra-se imediatamente disponvel no Flash.
Para CRIAR UMA BIBLIOTECA:

Crie um novo documento;

Crie os smbolos que se querem armazenar na biblioteca ou importe-os;

Agora que esto armazenados, apague-os do palco para poupar no tamanho do


documento;

Invoque o comando Save As do menu; File; na caixa de dilogo Save As indique um


nome para a biblioteca e guarde-a na pasta Libraries do Flash;

Verifique se esta biblioteca se encontra disponvel a partir de Window -> Others Panels
-> Common Libraries.

Para visualizar, poder ter a necessidade de fechar o Macromedia Flash e iniciar uma
nova sesso.

An i m a o 2D
|

57

5.7.6.

Biblioteca de outros filmes

Podemos incorporar no nosso filme smbolos de outras bibliotecas afectas a outros filmes.
Para este efeito, invocamos o comando Open External Library do menu File -> Import.
Agora podemos efectuar duas operaes; arrastar para o palco smbolos da biblioteca
externa e estes sero adicionados automaticamente biblioteca standard ou arrast-lo
(s)directamente para esta.
5.7.7.

Bibliotecas partilhadas (shared libraries)

Para optimizar o trabalho em equipa e a gesto dos elementos dos filmes, bem como para
controlar as diferentes revises do projecto, possvel criar bibliotecas partilhadas, i, .,
com determinados itens partilhados, aos quais diferentes filmes podero recorrer. Vantagens
so pelo menos: consist~encia dos elementos e garantia de verses actualizadas.
Assim, elementos que fazem parte de animaes comuns em diferentes cenas ou filmes e
ainda sons ou tipos de fontes de texto iguais em diferentes seces do site (s para citar
alguns exemplos), tudo isto poder ser gerido atravs da partilha de bibliotecas.
Para que outros filmes possam aceder aos itens partilhados, necessrio colocar na web a
biblioteca partilhada.Ora, isto acontece quando publicamos o filme que suporta essa
biblioteca. A biblioteca partilhada ser assim o ficheiro .swf colocado num determinado
URL.
Basicamente, o processo divide-se em duas fases:

No documento que serve de origem/fonte teremos que dar permisses de


exportao para itens a partilhar;

No documento que vai ligar origem (documento de destino) teremos que dar
indicaes de importao dos itens partilhados.

Tanto no ficheiro de origem como nos ficheiros de destino necessrio indicar a localizao
(URL) do ficheiro de origem (o que contm a biblioteca partilhada) e a identificao do
elemento partilhado.

An i m a o 2D
|

58

So ento colocados dois cenrios possveis:

Durante a edio de um filme so utilizados smbolos que residem numa biblioteca


partilhada;

Durante a execuo de um filme efectuado o download, por parte do Flash Player,


de smbolos que residem numa biblioteca partilhada.

5.7.8.

Smbolos de outros Filmes

A incorporao de smbolos de outros filmes est assegurada atravs de compatibilidade entre


bibliotecas. Apesar desta compatibilidade, no existe nenhuma ligao (link) entre smbolos
de diferentes filmes, i. e., a edio em cada um dos filmes independente. O processo
simples:

Invoque o comando Open External Library do menu File Import para escolher o filme
onde iremos buscar o(s) smbolo(s);

Os Smbolos da biblioteca do filme seleccionado ficam disponveis, apesar da


indisponibilidade dos comandos do menu Options;

Arraste para o palco o smbolo desejado, criando assim uma instncia; neste passo, o
novo smbolo adicionado biblioteca do nosso filme principal, mantendo o nome de
origem; para finalizar fechamos a janela da biblioteca.

5.8. Instncias
A cada uma das ocorrncias do smbolo no palco d-se o nome de INSTNCIA.
Estas instncias aparecem-nos apenas como referncias ao smbolo. A mais-valia

desta

abordagem reside no facto de no ser obrigatria que estas instncias apresentem as mesmas
propriedades que o smbolo ou entre elas prprias.
Assim ao editar uma istncia, no afectado o smbolo associado, nem as outras instncias
que dele derivaram. No entanto, as alteraes efectuadas num determinado smbolo
reflectem-se em todas as instncias dele derivadas.

An i m a o 2D
|

59

5.8.1.

Criao de instncias

As instncias podem assumir comportamentos diferentes daquele que est estipulado para o
smbolo de onde derivam.
ponto assente que, quando criamos determinado smbolo e definimos para ele um
comportamento

especfico,

as

instncias

que

dele

derivam

vo

herdar

aquele

comportamento. No entanto, esta instncia poder assumir outros comportamentos


diferentes, i, e., possvel modificar um boto para imagem ou um clip de filme para um
boto e at uma imagem para um clip de filme. Logo que tal modificao ocorra, a instncia
perde a funcionalidade advinda do comportamento do smbolo. A criao das instncias
muito simples:
Seleccione na Linha do tempo uma determinada camada:

As instncias so colocadas sempre em frames chave; caso no esteja seleccionado um


frame chave, a instncia ser colocada no primeiro frame mestre esquerda do
frame actual.

Invoque o comando Library do meu Window para visualizar a biblioteca com os


smbolos;

Arraste o smbolo para o palco.


5.8.2.

Propriedades das instncias

Atravs de diferentes valores associados propriedade das instncias, como por exemplo o
brilho, a transparncia e a tonalidade, possvel obter variantes a partir de um mesmo
smbolo.
Para efectivar as alteraes, no existe nenhum boto de OK s alterar e verificar no palco
a modificao.
Rodar, inclinar ou redimensionar uma instncia, bem como alterar o seu comportamento, so
outras das opes.
Atravs do menu Modify Transform Remove Transform, possvel desfazer as alteraes
efectuadas ao nvel do redimensionamento e das rotaes.
An i m a o 2D
|

60

As propriedades das instncias so alteradas atravs do inspector de propriedades nas quatro


reas que compem:

Symbol behavior - nesta rea est definido o comportamento do smbolo de onde


deriva a instncia e o nome dessa instncia que funcionar como uma referncia
(target) e poder ser invocado na definio de determinadas aces;

Widht, Height - nesta rea est definida a largura (W) e altura da instncia (H), bem
como a sua posio horizontal (X) e vertical (Y):

No painel Info (Window Design Panels Info) possvel observar estas


propriedades.

Options of graphics - nesta rea visualizamos qual o nome do smbolo associado


instncia; para alm desta informao, temos nesta rea mais opes:
o

o boto Swap Symbols permite substituir o smbolo associado a uma instncia;


ao efectuar um clique sobre este boto, acedemos caixa de dilogo Swap
Symbol;

An i m a o 2D
|

61

direita do boto Swap, e consoante o tipo de smbolo associado instncia,


surgem-nos algumas caractersticas que

nos ajudam a aperfeioar o

comportamento do objecto;
As opes so: loop, (repetio contnua de toda a sequncia da animao da instncia, pelos
frames que esta ocupa); Play Once (apenas uma repetio da sequncia da animao a partir
do frame especificado); Single Frame (exibio de apenas um

frame da sequncia da

animao); First (define, para os trs modos de produo atrs citados, o primeiro frame da
sequncia de animao).
As opes so: Track as Button e Track as Menu Item e especificam a forma de reaco em
relao aos movimentos e cliques do rato.
Color - nesta rea visualizamos as propriedades de cor associadas instncia:
o

None nenhuma cor;

Brightness - ajustar a luminosidade da instncia, numa escala que vai do preto


(-100%) ao branco (100%);

Tint

- aplicar sobre a instncia uma determinada tonalidade: definir

percentagem da tonalidade; definir tonalidade atravs da introduo de


valores nas caixas de texto para as tonalidades vermelho (Red),verde (Green) e
azul (Blue);
o

Alpha definir, a partir da caixa de dilogo Advanced

Effect - os valores de vermelho, azul, verde e da transparncia; as caixas de


texto esquerda com as respectivas barras de controlo permitem reduzir uma
determinada percentagem dos valores de cores e/ou da transparncia; as
caixas de texto direita com as respectivas barras de controlo permitem
reduzir ou aumentar os valores das cores e ou da transparncia por um valor
constante

5.8.3.

An i m a o 2D
|

Quebra de ligao das instncias

62

Caso deseje quebrar o elo de ligao entre a instncia e o respectivo smbolo a ela associado,
de forma a alterar de raiz a sua composio(agora um conjunto de formas e linhas
desagrupadas) e sem que isto afecte o smbolo ou outras instncias relacionadas:

seleccione a instncia no palco;

invoque o comando Break Apart do menu Modify.

Caso o smbolo atravs do qual derivou a instncia seja alterado aps a quebra de ligao
entre ambos, tal facto no se repercute na instncia em questo.

5.9.

Um painel com histria

Surgiu nesta verso do Flash uma novidade que de certeza vai agradar a muitos utilizadores: o
painel History (Window -> Other Panels -> History). Os passos executados durante a edio do
filme ficam gravados (so convertidos em javaScript) e disposio do autor para os utilizar
no mesmo documento, noutros documentos da mesma sesso ou mesmo para serem invocados
posteriormente, atravs de comandos.
O painel constitudo por:

lista de passos ocorridos no documento actual; os passos precedidos por um X


vermelho indicam a impossibilidade de serem reutilizados;

barra de deslocamento que nos indica o ltimo passo registado;

repetir o(s) passo (s) seleccionados;

copiar o(s) passo (s);

gravar passos como comandos para posterior utilizao; depois de dar o nome ao
comando na caixa de dilogo Save As Command, este fica disponvel partir do menu
Commands;

repetir o(s) passo (s) seleccionados;

copiar o(s) passo (s);

An i m a o 2D
|

63

gravar passos como comandos para posterior utilizao;

formas de visualizao dos passos no painel;

limpar o histrico de passos no painel; esta operao no tem repercusses.

A ordem dos passos no painel no pode ser alterado. Por valor assumido, so cerca de100
passos que podem ser alvo de operaes no painel History. Este valor pode variar entre 2 e
9999 e configurado no painel Preferences (Edif -> Preferences) atravs do separador
General.
Para DESFAZER PASSOS com o painel History, basta deslocar o elevador at ao passo
pretendido.
A REPETIO DE PASSOS no mesmo documento efectuado com o comando Replay. Para
efectuar a operao, seleccione o ttulo do passo e arraste o rato at ao ltimo passo
pretendido, sem utilizar a barra de deslocamento. Por ltimo, clique no boto Replay.
Para seleccionar passos no adjacentes pode ser utilizada a tecla <Ctrl>.
Para COPIAR PASSOS ENTRE DOCUMENTOS processa-se da seguinte forma:

No documento que contm os passos a copiar, seleccionamos esse (s) passo (s) no
painel;

Clicamos no boto para copiar os passos;

Seleccionamos um objecto nom documento onde vo recair os passos;

Invocamos o comando Paste do menu Edit; repare que no painel History

ficou

registado apenas o passo Paste Steps.


Para EXECUTAR COMANDOS

Java Script

ou Flash JavaScript

invocamos o comando Run

Command do menu Cmmands para procurar e abrir o ficheiro. Ainda neste menu temos a
opo Manage Saved commands para apagar ou renomear comandos e a opo Get More
commands

que

permite

obter,

via

Internet

(www.

Macromedia.

Com/cfusion/exchange/index.cfm), outros comandos que outros autores colocaram


disposio.

An i m a o 2D
|

64

6. Desenho de Objectos

6.1.

Cor e transparncia

O Fash utiliza dois mtodos de descrio da cor: HSB e RGB.


O

MTODO

HSB

em

que

Hue

(tonalidade),

Saturation

(saturao)

Brightness

(brilho/luminosidade) descrevem as cores como um espectro contnuo. Os valoresda


TONALIDADE podem variar de O a 360 (nmero mximo de grus num crculo) e designam a
cor , definindo assim o grau de pureza do tom. A luminosidade da tonalidade definida
atravs do BRILHO e varia de O% a 100%.
tambm possvel classificar determinada cor com o MTODO RGB. Estas trs componentes
definem a qualidade de vermelho (Red), verde (Green) e azul (Blue) associada ao objecto,
utilizando valores do sistema decimal que variam de 0 a 255. Assim, se para cada componente
o valor de 255, obtemos a cor branca; se por outro lado o valor for 0, obtemos o preto.

Logo se as componentes vermelho e azul tiverem o valor 0 e a componente verde o valor 255,
obtemos o verde j agora... e a cor laranja? Pois bem, na escala RGB os valores so 255-1770.
Os valores RGB podem ainda ser convertidos em NMEROS HEXADECIMAIS (muito utilizado nas
pginas web). Consiste num valor de seis elementos que variam entre 00 e FF.
Eis alguns exemplos de valores hexadecimais e respectivas cores:
FF0000 vermelho;
00FF00 verde;
0000FF azul;
FFFFFF branco;
000000- preto
Ao nmero de cores para representar determinado objecto d-se o nome de PROFUNDIDADE
DE COR (color depth). A profundidade de cores expressa como o nmero de bits usados

An i m a o 2D
|

65

(valor binrio) para representar a informao (cor) ou para identificar o nmero de cores que
o sistema suporta num determinado instante.
Imagine a seguinte animao: noite e determinado farol incide o seu foco de luz sobre
edifcios de uma cidade, gerando um movimento rotativo. Apenas os edifcios sobre os quais
incide a luz devero estar visveis, ficando os restantes visveis. Para podermos controlar a
visibilidade/transparncia de objectos, utilizamos a propriedade ALPHA. O valor da
transferncia pode variar de 0% (totalmente transparente) a 100% (totalmente opaco).
Outras abordagens questo da transparncia/visibilidade podero ser feitas atravs da
manipulao da ordem das camadas e do preenchimento, ou no, dos objectos.

6.1.1.

Painel Color Mixer

No Flash, bem como noutros tipos de programas mais ligados parte de edio de imagens,
surgem mais vezes referidos os termos STROKE e FILLS. Em relao ao stroke, podemos pensar
nele como o trao ou o contorno do que criado e que, por sua vez, ir ou no ter um
preenchimento (fill) com uma cor slida ou com determinado gradiente ou mistura de cores.
Assim, as ferramentas para criao de formas ovais ou rectangulares podem, no Macromedia
Flash, criar apenas traos, apenas reas preenchidas ou ambas as coisas.
O termo SHAPE (forma) designa grficos vectoriais que, ao invs de serem formados por um
conjunto de pixels, contm determinadas informaes sobre, por exemplo, a localizao,
dimenso e a cor da imagem.

Para criar e editar cores slidas, utilizamos o painel Color Mixer do menu Window. Qualquer
escolha aqui definida automaticamente aplicada ao objecto seleccionado no palco.

An i m a o 2D
|

66

2
4, 5 e 6

1. cor do trao; efectue um clique no tringulo para escolher uma determinada cor;
2. cor do preenchimento; efectue um clique no tringulo para escolher uma determinada
cor ou gradiente;
3. tipo de preenchimento;
Existem vrios tipos de preenchimento: a opo None no aplica nenhum preenchimento; a
opo Solid aplica ao objecto preenchimento com uma cor slida; a opo Radial utiliza duas
cores, ficando uma no centro, ocorrendo uma transio suave para a cor que est posicionada
na periferia do objecto; a opo Bitmap permite aplicar um bitmap ao objecto; estes bitmaps
podem ser importados atravs da caixa

de dilogo Import, ficando disponveis no painel

Color Mixer.
4. cor por valor assumido (trao preto e preenchimento branco);
5. definir trao ou preenchimento transparente;
6. trocar cores do trao e do preenchimento;
7. barra de cores;
8. definir escala RGB ou escala HSB;
9. valores RGB ou HSB;
10. transparncia da cor;
11. expandir painel.

Para criar CORES PERSONALIZADAS:

Efectue um clique no tringulo do trao ou preenchimento;

Carregue no boto Color Picker; depara-se com a caixa de dilogo Color;

An i m a o 2D
|

67

Arraste o cursor pelo espectro de cores de forma a seleccionar a cor slida ou insira
valores nas caixas de texto;

Controle o nvel de luminosidade;

Carregue no boto Adicionar s cores personalizadas de forma a adicionar esta nova


cor a uma das 16 caixas personalizao; a partir de agora poder utilizar esta cor
para o trao ou preenchimento.

6.1.2.

Gradientes

OS GRADIENTES resultam da transio mesclada de duas ou mais cores. Podem ser utilizados
para criar determinados efeitos visuais, como por exemplo profundidades e sombras.
No abusem dos gradientes, j que estas pesam na performance dos filmes. Por exemplo,
cada rea ocupada por um gradiente necessita de mais 50 bytes em relao a uma cor slida.

Basicamente existem dois tipos de gradientes:

An i m a o 2D
|

68

GRADIENTE LINEAR mescla de cores, de uma ponta outra do objecto;

GRADIENTE RADIAL mescla de cores, do centro para a periferia do objecto.

Para CRIAR GRADIENTES:

Escolha no preenchimento o tipo de gradiente (Linear ou Radial).

Efectue um clique logo a baixo da barra de cor para criar um ponto de Gradiente;
este ponto assume por valor assumido uma determinada cor, mas esta poder ser
alterada;

Atravs do selector de cor, escolha uma outra cor para o ponto; ocorrer uma
transio entre o ponto criado e o ponto logo esquerda;

Introduza se necessrio mais pontos de gradiente;

Desloque os pontos para modificar a distribuio das cores;

No menu do painel Color Mixer escolha o comando Add Swatch de forma a adicionar o
gradiente.
6.1.3.

Paletas

Cada um dos documentos do Flash tem associada uma paleta de cores prpria.
Apesar de a informao estar contida no ficheiro de suporte do filme, no afecta o respectivo
tamanho. A paleta padro do Flash a paleta de 216 cores ajustadas web (Web 216).
O nmero de cores que podemos definir para um determinado filme limitado
Apenas pela profundidade de cor do sistema.

Existem dois formados de importao/exportao de paletas suportados pelo


Flash:

.clr para Windowsl.fclr para Macintosh: importao/expotao das cores slidas e


dos gradientes, mas apenas entre ficheiros do Macromedia Flash;

.act um formato que apenas importa/exporta as cores slidas, no suportando os


gradientes; apesar desta limitao, este formato suportado por outros programas,
como o Fireworks e o Adobe Photoshop.

An i m a o 2D
|

69

Ao importar imagens do formato. GIF, pode importar as paletas associadas, mas no os


ingredientes.
Para exportar, importar e modificar a paleta de cores de um filme do Flash,Utilizamos o
painel Color Swatches.

6.2.

Personalizao das ferramentas de desenho

Invocamos o comando Preferences, do menu Edit, deparamo-nos com a caixa de dilogo


Preferences e

com o separador Editing, com diversas opes que permitem automatizar

alguns aspectos relacionados com as ferramentas de desenho.

6.3. Ferramentas de desenho e pintura


A barra de ferramentas de desenho e pintura (Window -> Tools ) encontra-se

dividida

em quatro reas:
1. Tools zona onde esto as ferramentas que podemos escolher atravs de Cliques;
2. View zona com ferramentas que nos permitem modificar a rea visvel do ambiente
de edio;
3. Colors rea onde escolhemos quais as cores a aplicar aos traos e preenchimentos;
4. Options- rea de acesso a modificadores especficos de ferramenta activa,que
permitem vrias opes de desenho.

An i m a o 2D
|

70

No que diz respeito s ferramentas que nos permitem modificar a rea visvel do ambiente
de edio (zona 2 da barra de ferramentas), temos:

HAND (mo) esta ferramenta permite que o utilizador se movimente facilmente pela
rea de trabalho, bastando para tal manter premido o boto do rato, arrastando o palco em
qualquer direco mais conveniente. Esta ferramenta s est plenamente funcional quando o
comando Work Area do menu View est activo.
Para activar esta ferramenta, podemos pressionar a tecla <H> Tambm podemos alternar esta
ferramenta com qualquer outra que seja activa, mantendo precionada a tecla <Spacebar>.

ZOOM (lupa) esta ferramenta permite aumentar ou reduzir a percentagem de


visualizao do palco.

ARROW (seta)- esta provavelmente a ferramenta mais utilizada no Flash; com ela
podemos seleccionar, mover, e redimensionar objectos.

An i m a o 2D
|

71

Modificadores da ferramenta ARROW:

Snap to Objects permite alinhar os objectos editados, entre si ou em relao ao


palco; ao mover determinado objecto para alinhar, temos como referncia um anel de
encaixe; para indicar que dois pontos podem ser alinhados com preciso, o anel surge mais
denso;
Com o comando Snap Align do menu View -> Snapping activo, surgem eixos de alinhamento
durante o alinhamento dos objectos. Ainda neste menu e atravs do comando Edit Snap Align,
possvel definir (em pixels) a tolerncia da distncia de alinhamento dos objectos.
Smooth- reduz irregularidade e o nmero de segmentos numa curva, dando uma noo
de continuidade a linhas e formas simples;
Invocando o comando Optimize do menu Modify -> Shape, deparamo-nos com a caixa de
dilogo Optimize Curves, onde podero ser definidas suavizaes para as linhas curvas e para
os contornos associados aos preenchimentos. A opo Use multiple passes (slower) maximiza o
processo de suavizao; a opo Show totals message permite exibir uma caixa de alerta com
a informao acerca da optimizao relacionada com o processo de suavizao.
Este processo de suavizao contribui ainda para a diminuio do tamanho do documento e do
filme .swf.
Straighten permite endireitar crculos, ovais, quadrados, rectngulos, tringulos e arcos
desenhados em formas geometricamente perfeitas;
As opes Smooth e Straighten no actuam partida sobre grupos, texto, smbolo e bitmaps.
Para que tal acontea, necessitamos de aplicar sobre estes elementos o comando Break Apart
do menu Modify.

SUBSELECT (subseleco) - esta ferramenta permite modificar os ngulos, as direces e


os comprimentos associados aos segmentos rectilneos e curvos dos objectos , atravs da
manipulao dos pontos ncora.
Mantendo pressionada a tecla < Shift> enquanto arrastamos, permite restringir

o ngulo

associado a mltiplos de 45.


Para ajustar um segmento rectilneo, seleccionamos esse segmento com a ajuda da
ferramenta Subselect; arrastar um ponte ncora para uma nova posio.
An i m a o 2D
|

72

Para apagar pontos ncora, seleccione-os com a ferramenta Subslect e carregue na tecla
<Delete>.

Line (linha) esta ferramenta permite desenhar linhas ou segmentos. A linha s


efectivamente desenhada no palco quando libertamos o boto do rato. Assim, logo que
escolhemos a ferramenta e at libertamos o rato, pode-mos (re)definir sucessivamente a
direco da linha ou o ngulo associado
Mantendo pressionada a tecla <Shift> enquanto desenhamos a linha, permite restingi-la a uma
direco vertical, horizontal ou com um ngulo de 45.

LASSO (lao)- esta ferramenta permite seleccionar objectos, mo livre ou atravs de


linhas rectas.
Esta ferramenta inclui 3 modificadores:

Magic wand permite seleccionar determinada rea de uma cor particular


independente da sua forma;

Magic wand Properties permite ajustar as definies da opo Magic wand; na caixa
de dilogo Magic wand Settings, podemos definir qual a tolerncia em relao cor de
pontos adjacentes (Threshold), i e., um valor igual a O selecciona apenas pontos
adjacentes com cor exactamente igual, enquanto o valor mximo 100 selecciona todos
os pontos; podemos ainda definir a tolerncia no que diz respeito ao limite da rea
colorida seleccionada Smoothing;

Polygon permite seleccionar determinada rea atravs de linhas rectas.

Para SELECCIONAR REAS MO LIVRE, seleccione a ferramenta Lasso e prima o boto do


rato, arrastando o cursor ao longo da rea.

An i m a o 2D
|

73

Para SELECCIONAR REAS DE LINHAS RECTAS, seleccione a ferramenta Lasso e o modificar


Polygon, efectue um clique para definir o ponto de incio, posicionando depois o cursor ponto
de destino e efectuando a um clique; para fechar a rea, efectue um duplo clique.
Para SELECCIONAR REAS ATRAVS DE LINHAS RECTAS E MO LIVRE, seleccione a
ferramenta Lasso E O MODIFICADOR Polygon; para efectuar um segmento mo livre, arraste
o cursor sobre o palco; para efectuar um segmento recto, mantenha pressionada a tecla <Alt>
e efectue cliques para definir os pontos de incio e de destino; para fechar a rea, efectue
um duplo clique.

PEN (caneta) esta ferramenta permite desenhar linhas rectas ou trajectrias curvilneas
com grande preciso, manipulando os ngulos associados.
Mantendo pressionada a tecla <Shift> enquanto desenhamos a linha, permite restringir o
ngulo associado a mltiplos de 45.
Para DESENHAR CURVAS com esta ferramenta:

Seleccione a ferramenta;

Especifique cores para o trao e o preenchimento atravs do inspector de


propriedades;

Posicione o cursor no stio onde quer iniciar a curva e arraste a cabea de leitura de
forma a definir uma direco; repare nas duas linhas que podem servir para distorcer a
linha e assim criar a curvatura;

Posicione o cursor num outro local e mova o rato, definindo o comprimento e o ngulo
da linha;

Desenhe uma segunda linha e note que o final da linha curva serve agora de de ponto
de partida;

Para dar por concludo o trabalho, dever seleccionar uma nova ferramenta ou invocar
o comando Deselect All do menu Edit.

TEXT (texto) atravs desta ferramenta que digamos texto no palco

OVAL (oval) esta ferramenta permite desenhar objectos ovais. O objecto s


efectivamente desenhado no palco quando libertamos o boto do rato. Assim lobo que

An i m a o 2D
|

74

escolhemos a ferramenta e at libertamos o rato, podemos (re)definir sucessivamente a


forma oval.
Mantendo pressionada a tecla <Shift> enquanto desenhamos o objecto, permite criar formas
com as propores de um crculo perfeito.

RECTANGLE (rectngulo) esta ferramenta permite desenhar objectos rectangulares.


Mantendo pressionada a tecla <Shift> enquanto desenhamos o objecto, permite criar formas
com as propores de um quadrado perfeito.

PENCIL (lpis) esta ferramenta permite desenhar linhas em trs modos de desenho.
Mantendo pressionada a tecla <Shif> enquanto desenhamos as linhas, restringimo-las a uma
posio vertical ou horizontal.

BRUSH (pincel) esta ferramenta permite criar traos que se assemelham a pinceladas.
Mantendo pressionada a tela <Shft> enquanto desenhamos as pinceladas, restringimo-las a
uma direo vertical ou horizontal.

FREE TRANSFORM (transformar) esta ferramenta permite transformar (mover, rodar,


redimensionar, inclinar, desfigurar e distorcer) determinados objectos.
Smbolos, bitmaps, vdeos, sons, gradientes, grupos de objectos e texto no podem ser
distorcidos . Para que o texto possa ser transformado, h primeiro que convert-lo em
formas.
FILL TRANSFORM (transformar) esta ferramenta permite transformar o preenchimento
de um objecto (gradiente ou bitmap), alterando neste o tamanho, a direco ou o centro.

INK BTTLE (tinteiro)- esta ferramenta permite criar e modificar a cor, a espessura e o
estilo dos contornos dos obJectos.
Apenas cores slidas podem ser aplicadas aos contornos e no gradientes ou bitmaps.

An i m a o 2D
|

75

PAINT BUCKET (balde de tinta) esta ferramenta permite colorir reas vazias ou
delimitadas (com cores slidas, gradientes ou bitmaps), podendo tambm alterar a cor j
existente num determinado objecto.
Mantendo pressionado a tecla <shift>, podemos restringir a direco do preenchimento do
gradiente a mltiplos de 45.

EYEDROPPER (seleccionador de cor) esta ferramenta permite retirar amostras de cor


de imagem e ou copiar os atributos relacionados com o contorno e preenchimento dos
objectos.

ERASER (borracha) esta ferramenta permite remover contornos e preenchimentos.

7. TCNICAS DE ANIMAO
7.1. Cenas
A diviso da animao em CENAS vem facilitar a organizao do contedo do filme, j que
podemos dividi-lo de uma forma mais verstil e menos penosa. Imagine que tem um filme
com cerca de 800 frames. um pouco cansativo ter de percorrer tanta frame para modificar
determinado pormenor, no acha? Ento, porque no dividir todo aquele contedo em
pequenas seces, como se de minifilmes interligados se tratassem?
Apesar das vantagens desta abordagem, esta torna-se contraproducente em filmes
interactivos onde abundem variveis e aces de preoading. Nestes casos, prefervel uma
de duas abordagens: manter um nico filme ou criar diversos filmes, garantindo a
interactividade e a interligao atravs de programao (por exemplo, com LoadMovie).
PARA CRIAR UMA CENA:

Invoque o comando Scene do menu Insert ou carregue no boto Add scene do painel
Scene;

An i m a o 2D
|

76

Repare que os nomes por valor assumido so do tipo Scene x, onde o x representa
o nmero da cena criada; ao clicar na cena, passamos automaticamente para o frame
1 da Linha do tempo.

7.2. Animao frames-by-frame


O frame-by-frame um tipo de animao tradicional nos estdios de animao. Consiste na
alterao do contedo em frames consecutivos, gerando assim a iluso da animao e do
movimento. Partindo de um frame, altera-se o contedo (adicionado, removendo ou
reorganizando elementos) no instante temporal seguinte, volta-se a editar o contedo num
outro instante temporal e assim sucessivamente. claro que o contedo s pode ser editado
em frames - chave...
um processo em que o utilizador tem um elevado grau de controlo sobre a animao
(quando comparado com a animao interpolada), mais lento na edio e aumenta
consideravelmente o tamanho do ficheiro. Dever ser utilizado apenas quando estritamente
necessrio em movimento algo complexos, delicados e rpidos. A animao frame-by-frame
pode ocorrer conjugada com os restantes tipos de animao desde que cada um esteja em
camadas diferentes.
Para CRIAR UMA ANIMAO FRAME-BY-FRAME

Seleccione determinado frame na linha do tempo e invoque o comando Keyframe a


partir de Insert Timeline;

Crie no frame mestre um objecto ou importe uma imagem;

Faa do frame seguinte um frame mestre; repare que o contedo do novo frame
mestre igual ao do anterior;

An i m a o 2D
|

77

Altere o contedo deste frame (por exemplo, com as ferramentas de desenho) com o
intuito de incrementar o processo de animao.

Repita os 2 passos anteriores at completar a sequncia da animao;


No se esquea de reproduzir a animao frequentemente para despistar qualquer problema
e verificar o comportamento.
Quando terminada a sequncia, reproduza a animao atravs do comando Play do menu
Control ou carregando directamente no boto Play do Controlador.

7.3. Animao interpolada (tweening)


O termo tweening deriva de frame in between, i.e., frames intermdios. O Flash facilita-nos
a vida no que diz respeito criao de animao que consiste em alteraes de movimento,
de tamanho, de rotao, de forma ou de cor, j que nos basta definir os frames inicial e
final, sendo criados automaticamente pelo Flash os frames intermdios.
um processo em que o utilizador tem um grau de controlo relativo sobre a animao
(quando comparado com a animao frame-by-frame), mais rpido na edio e minimiza o
tamanho do ficheiro, j que armazena apenas os valores associados s alteraes efectuadas
entre os frames. utilizado em movimentos fluidos e suaves, e, transies e em efeitos do
tipo morphing. A animao interpolada pode ocorrer conjugada com os restantes tipos de
animao desde que cada um esteja em camadas diferentes.
7.3.1. Interpolao de formas (shape tweening)
Neste tipo de animao interpolada, um objecto transformado noutro, fruto das alteraes
incrementais automaticamente efectuadas pelo Flash, tendo como referncia os contedos
dos frames inicial e final definidos pelo utilizador.
Instncias de smbolos, bitmaps e grupos no so contemplados por este tipo de animao, a
no ser que sobre eles invoque o comando Break Apart do menu Modify.

O tamanho, a forma, a cor, a transparncia e a localizao dos objectos so os atributos


interpolveis. Como os frames intermdios so criados automaticamente pelo Flash, podemse obter resultados que no so propriamente os mais desejados. Para colmatar este tipo se
An i m a o 2D
|

78

situaes, podemos utilizar REFERENCIAS DE FORMAS, que sustentam uma interpolao mais
personalizada e aperfeioada.
O Flash permite interpolar diversas formas numa mesma camada, mas a experincia
aconselha a cada macaco seu galho, i.e., cada forma na sua camada.
INTERPOLAR UMA FORMA

Seleccione um frame;

Com a ajuda das ferramentas de desenho, crie uma determinada forma;

No Inspector de propriedades escolha na caixa de menu pendente Tween a opo Shape


(interpolao de forma); na barra de controlo Ease, arraste a seta para definir a
atenuao da transio no incio ou no fim da sequncia, i.e., a taxa de alterao entre os
frames interpolados (entre os valores -1 e -100 a interpolao inicia-se gradualmente e
acelera no fim da animao, enquanto que entre os valores 1 e 100 a interpolao se
inicia rapidamente para dar lugar a uma desacelerao no final da animao); o tipo de
mesclagem/mistura, Blend, pode ser distributiva (Distributive), que consiste em tornar as
An i m a o 2D
|

79

formas intermdias mais suaves e mais irregulares, ou do tipo angular (Angular), que se
aplica em formas intermdias onde se queiram preservar os ngulos e as linhas rectas;

Crie um segundo frame mestre que represente o final da animao e aqui seleccione o
objecto; modifique-lhe a forma, cor ou posio ou apague-o e substitua-o por uma
outra forma;

Repare que o Flash criou automaticamente os frames intermdios;


Reproduza a animao atravs do comando Play do menu Control ou carregando
directamente no boto Play do Controlador.
Interpolao de movimento (motion tweening)
Este tipo de animao permite interpolar a rotao, o tamanho, a localizao, a cor, a
transparncia e a inclinao dos objectos. Apenas um objecto por camada pode conter
interpolao de movimento.
Smbolos, grupos e blocos de texto so contemplados por este tipo de animao. Para
interpolar a cor de grupos e de texto, h que convert-los primeiro em smbolos.

An i m a o 2D
|

80

J reparou com certeza em alguns Web sites com transies espectaculares pois bem, foram
realizados utilizando o Flash e este tipo de animao. Isto porque, como veremos explicado
mais adiante, no Flash possvel interpolar movimento ao longo de uma trajectria no
linear.
Existem dois mtodos para criar este tipo de animao: atravs da opo Motion do Inspector
de propriedades ou atravs do comando Create Motion Tween a partir de Insert Timeline.
Utilizando o Inspector de propriedades:

Desenhe num frame mestre vazio um objecto ou arraste para o palco uma instncia de
um smbolo;

Crie um segundo frame mestre que represente o final da animao e seleccione o


frame imediatamente anterior;

Neste frame seleccionado efectue uma destas trs operaes: desloque o objecto para
uma nova posio; altere a dimenso, a rotao ou inclinao do objecto; modifiquelhe a cor;

Efectue um duplo clique no ltimo frame da Linha do tempo;

No Inspector de propriedades escolha na caixa de menu pendente Tween opo


Motion (interpolao de movimento); a validao da opo Scale permite uma
interpolao referente ao tamanho; na barra de controlo Ease, arraste a seta para
definir a atenuao da transio no incio ou no fim da sequncia, i.e., a taxa de
alterao entre os frame interpolados (entre os valores -1 e -100, a interpolao
inicia-se gradualmente e acelera no fim da animao, enquanto que entre os valores 1
e 100 a interpolao se inicia rapidamente, para dar lugar a uma desacelerao no
final da animao); na caixa de menu pendente Rotate, define-se o tipo de rotao do
elemento (a opo None no aplica rotao; a opo Auto corresponde a uma
movimentao mnima; a opo CW para rodar no sentido horrio e CCW para o
sentido anti-horrio) e na caixa de texto o respectivo nmero de ciclos de rotao; a
validao da opo Orient to path permite orientar a linha de base do elemento em
relao trajectria; a validao da opo Sync assegura a sincronizao dos objectos
com a Linha do tempo; a validao da opo Snap encaixa automaticamente o ponto
de registro do elemento trajectria.

Utilizando o comando Create Motion Tween a partir de Insert Timeline:

An i m a o 2D
|

81

Desenhe num frame mestre vazio um objecto ou arraste para o palco uma instncia de um
smbolo;

Invoque o comando Create Motion Tween do a partir de Insert Timeline;

Ao ter invocado o comando sobre um objecto desenhado no palco, tal objecto


converteu-se automaticamente num smbolo com o nome Tween 1 (todos os objectos
criados desta forma recebem o nome genrico Tween x).

Efectue um clique no frame que representa o final da animao; neste frame


seleccionado desloque o objecto para uma nova posio ou ajuste-lhe o tamanho e a
rotao;
Na barra de controlo Ease, arraste a seta para definir a atenuao da transio no
incio ou no fim da sequncia, i.e., a taxa de alterao entre os frames interpolados
(entre os valores -1 e -100, a interpolao inicia-se gradualmente e acelera no fim da
animao, enquanto que entre os valores 1 e 100 a interpolao se inicia rapidamente,
para dar lugar a uma desacelerao no final da animao); na caixa de menu pendente
Rorate, define-se o tipo de rotao do elemento (a opo None no aplica rotao; a
opo Auto corresponde a uma movimentao mnima; a opo CW para rodar no
sentido horrio e CCW para o sentido anti-horrio) e na caixa de texto o respectivo
nmero de ciclos de rotao; a validao da opo Orient to path permite orientar a
linha de base do elemento em relao trajectria; a validao da opo Sync
assegura a sincronizao dos objectos com a linha do tempo; a validao da opo
Snap encaixa automaticamente o ponto de registo do elemento trajectria.
Reproduza a animao atravs do comando Play do menu Control ou carregando
directamente no boto Play do Controlador.

Qualquer movimentao dos objectos nos frames mestres ou qualquer alterao do nmero
de frames ser correspondida por um ajuste automtico da interpolao por parte do Flash.

7.4. Distribuir objectos pelas camadas


Imagine o que seria distribuir manualmente inmeros objectos, indevidamente criados numa
s camada, por vrios layers. Para resolver este processo de uma forma automtica,
recorremos ao comando Distribute to Layers a partir de Modify Timeline. Eis os passos a
executar:

An i m a o 2D
|

82

Seleccione os objectos a distribuir; estes objectos podero estar todos colocados na mesma
camada ou inclusive em camadas no contguas;
Invoque o comando Distribute to Layers; pode em alternativa efectuar um clique com o
boto direito do rato e do menu de contexto escolher o comando Distribute to Layers;
verifique as novas camadas criadas.

7.5.

Guias de movimento

E se fosse possvel definir no Flash uma ou mais camadas cujo contedo servisse de
trajectria para diversos objectos do nosso filme? Pois bem, isto est contemplado atravs
das CAMADAS GUIA DE MOVIMENTO (GUIDE LAYERS).
As camadas guia ficam ocultas nos filmes publicados.
As camadas guia podem actuar sobre interpolao de movimento, mas no sobre interpolao
de formas. Numa cena poder existir mltiplas camadas guia de movimento. Por sua vez,
vrias camadas podem estar vinculadas (guide layers) mesma camada guia de movimento.
Apesar de no ser possvel aplicar camadas guia sobre interpolao de formas, p Flash suporta
um efeito similar: as REFERNCIAS DE FORMA, abordadas no mbito da animao complexa.
Para CRIAR UMA CAMADA GUIA DE MOVIMENTO:

Efectue um clique no boto Add Motion Guide ou invoque o comando Motion Guide a
partir de Insert Timeline; repare na nova camada entretanto criada logo acima da
camada j existente e que agora se encontra vinculada;

An i m a o 2D
|

83

Convm posicionar todas as camadas guia no fim da ordem das restantes camadas,
para que no se arraste por engano uma camada, tornando-se assim numa camada
vinculada camada guia de movimento (explicando mais adiante no captulo da
animao interpolad).
Para desvincular as camadas em relao s guias de movimento, basta coloc-las
acima das guias ou invocar a caixa de dilogo Layer Properties (a partir de Modify
Timeline) e a escolher a opo Normal.

Utilize uma ferramenta de desenho para desenhar a trajectria;


Todas as ferramentas de desenho e pintura podem ser utilizadas para definir a
trajectria excepto a ferramenta Text. Se utilizar as ferramentas Oval ou
Rectangle, dever seleccionar a opo No Color para o preenchimento.

Efectue um clique no frame que representa o final da animao; invoque o comando


Keyframe a partir de Insert Timeline; o objecto que representa a trajectria ficar
assim esttico no intervalo definido;

Invoque o comando Keyframe a partir de Insert Timeline na camada que contm o


objecto que vai descrever a trajectria;

An i m a o 2D
|

84

Apesar de no ser obrigatrio este frame mestre coincidir no tempo com o frame
criado no ponto 3, este ltimo deve estender-se para alm do frame mestre da
camada vinculada.

Ainda com este ltimo frame seleccionado, arraste o objecto a movimentar para a
posio final da trajectria; para o objecto se cingir trajectria, pode activar o
boto Snap to Objects;

Seleccione agora o primeiro frame da camada vinculada e arraste o objecto a


movimentar par a aposio inicial da trajectria (Figura 6.14);

Por valor assumido, o Flash comea o movimento a partir do incio da trajectria definida na
camada guia, mas esse comeo poder no coincidir com o nosso propsito. Para que no
ocorram saltos bruscos tanto no incio como no fim da trajectria, habitue-se a definir as
posies inicial e final do objecto um pouco desfasadas do incio e fim da trajectria.
Efectue um clique num qualquer frame da camada vinculada e invoque o comando Create
Motion Tween a partir de Insert Timeline;
Reproduza a animao atravs do comando Play do menu Control ou carregando
directamente no boto Play do Controlador.
Algumas CONSIDERAES E DICAS a ter em conta:
suposto que com as guias de movimento alguns objectos tenham um comportamento similar
quele que observamos no nosso dia-a-dia e no comportamentos irreais e absurdos; dever
assim ter algum cuidado e ponderao na aplicao das guias de movimento;
Ateno s guias de movimento que vinculam mais do que uma camada e, assim, vrios
objectos; os pontos de partida e final da trajectria destes objectos podero no coincidir;
Se animar vrios objectos ao mesmo tempo com as guias de movimento, tenha ateno para
que as respectivas trajectrias no conduzam a choques ou efeitos inesperados de
sobreposio;
Para que no ocorram saltos bruscos tanto no incio como no fim da trajectria, habitue-se a
definir as posies inicial e final do objecto um pouco desfasadas do incio e fim da
trajectria; h ainda quem estenda a trajectria da guia de movimento para alem dos limites
d palco;
Caso a trajectria de um objecto cuja camada est vinculada deixe de ser coincidente com a
da guia de movimento foi indevidamente alterada; para que este tipo de acidentes no
ocorra, as camadas guias de movimento devero estar bloqueadas;

An i m a o 2D
|

85

Caso a trajectria de um objecto cuja camada est vinculada seja em linha recta e no siga a
trajectria da guia de movimento previamente definida, isto significa que o objecto no foi
encaixado (snap) trajectria da guia; no se esquea deste pormenor e do boto Snap to
Objects;
Caso determinada camada no esteja devidamente vinculada a uma guia de movimento,
poder utilizar a caixa d dilogo Layer Properties e a opo Guided.

PARTE 3
Concluso

An i m a o 2D
|

86

7.5.1. Parte 3 - Concluso

An i m a o 2D
|

87

Concluso
Este manual de formao, seguindo um estilo prtico e directo, permite conhecer as
principais potencialidades do Flash MX.

An i m a o 2D
|

88

Bibliografia

Internet www.pc-cuadernos.com Flash MX.

Flash MX 2004 Pedro Cid Ferreira, FCA Editora de Informtica.

An i m a o 2D
|

89

You might also like