manual flash

89
Animação 2D 1 | PARTE 1 ............................................................................................... 4 Parte 1 - Introdução .................................................................................. 4 Enquadramento do curso .................................................................................. 5 Objectivos Pedagógicos .................................................................................... 6 1.2. Objectivos Gerais ............................................................................... 6 1.3. Objectivos Específicos ......................................................................... 6 Estrutura Programática .................................................................................... 7 PARTE 2 ............................................................................................... 8 Parte 2 - Desenvolvimento .......................................................................... 8 2. Flash .................................................................................................... 9 2.2. Flash – o que é?.................................................................................. 9 2.3. A quem se destina .............................................................................10 2.4. Flash Player .....................................................................................10 2.5. Características gerais .........................................................................11 3. PROJECTOS MULTIMÉDIA ............................................................................13 3.1. A riqueza da multimédia ......................................................................13 3.2. Concepção dos projectos .....................................................................14 4. DINÂMICA DO FLASH .................................................................................16 4.1. Metáforas .......................................................................................16 4.2. Interface ........................................................................................17 4.2.1. Gestão dos painéis .......................................................................22 4.3. Etapas ...........................................................................................23 4.3.1. Criação/Importação do conteúdo......................................................23 4.3.2. Organização e Sincronização ...........................................................24 4.3.3. Adicionar interactividade/programação (opcional) .................................25 4.3.4. Publicação/ Exportação do filme ......................................................25 4.4. Ajuda ............................................................................................26 5. 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. Alteração da ordem das camadas e pastas ...........................................33 5.3.6. Seleccione camadas e pastas ...........................................................33

Upload: sandra-coelli

Post on 24-Dec-2015

20 views

Category:

Documents


2 download

DESCRIPTION

Introdução ao Flash

TRANSCRIPT

Page 1: Manual Flash

Animação 2D 1

|

P A R T E 1 ............................................................................................... 4

Parte 1 - Introdução .................................................................................. 4

Enquadramento do curso .................................................................................. 5

Objectivos Pedagógicos .................................................................................... 6

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

1.3. Objectivos Específicos ......................................................................... 6

Estrutura Programática .................................................................................... 7

P A R T E 2 ............................................................................................... 8

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

2. Flash .................................................................................................... 9

2.2. Flash – o que é? .................................................................................. 9

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

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

2.5. Características gerais ......................................................................... 11

3. PROJECTOS MULTIMÉDIA ............................................................................ 13

3.1. A riqueza da multimédia ...................................................................... 13

3.2. Concepção dos projectos ..................................................................... 14

4. DINÂMICA DO FLASH ................................................................................. 16

4.1. Metáforas ....................................................................................... 16

4.2. Interface ........................................................................................ 17

4.2.1. Gestão dos painéis ....................................................................... 22

4.3. Etapas ........................................................................................... 23

4.3.1. Criação/Importação do conteúdo ...................................................... 23

4.3.2. Organização e Sincronização ........................................................... 24

4.3.3. Adicionar interactividade/programação (opcional) ................................. 25

4.3.4. Publicação/ Exportação do filme ...................................................... 25

4.4. Ajuda ............................................................................................ 26

5. 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. Alteração da ordem das camadas e pastas ........................................... 33

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

Page 2: Manual Flash

Animação 2D 2

|

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

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

5.3.9. Modos de visualizarção 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. Cabeça de leitura (Playhead) .......................................................... 38

5.5. Frames ........................................................................................... 38

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

5.5.2. Modos de visualização ................................................................... 40

5.5.3. Operações sobre frames ................................................................ 41

5.5.4. Rótulos, Comentários e Âncoras ....................................................... 44

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

5.6. Símbolos ......................................................................................... 46

5.6.1. Tipos de símbolos ........................................................................ 46

5.6.2. Criação genérica de símbolos .......................................................... 48

5.6.3. Graphics ................................................................................... 49

5.6.4. Botões ..................................................................................... 49

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

5.6.6. Edição de símbolos ....................................................................... 51

5.6.7. Duplicação de símbolos ................................................................. 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. Símbolos de outros Filmes .............................................................. 59

5.8. Instâncias ....................................................................................... 59

5.8.1. Criação de instâncias .................................................................... 60

5.8.2. Propriedades das instâncias ............................................................ 60

5.8.3. Quebra de ligação das instâncias ...................................................... 62

5.9. Um painel com história ....................................................................... 63

Page 3: Manual Flash

Animação 2D 3

|

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

6.1. Cor e transparência ............................................................................ 65

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

6.1.2. Gradientes ................................................................................ 68

6.1.3. Paletas ..................................................................................... 69

6.2. Personalização das ferramentas de desenho ............................................... 70

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

7. TÉCNICAS DE ANIMAÇÃO ............................................................................ 76

7.1. Cenas ............................................................................................ 76

7.2. Animação frames-by-frame .................................................................. 77

7.3. Animação interpolada (tweening) ........................................................... 78

7.3.1. Interpolação de formas (shape tweening) ............................................ 78

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

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

7.5.1. Parte 3 - Conclusão ...................................................................... 87

Conclusão ................................................................................................... 88

Bibliografia ................................................................................................. 89

Nota ....................................................................... Erro! Marcador não definido.

Page 4: Manual Flash

Animação 2D 4

|

PARTE 1

Introdução

Parte 1 - Introdução

Page 5: Manual Flash

Animação 2D 5

|

Enquadramento do curso

É hoje fundamental, para o desenvolvimento dos diversos sectores, dinamizar e valorizar os

recursos humanos através de programas formativos adaptados às novas tecnologias.

É reconhecida a importância que as novas tecnologias desempenham no trabalho e na vida

moderna. Os computadores deixaram de ser considerados como objectos estranhos, tornando-

se um auxiliar precioso e indispensável ao desenvolvimento das actividades económicas e com

um profundo reflexo nas outras vertentes da vida humana, sejam elas de carácter social,

administrativo, cientifico, cultural e até do laser.

Esta situação, não permite que hoje, na generalidade das actividades profissionais, se possa

prescindir da utilização de recursos informáticos.

Page 6: Manual Flash

Animação 2D 6

|

Objectivos Pedagógicos

1.2. Objectivos Gerais

O curso de Produção Multimédia para a Internet – O Flash visa dotar os formandos dos

conhecimentos necessários para desenvolvimento de animação para sites com Flash MX,

animações com imagens, gráficos 2D, som e interactividade.

1.3. Objectivos Específicos

Em termos de competências específicas a adquirir, pretende-se que no final do curso os

formandos sejam capazes de:

Criar símbolos;

Trabalhar com layers;

Manipular Frames;

Tweening motion com motion guide;

Publicar e exportar projectos.

Page 7: Manual Flash

Animação 2D 7

|

Estrutura Programática

A estrutura programática do curso de formação foi desenvolvida tendo por base as

características do público-alvo, as suas necessidades de formação e os objectivos pedagógicos

que se pretendem alcançar com a intervenção formativa. Os conteúdos programáticos a

desenvolver visam, globalmente, o reforço do nível de conhecimentos e aptidões dos

formandos, de forma a potenciar a melhoria do seu desempenho profissional.

No âmbito do curso de formação, será prosseguido o seguinte plano de estudos:

Apresentação

Comportamento organizacional

Introdução ao multimédia local e em rede

Interface e ferramentas

Introdução à time line

Criação de símbolos

Introdução aos layers

Frame by Frame

Tweening

Comandos básicos

Test movie

Publicar e exportar projectos

Page 8: Manual Flash

Animação 2D 8

|

PARTE 2

Desenvolvimento

Parte 2 - Desenvolvimento

Page 9: Manual Flash

Animação 2D 9

|

2. Flash

2.2. Flash – o que é?

Semelhante à história de muitos outros programas, o Flash começou por ser Future Splasch

Animator, um pequeno programa de criação e de animação vectorial. Contudo, em 1997,

adivinhando o que viria a ser a base tecnologia da disponibilização de conteúdo multimédia

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 criação de interfaces de

navegação 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 equações

matemáticas ou vectores, que incluem informação acerca das dimensões dos, objectos da

forma de preenchimento, da cor e da posição, este formato é independente da resolução, o

que significa que uma imagem que ocupe todo o ecrã do monitor não sofre nenhuma

degradação de qualidade após 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 através de um conjunto de PIXELS (unidade de medida dos pontos visíveis 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 compressão optimizada

para a web.

A chave do sucesso do Flash é muito simples: integrar, interligar e compatibilizar na sua

génese tudo o que seja necessário (som, imagem fixa e animada, texto e vídeo) para criar

web sites, sejam ferramentas para CRIAÇÃO/EDIÇÃO DE IMAGENS, HTML necessário para

visualização do conteúdo nos browsers; PROGRAMAÇÃO básica e avançada... tudo isto é

possível manipular de maneira simples e consistente, obtendo-se em contrapartida um

resultado profissional e atractivo.

Aplicações web, interfaces de utilizador (ex. CD-ROM, DVD, telemóveis, PDA e outros

dispositivos móveis) ou e-learning são apenas algumas das áreas que utilizam conteúdo criado

com o Macromedia Flash. Proponho uma visita aos links seguintes para observar algumas das

potencialidades do Flash:

Page 10: Manual Flash

Animação 2D 10

|

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

estão em condições de apreciar as animações ou outros elementos criados no Flash.

Este programa tem interesse para a generalidade das entidades que utilizam a Web como

plataforma de distribuição de informação de carácter institucional, educativo, lazer,

publicidade ou de outros tipos. De entre os utilizadores do Flash, destacam-se:

Profissionais (ex. web desingners /programadores ) ligados à produção/ publicação de

interfaces de navegação para a web (ou outros suportes do tipo CD-ROM, DVD, televisão

interactiva, PDA, Pochet PC, consolas de jogo/entretenimento, etc.) e de animação rica em

multimédia;

Alunos, formadores de cursos nas áreas da Internet, multimédia ou ferramentas digitais.

Apesar de ser um programa com uma complexidade técnica maior do que, por exemplo, um

processador de texto vulgar, isto não significa que aqueles que no dia-a-dia apenas realizam

processamento de texto não possam criar web sites de grande riqueza visual, com elementos

de navegação, vídeo, logótipos animados, animações potentes e sincronizados com sons e com

um nível substancial de interactividade e programação.

2.4. Flash Player

Para visualizarmos os filmes criados no Flash, necessitamos de uma aplicação 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 são alguns dos

exemplos de terceiros que suportam esta aplicação.

Page 11: Manual Flash

Animação 2D 11

|

Com o Macromedia Flash MX Professional 2004 surgiu a possibilidade de criar conteúdo

multimédia para uma versão específica do Flash Player, denominada Flash Lite, dirigida aos

dispositivos móveis. É uma versão semelhante ao Flash Player 4, sendo que está optimizada

para a memória, velocidade do processador e área de ecrã características dos dispositivos

móveis. O conteúdo criado no Flash Profissional pode ser validado para ser suportado pelo

Flash Lite, sendo que este contém algumas características, entre as quais:

Estarem reservadas determinadas teclas para efeitos de navegação (estas teclas podem variar

de dispositivo para dispositivo);

Algumas das funções e propriedades do ActionScript não suportadas;

Os formatos de som suportados são 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 distribuído em

diferentes suportes (ex: CD-ROM; Intranet), pelo que deverá consultar os seguintes endereços

para obter mais informações:

http://www.macromedia.com/support/ shockwave/info/licensing/faq.html

http://www.macromedia.com/shockwave/dowload/license/desktop/

Com a “pré-instalação” nos browsers de maior relevo, não é de estranhar que principais

empresas líderes 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 aplicação da Macromedia, o Macromedia Shochwave Player, também permite

visualizar conteúdo multimédia.

2.5. Características gerais

É inquestionável que vivemos hoje em dia o “sonho digital”. A mensagem, a ideia ou a linha

de força têm de vir revestidas de impulsos digitais instantâneos atractivos, interactivos e num

formato diversificado.

A incorporação de suportes como o CD-ROM nos computadores pessoais veio abrir uma luz ao

fundo do túnel no que diz respeito à experiência multimédia, principalmente ao nível da

percepção de cariz pessoal.

Page 12: Manual Flash

Animação 2D 12

|

Mas, depressa a necessidade individual se tornou um imperativo global. Sendo um fenómeno

de massas, nomeadamente a partia da década de 90, a www acelerou a convergência maciça

de diferentes formatos de informação numa plataforma comum de comunicação. Aliadas á

diversidade, surgiram também a morosidade e a (falta de) atractivamente.

Dúvidas cada vez mais unânimes pairavam na cabeça dos utilizadores: porquê suportar

tamanha lentidão nas ligações, para no fundo aceder a repositórios estáticos de informação,

sem qualquer tipo de interactividade? Para quando formatos de informação estandardizados e

optimizados para uma plataforma comum? Texto dinâmico, imagens fixas e animadas, som e

vídeo...será possível 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 MÉTODOS DE COMPRESSÃO aplicados aos diferentes formatos, PNG, SWF, XML,

MP3 e outros tipos de formatos/tecnologias permitem perspectivar um universo dinâmico de

sensações 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 característica implícita ao funcionamento do flasch diz respeito a uma inteligente

REUTILIZAÇÃO DE ELEMENTOS MULTIMÉDIA (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 INSTÂNCIAS desses mesmos elementos em diferentes

situações, não contribuindo este facto para o aumento dos ficheiros de suporte, mas antes

mantendo tamanhos indicados para distribuição na web. Inclusive, as instâncias de um mesmo

objecto poderão ter características e comportamentos diferentes consoante o contexto em

estão inseridas.

Existe ainda a possibilidade de criar bibliotecas partilhadas com elementos (ex: um

determinado som que é invocado ao longo de um site) que poderão ser utilizado pelos

diferentes indivíduos que intervêm na concepção do projecto.

Os SCRIPTS e os COMPONENTES oferecem funcionalidades acessíveis aos mais inexperientes ao

mesmo tempo que garantem aos profissionais uma sofisticação na interactividade.

SCRIPTS são combinações de expressões que dão origem a determinadas instruções. Estas

instruções são criadas no Flash através da linguagem de programação ActionScrit, controlando

aquelas o comportamento de determinados objectivos e do filme em geral. Estas instruções

Page 13: Manual Flash

Animação 2D 13

|

são despoletadas através de determinadas através de determinadas eventos (ex: efectuar um

clique sobre determinado botão), desencadeando-se logo em seguida acções predefinidas.

Importa referir que o Flash está orientado para a criação e posterior distribuição de

conteúdo via web. No entanto, se assim o desejar, este mesmo conteúdo pode ser visto como

vídeo 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, televisão interactiva e

consolas de jogos/entretenimento são outros dispositivos onde o Flash começa a ganhar

terreno.

Eis algumas das características gerais deste programa:

SUPORTE EM DIFERENTES PLATAFORMAS E DESPOSITIVOS –entre outras: Dispositivos portáteis,

consolas de jogos, televisão interactiva, rtc.;

SUPORTE PARA DIVERSOS STANDARDS INTERNET –HTML, MP3, XML.,ECMAScript, etc.;

INTEGRAÇÃO CLIENTE-SERVIDOR – através do Flash Remoting MX existe a intergação com o

ColdfFusion MX, Java e Microsoft.NET, entre outros;

CONTEÚDO COM ACESSIBILIDADES – suporte para utilizadores com incapacidade de várias

ordem;

TEMPLATES – a criação de templates personalizados e componentes de interface pré-

concebidos poderá originar ganhos de produtividade;

CONJUNTO PROFISSIONAL DE FERRAMENTAS –no seu ambiente de edição são disponibilizadas

ferramentas profissionais de design multimédia e de desenvolvimento para a web;

FERRAMENTAS DE DESENVOLVIMENTO – utilização de uma linguagem(ActonScript) potente,

versátil e eficaz com recurso a depuração de código.

Para os programas nesta área, a Macromedia disponibilizou o FLASH PLAYER SDK que contém

documentação sobre a portabilidade para qualquer plataforma, com referência às

implementações em Windows 32 ActiveX, Windows CE 3.0 para o PocketPC 2002 ActiveXe

Linux.

3. PROJECTOS MULTIMÉDIA

3.1. A riqueza da multimédia

Page 14: Manual Flash

Animação 2D 14

|

Ao tratarmos os elementos multimédia, (imagem, texto, som, vídeo e outros) como

OBJECTOS, estes tornam-se MODULARES, ou seja, podem ser movimentados livremente entre

aplicações desde que exista compatibilidade.

Vídeos, sons, textos, imagens fixas ou animadas e demais objectos são manipulados e o

respectivo comportamento pode ser definido via programação.

Para o Flash convergem vários tipos de formato de informação, enriquecendo assim os web

sites.

Imagens (BMP, JPEG, GIF, PNG), vídeo (QuickTime) e sons (WAV, MP3) são alguns dos tipos de

informação suportados. No Flash é possível EDITAR alguns destes elementos, INTERLIGÁ-LOS e

SINCRONIZÁ-LOS.

Uma das potencialidades do Flash na capacidade de divisão dos filmes em CENAS,

aumentando assim a flexibilidade na estruturação das animações.

3.2. Concepção dos projectos

A questão da DEFINIÇÃO DA AUDIENCIA é fulcral.

Quem trabalha nesta área sabe que o seu seguro morreu de velho... por isso, antes de

meter a “mão na massa” é usual dedicar grande parte do tempo do projecto á análise de pré

–requisitos. Inicialmente, teremos de dar resposta a questões do género:

A quem se destina o filme? Qual é o público-alvo?

Qual vai ser a mensagem? Em que formato?

É uma animação simples, linear ou destina-se a ser uma ferramenta de pesquisa interactiva

de formação? Sendo este último caso o pretendido, qual é a extensão do grau de

interactividade?

Quais os elementos média necessários? O documento irá conter, para além de imagens

Vectoriais, bimtaps, vídeo e sons?

Qual irá ser o suporte de distribuição? Será através da Internet, em CD-ROM do tipo stand-

alone?

De quanto é o orçamento afecto a este projecto?

Se a televisão já faz parte da nossa família, tal facto deve-se a uma cada vez MAIOR

PERSONALIZAÇÃO DA MENSAGEM, isto é, cada um de nós sente se cada vez mais representado

Page 15: Manual Flash

Animação 2D 15

|

nos seus gostos. A sofisticação da publicidade daquele meio de comunicação serve de

ensinamento para as plataformas tecnológicas mais recentes e, quando acompanhada de

humor, a combinação pode ser explosiva!

É muito comum no cinema os realizadores utilizarem folhas com as descrições das cenas (um

dos que recorre ao STORYBOARDING é o realizador Steven Spielberg). Este tipo de método

visa expor, de forma simples, as ideias e descreve de uma forma sumária o conteúdo. Ao

mesmo tempo, é um método eficaz de identificar potenciais problemas. Este tipo de

abordagem deve contemplar os itens do projecto: layout, tipos de animações e movimentos,

duração e sincronização, pontos de interactividade e outros que se acharem relevantes. Para

além de permitir explorar várias opções naqueles tópicos, este documento poderá servir de

suporte para discussão entre os intervenientes no projecto.

Muito importante para levar em consideração é o processador dos computadores... Mas

atenção! O PROCESSADOR DOS COMPUTADORES DE DESTINO e não as nossas super máquinas. É

um erro frequente julgar os outros à nossa imagem, imaginando uma audiência com meios

tecnológicos fartos, obtendo-se muitas vezes documentos desajustados às necessidades.

É sabido que em computadores lentos mesmo as animações mais “dinâmicas” poderão parecer

autênticos zombies. Para MENHORAR A PERFOMANCE, deverá ser evitada a animação

simultânea de muitos objectos, principalmente utilizando a interpolação (explicado mais

adiante), para além de, sempre que possível, restringir esta animação a pequenas àreas.

A VELOCIDADE DE PRODUÇÃO também é muitas vezes um factor mal compreendido. Não

devemos seguir a ideia de “quando mais rápido melhor”, já que para uma máquina que no

máximo 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 máximo dos máximos. A excepção acontece

quando o filme é exportado no formato QuickTime ou AVI, em que se podem definir outros

valores.

A DIMENSÃO DO FILME é também importante e varia consoante a natureza do projecto. Sabe-

se que, em princípio, 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.

Page 16: Manual Flash

Animação 2D 16

|

A primeira impressão é muitas vezes decisiva e se ainda não existe um lema no que diz

respeito à visualização dos filmes Flash na web, arriscaria um do género “grandes demoras

implicam grandes desistências”. Para fugir a este lema, muitos sites utilizam PRELOADERS,

que mais não são do que pequenas sequências animadas que são executadas enquanto o

conteúdo do filme é carregado. No entanto, estas sequências não deverão ultrapassar 5 a 10%

da duração do filme, caso contrário, “grandes demoras implicam grandes desistências”.

4. DINÂMICA DO FLASH

Depois de descodificarmos alguns termos que fazem parte do léxico de tralho do Flash, será

focada a interface do programa, bem como toda a dinâmica subjacente à elaboração dos

filmes, i.é., as etapas a executar para a realização dos filmes flash. Vamos então perceber a

razão pela qual o flash é considerado o mago da web.

4.1. Metáforas

No Flash vamos encontrar cenários, elencos, cenas, efeitos especiais, montagens, sons e

muitas outras coisas.

Alguns termos que desde já convém descodificar:

DOCUMENTO- é o filme que vai sendo criado durante a fase de edição; tem como suporte o

ficheiro nativo do Flash, com extensão Fla; neste formato há sempre a possibilidade de editar

os elementos que o integram;

FILME FLASH- é uma versão optimizada tendo em vista a distribuição na web; tem como

suporte o ficheiro com o formato .swf (conhecido como swif, derivado de Shochwave Flash);

para efectuar alterações nestes filmes, estas terão de recair sobre o documento associado;

ANIMAÇÕES – parte de um filme, resultante de um conjunto de objectivos animados;

PROJECTOS (executáveis)- formato de publicação, com extensão .exe no ambiente Windows

e, hpx em Macintosh; são ficheiros que permitem correr os filmes nos computadores sem

Page 17: Manual Flash

Animação 2D 17

|

que seja necessário ter instalado o Macromedia Flash; este formato não permite a edição dos

conteúdos, sendo neste caso necessário 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 não no ambiente de edição 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

configurações/personalizações, o Flash utiliza duas pastas;

First Run – contém os ficheiros comuns a todos os utilizadores;

Configuration –contém os ficheiros que cada utilizador personalizou durante a sessão da

aplicação.

Cada vez que iniciamos uma sessão do Flash, é feita uma comparação entre as duas pastas e

caso algum dos ficheiros comuns não 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 painéis acopláveis, etc. É provável que um designer personalize o ambiente de

edição de forma diferente à de um programador, já que desempenhando diferentes papéis

utilizam diferentes recursos (por exemplo, ferramentas).

Page 18: Manual Flash

Animação 2D 18

|

A partir do comando Preferentes do menu Edit, temos acesso ao separador General da caixa

de diálogo Preferences. Na parte inferior deste separador existem várias opções para o

arranque da aplicação: Show Start Page (mostrar página inicial), New Document (criar novo

documento), Last documents open (abrir documentos recentes) e No document ( sem

documento).

Panorâmica geral da interface do Flash:

Page 19: Manual Flash

Animação 2D 19

|

Painéis

Palco Linha do tempo

Camada

Ferramentas de desenho e pintura

Inspector de propriedades

Através dos comandos Toolbar e Tools do menu Window, é possível personalizar a interface ao

nível das barras de ferramentas a incluir. São quatro as barras que se podem incluir:

FERRAMENTAS PADRÃO (Main)

Page 20: Manual Flash

Animação 2D 20

|

New – criar ficheiro

Open – abrir ficheiro;

Save – gravar ficheiro;

Print – Imprimir;

Cut – cortar;

Copy – copiar;

Paste – colar;

Undo – desfazer acção;

Redo – refazer acção;

Snap – encaixar objectos; é uma espéciedeíman;

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)

Page 21: Manual Flash

Animação 2D 21

|

BARRA DE EDIÇÃO (Edit Bar )

Retroceder ao modo de edição do documento;

Cena corrente;

Símbolo editado;

Menu pendente de acesso às cenas do filme;

Menu pendente de acesso aos símbolos do filme;

Percentagem de visualização do palco.

CONTROLADOR (Controller)

Semelhante a um vulgar comando de vídeo, permite aplicar sobre o filme determinadas

acções:

Page 22: Manual Flash

Animação 2D 22

|

Stop- para a reprodução

Rewind – “ rebobinar” o filme para o frame 1;

Step Back – retroceder frame a frame;

Play – reproduzir;

Step Forward – avançar 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 além destes menus, estão

também disponíveis menus de contexto, cujos comandos surgem referenciados à posição do

cursor do rato (efectuar um clique com o botão direito do rato sobre o palco, objectos,

frames, camadas, etc.)

As barras Main e Controller poderão estar flutuantes sobre a interface. Uma maneira rápida

para efectivar esta opção é a combinação <Ctrl> + Para voltar ao estado inicial, bastará

efectuar um duplo clique sobre a barra de título.

4.2.1. Gestão dos painéis

O ambiente de edição no Flash pode tornar-se confuso para quem não estiver habituado a

tantos painéis com diferentes tipos de informação.

Os PAINÉIS ajudam-nos a ver, organizar e modificar propriedades de diferentes elementos

que constam num determinado documento (por exemplo, frames, símbolos, instâncias, cores,

etc.). Os diversos painéis são invocados a partir do menu Window e estão divididos em três

categorias:

DESIGN PANELS (painéis ligados ao design) –Align, Color Mixer, Color Swaychs, Info, Scene e

Transform;

Page 23: Manual Flash

Animação 2D 23

|

DEVELOPMENT PANELS (painéis ligados à programação) – Actins, Bbehaviors, Componentes,

Componentes Inspector , Debugger, Output e Web Services;

OTHER PANELS (outros painéis) Accessibility, History, Movie Explorer, String e Common

Libraries.

4.3. Etapas

Para entendermos melhor a elaboração das animações, devemos seguir as seguintes etapas

básicas inerentes à criação de filmes no Flash.

4.3.1. Criação/Importação do conteúdo

Criamos novos documentos a partir da página inicial ou do menu File -> New. Há ainda a

possibilidade de criar a partir de um modelo/template. Um filme não é 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 não, animados. Muitas das

propriedades destes objectos podem ser alteradas recorrendo a PAINÉIS específicos.

Page 24: Manual Flash

Animação 2D 24

|

Depois de personalizados, estes ou qualquer outro tipo de documentos poderão ser gravados

como template, através do comando Save as Template do menu File.

O conteúdo dos filmes do Flash é suportado por dois tipos de ficheiros: um de edição, com a

extensão .fla, onde são criadas as animações e aplicada a interactividade; ao outro, com

extensão .swf, é aplicada a compressão, de forma a obter uma versão optimizada para a

web, Como é lógico, o ficheiro de edição (documento) tem um tamanho maior quando

comparado ao filme Flash,

Os objectos criados ao ambiente de edição do Flash transformar-se-ão em elementos

efectivos do “elenco” logo que sejam convertidos em SÍMBOLOS (Modify ->Convert to Symbol)

e estejam assim armazenados numa BIBLIOTECA (library), facilitando desta forma a sua

gestão. Estes símbolos poderão ser criados de raiz no documento, através do comando New

Symbol do menu Insert.

A mais-valia do Fash consiste em aplicar diversas INSTÂNCIAS de um mesmo símbolo em

diferentes cenários e com diferentes propriedades.

4.3.2. Organização e Sincronização

Agora que já temos elementos disponíveis para o nosso filme, teremos de posiciona-lo no

PALCO (stage), a partir do qual visualizamos o decorrer de toda a acção.

A estrutura e a sequência da acção estão 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 espaço e no tempo, através dos FRAMES.

OS FRAMES representam instantes temporais onde visualizamos o conteúdo do filme num

determinado momento, permanecendo este conteúdo visível enquanto o frame está no “ar”.

Dito de outra forma, ao reproduzirmos o filme, existe um PONTEIRO/CABEÇA DE REPRODUÇÃO

que se move de frame em frame (da esquerda para a direita na Linha do tempo, caso não

exista programação que altere esta ordem), lendo a informação que vai sendo visualizada no

palco. A velocidade do filme tem assim uma relação directa com o número de frames

(fotogramas) processados num segundo, i.é., fps.

Page 25: Manual Flash

Animação 2D 25

|

Quando estruturarmos o conteúdo dos nossos filmes, pensamos e agimos numa lógica de

sobreposição de diferentes objectos, de forma a criar determinados efeitos, noções de

profundidade, transparências, máscaras, etc. Para este efeito, utilizamos as CAMADAS

disponíveis na Linha do tempo.

As aplicações de diferentes TÉCNICAS DE ANIMAÇÃO, de que é exemplo a interpolação,

também estão contempladas no Flash.

Uma outra vantagem do Flash é a possibilidade de dividir o filme em CENAS para uma melhor

distribuição do conteúdo, obtendo-se assim uma flexibilidade inexistente noutros programas

similares. Como é óbvio, todas estas cenas vão constar da publicação do filme.

4.3.3. Adicionar interactividade/programação (opcional)

A INTERACTIVIDADE num filme pode estar representada através de botões ou noutros pontes,

permitindo a navegação por diferentes secções, cenas ou até saltos para o exterior (por

exemplo, para determinado URL).

O flash coloca à disposição do leitor determinados COMPONENTES que mais não são do que

elementos visuais de interface pré-concebidos (por exemplo, caixa de verificação caixa de

listagem, caixa de combinação, botão de opção, botão de comando, barras de deslocamento,

etc.).

A programação ACTIONSCRIPT 2.0 vem estender as capacidades do filme para além daquilo

que é efectuado no palco e na Linha do tempo.

Mas para quem a programação se resume a aplicar num filme o mínimo de interactividade,

estão disponíveis BEHAVIORS que poupam o utilizador de aprofundar a linguagem de

programação.

4.3.4. Publicação/ Exportação do filme

À medida que finalizamos o filme, vamos utilizando o CONTROLADOR (uma espécie de

comando de vídeo) para o reproduzir dentro do ambiente de edição do Flash, bem como para

efectuar TESTES.

Page 26: Manual Flash

Animação 2D 26

|

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

distribuição do filme (caso seja esse o seu destino)- ou EXPORTAR para um dos formatos

suportados ou PUBLICAR em diferentes formatos, com características específicas inerentes a

cada um deles.

4.4. Ajuda

Através dos comandos do menu Help acedemos ao painel Help que contém dois separadores:

Help- informação de ajuda generalizada;

How Do I...- pequenas lições sobre as funcionalidades do Flash; é por aqui que os

utilizadores menos experientes deverão começar.

Assim, só temos que clicar nas matérias do lado esquerdo dos separadores e vizualizar o

conteúdo pretendido no lado direito. No painel existem ainda alguns botões:

History Back – retroceder um passo;

History Forward – avançar um passo;

Table of Contents- mostrar o índice de conteúdos dos separadores;

Sarch- pesquisar palavras ou expressões;

Print- imprimir conteúdo;

Update- actualizar conteúdos via Internet.

No ambiente Windows é possível aumentarmos o tamanho da letra nos painéis de ajuda. Para

isso, prima (e não largue) a tecla <Ctrl> e rode o terceiro botão (normalmente um botão em

forma de roda) do rato.

Através do menu Help temos acesso a diferentes manuais em formato digital:

Page 27: Manual Flash

Animação 2D 27

|

GETTIN STARTED- serve de introdução ao Flash;

USING FLASH – informação 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 – introdução aos conceitos da programação ActionScript.

5. DO PALCO AOS BASTIDORES

Como se processa a criação de um filme, focando para isso o palco onde decorre a acção e o

modo de interligar e compor os diferentes tipos de conteúdos.

5.1. Separadores de documentos

A forma de acesso aos documentos é através de separadores identificado com os nomes que

dão títulos aos ficheiros. Para aceder ao documento basta efectuar um clique sobre o

separador que contém o nome do filme, destacando-se esse separador em primeiro plano

relativamente aos restantes.

Sempre que editamos um documento, e até gravamos as alterações, aparece um asterisco à

direita do novo separador.

5.2. Palco (stage)

É no palco que criamos e visualizamos o conteúdo da nossa animação. Serve assim, de pano

de fundo para o nosso filme.

Page 28: Manual Flash

Animação 2D 28

|

Dizendo isto de uma outra forma: é no palco que está representado o conteúdo do filme, isto

é o palco representa o conteúdo, num determinado momento, da(s) camada(s). É através do

palco e os objectos nele apresentados que interagimos directamente com o filme.

Para uma melhor precisão e orientação, temos à disposição no palco uma régua (View ->

Rulers), uma grelha (View -> Grid -> Show Grid) e guias (View -> Guides -> Show Guides).

Quando criamos um novo documento, devemos definir logo de início algumas propriedades,

através da caixa de diálogo Document Properties que encontramos no menu Modify ->

Document:

Page 29: Manual Flash

Animação 2D 29

|

Dimensions –especificar o tamanho do filme, através da largura ( Width) e da altura (Height);

as unidades são representadas em pixels;

Em relação ao tamanho padrão do filme, ele é de 550x400 pixels; no que diz respeito aos

valores mínimo e máximo, eles são de 1x1 pixels e de 2880 x 2880 pixels, respectivamente.

Match:

Printer- ao efectuar um clique neste botão faz coincidir o tamanho do palco com a área de

impressão definida para a impressora;

Contents – ao efectuar um clique neste botão atribui um espaço idêntico à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 botão;

Default – ao efectuar um clique neste botão atribui ao palco o tamanho por valor assumido;

Background Color – definir a cor de fundo do palco através da paleta;

Frame Rate – definir a velocidade de reprodução do filme, i. é ., o número 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 vão ser percorridos 10 frames ou, por outras palavras,

os objectos de cada frame permanecerão no palco (no “ar”) cerca de 1/10 segundos. O valor

normal indicado para a reprodução de animações nos web sites varia entre 8 e 12 fps. No

entanto, não custa nada ir testando diferentes velocidades...

Ruler Units - unidade de medida da régua (Inches, Inches decimal, Points, Centimeters,

Milimeters e Pixels);

Make Default – aplica as definições escolhidas a todos os novos documentos.

5.3. Camadas (layers)

Page 30: Manual Flash

Animação 2D 30

|

As CAMADAS são o coração do Flash. Reparem no seguinte: com uma ferramenta deste tipo,

com todas as potencialidades disponíveis e com uma inspiração “divina”, podemos cair (e

bem!) na tentação de criar animações complexas, com uma variedade de objectos distintos,

com diferentes posições perspectivas, tamanhos, formas, cores, transparências, etc...!

Ora, até aqui tudo bem. Mas... como é possível organizar toda esta panóplia de itens, de uma

forma integrada, coerente, realística e independente? Através 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 são 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 nós que o aumento do número de camadas não contribui para o aumento de

tamanho do documento é possível ir adicionando camadas sucessivas até ao limite imposto

pela memória disponível no computador.

A vantagem desta abordagem. Comum a outros programas, como por exemplo, o Adobe

Photoshop e o próprio Macromedia Director (com os canais do Score) recai na separação

entre, por exemplo, objectos estáticos e objectos animados, permitindo, por um lado, uma

fácil identificação das porções que compõem a animação e, por outro, a edição independente

de determinados objectos, sem interferir assim nos demais.

Para aplicar sons e acções a um filme, utilizam camadas separadas.

Page 31: Manual Flash

Animação 2D 31

|

No Macromedia Flash existe a possibilidade de criação de PASTAS na Linha do tempo que nos

permitem organizar as camadas segundo determinados critérios (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 botão Insert Layer que está posicionado na parte inferior da área das

camadas.

O nome que o Flash aplica à camada está directamente relacionado com o número de

camadas ou pastas já criadas (Layer 1, Layer 2, Layer 3... Layer n). Ora, este critério pode

não ser o mais coerente para o nosso projecto, pelo que sempre que possível aquele nome

deverá reflectir o tipo de objectivos e as acções 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:

Page 32: Manual Flash

Animação 2D 32

|

Invoque o comando Layer Folder do menu Insert;

Efectue um clique no botão 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 número de pastas ou

camadas já criadas (Folder 1, 2, Folder 3... Folder n). Ora, tal como acontece com a

criação de camadas, este critério pode não ser o mais coerente para o nosso projecto, pelo

que sempre que possível 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 “directório” que encontramos em

alguns sistemas operativos. Assim as pastas podem conter não só camadas, mas também

outras pastas.

Podemos utilizar o triângulo logo atrás 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 posição, 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 botão Delete Layer que está

posicionado na parte inferior da Linha do tempo;

ou

Arraste a camada até ao botão Delete Layer.

Pode utilizar a tecla de <Shift> para seleccionar blocos de camadas/pastas adjacentes ou a

tecla de <Ctrl> para camadas/pastas não adjacentes. O que pode acontecer é que vai apagar

Page 33: Manual Flash

Animação 2D 33

|

algumas vezes “coisas” por engano. Não se esqueça do comando Undo do menu Edit que

permite desfazer acções.

5.3.5. Alteração da ordem das camadas e pastas

A HIERARQUIA DE SOBREPOSIÇÃO no palco é o reflexo directo da forma como estão ordenadas

as camadas na Linha do tempo. Assim, os objectos que pertencem as camadas posicionadas

mais acima na área das camadas são exibidos à frente dos outros objectos contidos nas

camadas mais abaixo.

Dito de forma, um objectivo está mais perto de nós e mais visível em relação aos restantes,

quando mais acima (na área das camadas) estiver a camada que o contém. Para alterar esta

ordem: arraste a camada ou a pasta que se pretende reordenar para uma nova posição.

5.3.6. Seleccione camadas e pastas

A SELECÇÃO 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 não adjacentes.

Page 34: Manual Flash

Animação 2D 34

|

Para SELECCIONAR PASTAS, basta efectuar um clique no nome.

5.3.7. Copiar camadas

O processo de cópia no Flash assume um papel importante, já que com ele é possível copiar

todo o conteúdo de uma camada ou apenas algumas secções da sequência de uma

determinada animação. Mais, esta cópia pode ocorrer entre camadas do mesmo filme. A

camada que irá receber a informação copiada herda o nome da camada atrvés do qual

derivou o conteúdo.

Assim, para efectuar a CÓPIA DE UMA CAMADA:

Efectue um clique no nome da camada que irá ser copiada, de forma a seleccioná-la;

Invoque o comando Copy Frames atrvés do menu Edit; ->Timeline;

Carregue no botão Insert Layer; temos assim uma nova camada criada que irá receber o

conteúdo 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 triângulo à esquerda da pasta de forma a fecha-la; depois um clique no

nome da pasta cujo conteúdo irá ser copiado, de forma a seleccioná-la;

Invoque o comando Copy Frames do menu Edit;

Carregue no botão Insert Layer Folder ou invoque o comando Layer Folder do menu Insert;

temos assim uma nova pasta criada que irá receber o conteúdo entretanto copiado;

Clique na nova pasta e invoque o comando Paste Frames do menu Edit.

5.3.9. Modos de visualizarção das camadas e pastas

Uma das vantagens do Flash tem a ver com a flexibilidade ao nível da edição das camadas

(apenas uma de cada vez), i e ., durante o processo de edição podemos apenas querer

camadas, para impedir que a edição de algumas interfira no conteúdo de outras. Assim são

quatro os modos de visualização para efeitos de edição:

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

Page 35: Manual Flash

Animação 2D 35

|

palco; ícone (sob a forma de lápis) logo a seguir ao nome da camada indica-nos qual a camada

actual;

OCULTO - ocultar o conteúdo de camadas ou pastas de maneira a realçar de forma a aparecer

um X; ao ocultar uma pasta está também 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

conteúdo, repetimos a operação;

As camadas ou pastas ocultas, apesar de poderem ser exportadas, não poderão ser editadas.

A ocultação das camadas ou pastas não é preservada quando o filme é publicado.

BLOQUEADO - bloquear o conteúdo de camadas ou pastas para que seja visualizado o

conteúdo das mesmas, mas impossibilitada a sua edição, 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á

também 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 operação;

CONTORNOS - aplicar contornos coloridos ao conteúdo 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

operação.

Diferentes camadas podem ter diferentes modos de visualização 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 operações descritas anteriormente estão disponíveis na caixa de diálogo Layer

Properties, acessível a partir do menu Modify ->Timeline -> Layer Properties:

Page 36: Manual Flash

Animação 2D 36

|

Name- atribuir um nome à camada ou pasta.

Show - ocultar/mostrar conteúdo 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 máscara.

Masked – vincular camadas á camada de máscara.

Folder - converter camada em pasta; se a camada tiver conteúdo, deparamo-nos

com uma caixa de diálogo.

Outline color – definir cor do contorno aplicado à camada.

View layer as outlines – visualizar o conteúdo da camada através de contornos.

Layer Height - definir altura da camada (uma maior altura pode ser útil para Camadas

que contêm sons, por exemplo).

Para aceder rapidamente à caixa de diálogo Layer Properties, efectue um duplo clique sobre

o ícone Layer à esquerda do nome da camada.

5.4. Linha do tempo (Timeline)

Se as camadas são o coração do Flash, o cérebro dos filmes reside na LINHA DO TEMPO.

Aqueles que já trabalham no Macromedia Director decerto encontram algumas semelhanças

entre a Timeline e o Score, pois bem, a lógica é quase a mesma...

Page 37: Manual Flash

Animação 2D 37

|

Um FRAME pode conter várias camadas, i. é., podemos (e devemos) dividir os diversos

componentes da nossa animação por diferentes camadas, seguindo uma lógica de

sobreposição, tendo sempre em vista a composição final dos objectos.

Pense, pense e volte a pensar na composição dos elementos no palco, i. e., a sobreposição

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 saída. Quando um filme é inicializado, a Linha do tempo é

percorrido da esquerda para a direita pela CABEÇA DE LEITURA (playhead), para que a

informação contida nos frames seja processada.

A sequência do filme não é obrigatoriamente linear, dependendo da estrutura elaborada e da

programação aplicada.

5.4.1. Mover

A dinâmica de funcionamento com a Linha do tempo é similar à adoptada para os painéis.

Assim, podemos desacoplar a Timeline através do canto superior esquerdo e colocá-la noutras

posições ou convertê-la numa janela flutuante.

Basta apenas arrastá-la pelo ambiente de edição do Flash; para evitar o encaixe,

pressionamos a tecla <Ctrl>.

A Linha do tempo ainda ser expandida ou fechada, utilizando para o efeito o triângulo que se

encontra à esquerda do nome Timelie ou efectuando um duplo clique sobre esse mesmo

nome.

5.4.2. Redimensionar

Page 38: Manual Flash

Animação 2D 38

|

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 também pode ser alargada horizontalmente.

5.4.3. Barra de estados

A barra de estados fornece-nos algumas informações.

Current Frame –frame actual, cujo conteúdo está visível no palco;

Frame Rate – quando o filme não está a ser executado indica a velocidade de reprodução

especificada na caixa de diálogo 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 animação;

Elapsed Teme –espaço tempo (segundos) decorrido entre o primeiro frame actual.

5.4.4. Cabeça de leitura (Playhead)

A CABEÇA DE LEITURA permite identificar qual o frame actual. Podemos percorrer os frames

arrastando a cabeça para a esquerda ou direita. O botão Center Frame permite centrar a

Linha do tempo relativamente ao frame actual:

5.5. Frames

Os FRAMES são instantes temporais do filme que nos mostram o conteúdo das camadas. É

também no frame que poderá residir determinada programação direccionada para o

comportamento do filme.

Provavelmente já ouviu a expressão “tweening”, um conceito referente aos frames, está

subjacente na sua dinâmica. Designam-se IN-BETWEEN FRAMES (frames intermédios) os

frames que estão determinados por frames mestre e que representam pequenos incrementos

necessários para simular determinado ou efeito. O mais espectacular é que o próprio Flash se

se encarrega de os criar, poupando-nos muito trabalho.

Page 39: Manual Flash

Animação 2D 39

|

5.5.1. Tipos de frames

Consoante o tipo de animação requerido, vamos ter associados diferentes frames.

Assim temos:

FRAMES VAZIOS – são frames desprovidas de conteúdo (com um fundo branco) e que são

inseridos por valor assumido na Linha do tempo assim que criamos um novo documento; a

reprodução cessa a partir do ponto em que todas as camadas contêm frames vazios;

FRAMES ESTÁTICOS – estes frames são sempre precedidos por keyframes; assim o conteúdo do

keyframe aparece reflectido em todos os frames estáticos seguintes até ser encontrado um

novo keyframe; são representados a cinzento claro;

FRAMES MESTRES/CHAVES (KEYFRAMES)- é neste tipo de frames que se definem modificações

a diversos níveis, como por exemplo alterações no movimento ou nas características dos

objectos (por exemplo, cor e dimensão); adição ou remoção; para criar um keyframe

invocamos o comando Keyframe através de Insert -> Timeline ou pressionamos a tecla de

função 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 animação associados

(explicados no capítulo das animações), vejamos:

os frames mestres com um pequeno a apenso representam frames com programação;

os frames mestres que referenciam interpolação de movimento estão representados por um

ponto preto e os respectivos frames intermédios têm uma seta preta com um fundo azul

claro a representá-lo;

Page 40: Manual Flash

Animação 2D 40

|

os frames mestres que referenciam interpolação de forma (explicado no âmbito das

animações) estão representados por um ponto preto e os respectivos frames intermédios têm

uma seta preta com um fundo verde claro a representá-los;

Frames com uma linha tracejada referenciam um processo de interpolação

5.5.2. Modos de visualização

Através do menu de exibição dos frames, no canto superior direito da Linha do tempo é

possível acedemos a várias opções no diz respeito ás dimensões das células (quadrículas que

resultam da intersecção da camada com o frame):

Tiny – Células com largura mínima;

Small –células com largura pequena;

Normal – células com largura normal;

Médium- células com largura média;

Large – células 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 têm conteúdo;

Preview- permite visualizar apenas o conteúdo de cada frame, informação esta

redimensionada de forma a encaixar nas dimensões dos frames , da Linha do tempo,

podendo assim ocorrer variações aparentes no tamanho do conteúdo;

Preview In Contet- permite visualizar totalmente cada frame do filme, informação

esta redimensionada de forma a encaixar nas dimensões dos frames da Linha do

tempo. Esta forma de visualização permite assim observar a movimentação dos

objectos dentro dos respectivos frames durante a reprodução da animação. No

entanto, os elementos que a constituem poderão parecer ter uma menor dimensão.

Page 41: Manual Flash

Animação 2D 41

|

5.5.3. Operações sobre frames

Agora que já sabemos quais os tipos de frames disponíveis na Linha do tempo, vamos

descrever as principais operações 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é alcançar o último frame;

liberte o botão do rato para se certificar que o intervalo seleccionado é o desejado.

Para INSERIR FRAMES ESTÁTICOS:

seleccione um frame vazio na Linha do tempo e invoque o comando Frame através de Insert

-> Timeline.

Para INSERIR FRAMES ESTÁTICOS NUM INTERVALO DE FRAMES:

seleccione um frame ou uma porção do intervalo de frames já existente; o número de

frames a inserir equivale ao numero de frames seleccionados;

invoque o comando Frame através de Insert -> Timeline; os novos frames são introduzidos à

direita daqueles previamente seleccionados.

Para INSERIR FRAMES MESTRES NUM FRAME VAZIO:

seleccione um frame vazio na camada;

invoque o comando Blank keyframe através de Insert -> Timeline; deparamo-nos agora com

um rectângulo branco que indica onde acaba o conteúdo de um frame mestre e começa

outro.

Page 42: Manual Flash

Animação 2D 42

|

Para INSERIR FRAMES MESTRES VAZIOS NUM INTERVALO DE

FRAMES:

seleccione um determinado frame de um intervalo frames;

invoque o comando Bank keyframe através de Insert -> Timeline; o frame previamente

seleccionado foi convertido num frame mestre e o conteúdo dos frames subsequentes foi

removido.

Para INSERIR UM FRAME MESTRE:

seleccione um frame vazio ou estático;

invoque o comando Keyframe através de Insert -> Timeline; se o frame previamente

seleccionado for um frame vazio, serão um frame estáticos; caso a selecção prévia tenha

incidido sobre um frame estático, este é convertido em frame mestre.

Para INSERIR UM FRAME MESTRE NUM INTERVALO DE FRAMES:

seleccione um intervalo de frames;

invoque o comando Keyframe através de Insert -> Timeline; automaticamente o último frame

seleccionado é convertido em frame mestre.

Para COPIAR E COLAR FRAMES – são utilizados os comandos Copy

Frames e Paste Frames, ambos através de Edit -> Timeline, com funções

diferentes em relação aos tradicionais comandos de copiar e de colar outros objectos. Para

entender melhor estes conceitos, vamos realizar o seguinte exercício:

crie um novo documento, com frames mestres nas posições 1,3,5,7 e 9:

Page 43: Manual Flash

Animação 2D 43

|

em cada destes frames mestre desenhe o número da respectiva posição, com a ajuda da

ferramenta Text da barra de desenho;

seleccione o keyframe 3 e invoque o comando Copy Frames através de Edit - Timeline;

com o frame 4 seleccionado, invoque o comando Paste frames através de Edit -> Timeline ;

este frame (que antes era um frame intermédio) recebe o novo conteúdo e converte-se num

frame mestre;

com o keyframe 5 seleccionado, invoque de novo o comando Paste Frames através de Edit ->

Timeline; verificamos que o conteúdo é substituído pelo novo conteúdo proveniente do

keyframe 3;

com o frame 4 seleccionado, invoque de novo o comando Paste Framesatravés de Edit ->

Timeline; vereficamos que são criados novos frames intermédios 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 secção da Linha do tempo; ao manter pressionada a tecla

<Alt> enquanto arrasta, efectua uma duplicação.

Para ELIMINAR O CONTEÚDO E REMOVER FRAMES:

O comando Clear Keyframe do menu Modify -> Timeline retira o caracter de frame mestre

específico ou a um intervalo de frames ; ao invocarmos este comando é o conteúdo do frames

mestres, estes tornam-se frames intermédios e o respectivo conteúdo é o conteúdo do frame

precedente; no entanto, este comando não interfere quanto ao número de frames num filme;

o comando Remove Frames do menu Edit -> Timeline elimina efectivamente frames,

frames mestres ou sequência de frames, retirando-os inclusive do filme, reduzindo assim o

número de frames que o constituem.

Muitas vezes torna-se difícil eliminar um frame mestre sem primeiro eliminar os frames

intermédios. Para evitar esta situação, seleccione todos os frames intermédios entre os

frames mestres que se querem eliminar ou elimine todo o conteúdo 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 número

de frames do filme.

Page 44: Manual Flash

Animação 2D 44

|

5.5.4. Rótulos, Comentários e Âncoras

Para CRIAR UM RÓTULO, UM COMENTÁRIO ou UMA ÂNCORA;

seleccione um frame mestre; caso o inspector de propriedades não esteja visível, invoque o

comando Properties do meu window;

Digite uma descrição na caixa de texto Frame;

A partir do menu pendente Label Type defina qual o tipo associado à descrição:

Para visualizarmos a informação, necessitamos de posicionar o cursor sobre o frame mestre.

Os rótulos são identificados na Linha do tempo através de uma pequena bandeira vermelha;

os comentários 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 com “ casca de cebola”) para

Page 45: Manual Flash

Animação 2D 45

|

desenharem determinados elementos, tendo como referência um ou mais elementos que

compõem a animação. A aplicação desta técnica no contexto de edição de filmes do Flash

permite-nos visualizar múltiplos frames simultaneamente, efectivando a sua edição.

Para visualizarmos o conteúdo de vários frames através do onion skin:

Efectue um clique no botão Onion Skin:

repare que o conteúdo de todos os frames incluídos nos marcadores de onion skin aparece

esbatido Os objectos deste conteúdo não podem ser editados, apenas os objectivos do frame

actual, i. e., onde está posicionada a cabeça de leitura;

O conteúdo assente em camadas bloqueadas ou ocultas não é visível quando está

activo o onion skin.

Para visualizar apenas os contornos do conteúdo de vários frames através do onion skin:

Efectue um clique no botão Onion Skin Outlines; repare que do conteúdo de todos os frames

incluídos nos marcadores de onion Skin aparecem apenas os contornos. O funcionamento

deste botão é semelhante ao botão citado anteriormente;

Não esqueça que para cada camada pode atribuir uma cor diferente no que diz respeito ao

contorno, facto este que poderá facilitar o processo de edição.

Para modificarmos o número de fraes pertencentes ao intervalo definido pelos marcadores

de onion skining:

Efectue um clique no botão Modify Onion Markers;

Deparamo-nos com um menu de contexto e várias operações:

Always Show Marke quando seleccionada, permite visualizar os marcadores mesmo quando o

onion Skin está desactivado;

Page 46: Manual Flash

Animação 2D 46

|

Anchor Onion – aplica o onion skin a um intervalo fixo de frames, i, e., o Intervalo não se

desloca à medida que avançamos para outras secções da Linha do tempo. O intervalo poderá

ainda ser rendimensionado arrastando cada um dos marcadores para uma nova posição, i., e

para um novo frame;

Onion 2 – aplica o onion skin os dois frames à esquerda e à direita do frame actual, i. e., da

cabeça 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 múltiplos frames (e não só o frame actual) pertencentes ao intervalo definido

pelos marcadores de onion skinnig:

Efectue um clique no botão Edit Multiple Frames;

Efectue um clique no botão Modify Onion Markers e escolha a opção Onion All; podemos assim

seleccionar, redimensionar, mover ou rodar todos os frames simultaneamente.

5.6. Símbolos

Um SÍMBOLO é 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 símbolo ocorre uma

única vez, podendo haver várias INSTANCIAS a ele referenciadas.

Apenas os símbolos efectivamente utilizados no documento serão incluídos na biblioteca do

filme publicado.

Qualquer objecto criado no palco ou importado para o documento pode ser convertido em

símbolo.

Para um melhor performance, deverá sempre pensar em converter os objectos em símbolos.

5.6.1. Tipos de símbolos

No Macromedia Flash existem três tipos de símbolos; GRAPHICS, BOTÕES e CLIPS DE FILME.

Cada um deles tem uma Linha do tempo e um palco específicos. Têm assim diferentes

Page 47: Manual Flash

Animação 2D 47

|

particularidades, mas basicamente o que os distingue é a forma como interagem com a Linha

do tempo do filme principal:

GRAPHICS (imagens) – imagens geralmente estáticas que irão ser reutilizadas ao longo do

filme. Estes símbolos operam em sincronia com a Linha do tempo do filme principal a que

pertencem e o seu ambiente de edição específico é semelhante ao do filme principal; A única

diferença efectiva entre a Linha do tempo do filme principal e a linha do tempo específica

destes símbolos diz respeito a esta última não suportar os sons interactividade. Apesar desta

limitação, é possível efectuar animações na Linha do tempo graphis. O comportamento destas

animações está, no entanto, condicionado pelo comportamento da Linha do tempo do filme

principal.

Buttons (botões) – como o próprio nome indica, refere-se a objectos interactivos, i

e., que reagem aos cliques do rato; os botões têm a sua própria linha do tempo com

quatro frames a representar os quatro estados possíveis : Up (sobre), Down (pressionado),

Hit (área útil de clique). Um botão poderá assim desencadear um conjunto vasto de

acções consoante a interactiva aplicada e está representado na linha do tempo do filme

principal. Para poder interagir com os botões no ambiente de edição, invoque o comando

Enable Simple buttons do menu Control.

MOVIE CLIP (clips de filme) – a linha do tempo dos clips de filme é totalmente

independente da Timeline do filme princípal fazendo com que estes sejam os mais

interactivos e versáteis elementos do Flash; são como minifilmes independentes que podem

conter sons, animações, botões ou outros clips de filme. Uma das utilizações mais eficazes

consiste em colocar uma instância destes clips de filme dentro da Linha do tempo dos botões

e assim criar botões animados.

Page 48: Manual Flash

Animação 2D 48

|

Não se enervem se a interactividade e a animação dos clips de filme não funcionar no

momento da reprodução do filme principal. É mesmo assim! Para as visualizar, necessitamos

de invocar o comando Test Scene, ambos do menu Control.

5.6.2. Criação genérica de símbolos

A criação pode ser de dois tipos convertendo um objecto previamente seleccionado no palco

ou criado um símbolo a partir da caixa de diálogo Create New Symbol, gerando

posteriormente o conteúdo no ambiente de edição do próprio símbolo.

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 diálogo

Convert to Symbol;

Name - nome do símbolo;

Behavior - tipo de símbolo;

Registration – posição do ponto de registo;

Advanced - alterar entre opções básicas ou avançadas.

O objecto transforma-se num símbolo, sendo adicionado à biblioteca do filme.

Para os do seguinte tipo:

Certifique-se que não existem objectos seleccionados no palco;

Invoque o comando New Symbol do menu. Uma outra forma seria através da janela Library

(explicada mais adiante); deparamo-nos com a caixa de diálogo Create New Symbol,

Page 49: Manual Flash

Animação 2D 49

|

semelhante à caixa Convert to Symbol; Depois de preenchida a caixa de diálogo anterior,

passamos para o ambiente de edição do símbolo, 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 edição dos

símbolos (ou efectuar um clique sobre o nome da cena)e voltar ao ambiente de edição do

filme.

Muitas vezes, quando entramos neste modo de edição, não conseguimos visualizar o ponto de

registo, porque este esta fora de área de visualização. Para o “chamar à razão” invocamos

View -> Magnification -> Show Frame.

5.6.3. Graphics

Na criação de imagens não existem diferentes substanciais ao nível do ambiente de edição

destas em relação ao filme de edição. Palco Linha do tempo, barra de ferramentas, camadas

e animação coincidem na aparência e na dinâmica de trabalho.

5.6.4. Botões

A única diferença efectiva entre a linha do tempo destes botões reage às interacções

provocadas pelo utilizador através do rato.

Para CRIAR BOTÕES:

Depois de certificar-se que não existem elementos seleccionados no palco, invoque o

comando New Symbol do menu Insert. Na caixa de diálogo Creat New Symbol escolha a opção

Button para o comportamento do símbolo e indique um nome. Neste passo, o Flash

proporciona o ambiente de edição específico dos botões;

Na linha do tempo temos agora quatro Frames consecutivos, referentes aos quatro estados do

botão: Up (normal), Over (sobre) Down (pressionando), Hit (área). No estado Up deparamo-

nos com um frame chave em branco;

Na criação do botão no estado Up é possível utilizar ferramentas de desenho à disposição do

Flash, importar imagens ou colocar determinada instância de um símbolo no palco;

Page 50: Manual Flash

Animação 2D 50

|

Para a criação de botões, é possível a utilização de símbolos do tipo clip de filme ou imagens,

mas não de um outro botão. Os botões animados são criados com recurso aos clips de filme.

Efectue um clique no frame Over e invoque o comando Keyframe através Insert -> Timeline; a

imagem do frame anterior é repetida para um novo instante temporal;

Segue-se a respectiva edição neste estado; repita o passo anterior e a respectiva alteração da

imagem para os estados Down e Hit;

O frame Hit define a área do clique que activa o botão, i, é., área útil de clique. Devera ser

uma área sólida suficiente para contemplar todos os elementos afectos aos restantes estados,

não existindo problema caso ultrapasse estes limites. Caso não 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 instância

do novo símbolo para o palco.

O comando Enable Simple Buttons do menu Control activa/desactiva os botões no ambiente

de edição.

Um botão tem que ser suficientemente atractivo e explícito acerca da acção que desencadeia

porque afinal de contas é o ponto de interactividade com o utilizador. Os botões animados

são uma forma de valorizar os filmes e trair a atenção. Outros aspectos relacionados passam

por adicionar sons e texto, valorizando assim a interactividade.

5.6.5. Clips de filme

Estes símbolos são pequenas animações que funcionam como minifilmes, já que contêm toda

a interactividade, som funcionalidade do filme principal. A linha do tempo dos clips de filme

é independente da linha do tempo do filme principal. É possível transformar determinada

animação já criada no palco num clip de filme.

A animação dos clips torna-se independente da Linha do tempo do filme principal, pelo que

pode ser utilizada ao longo do nosso filme, sendo arrastadas instâncias da biblioteca para o

palco.

Page 51: Manual Flash

Animação 2D 51

|

5.6.6. Edição de símbolos

Quando se fala em edição de símbolos, esta pode ocorrer ao nível do conteúdo e a Linha do

tempo a ele associada.

Não se esqueça que, ao editar determinado símbolo, está a efectuar todas as instâncias que

dele derivam.

Para invocar os diferentes ambientes de edição, basta efectuar um clique com o botão direito

do rato sobre o símbolo e do menu de contexto escolher um dos seguintes comandos:

Edit – aqui visualizamos apenas o símbolo; repare que no topo do palco tem informação

acerca do nome do símbolo e da cena em que está inserido; para voltar ao ambiente do filme

principal, pode efectuar uma destas três acções:

invocar o comando Edit Document do menu Edit;

ou

efectuar um clique no nome da cena.

Edit In Place - aqui estamos a editar o símbolo no respectivo contexto/local;

decerto reparou que os outros objectos no palco ficaram em 2º plano para que fosse possível

diferenciá-los do símbolo a editar; para voltar ao ambiente do filme principal, pode efectuar

uma destas três acções:

invocar o comando Edit Document do menu Edit;

efectuar um clique um clique no botão de retorno;

efectuar um clique no nome da cena.

Edit In New Window –aqui podemos editar o símbolo numa janela separada e visualizar o

palco e a Linha do tempo associados ao símbolo, bem como estes itens associados ao filme

principal; para voltar ao ambiente no filme principal feche a janela no botão fechar do canto

superior direito.

5.6.7. Duplicação de símbolos

Page 52: Manual Flash

Animação 2D 52

|

Caso se queira poupar tempo na criação de símbolos semelhantes, mas que tenham por

exemplo comportamentos diferentes, umas hipóteses é a duplicação, onde todo o conteúdo

ou apenas uma parte de determinado símbolo é utilizada.

Seleccione o símbolo na bilbioteca (invoque a bilbioteca a partir do comando Library do

menu Window);

Efectue um clique com o botão direito do rato e do menu de contexto escolha Dupicate;

Preencha o nome do novo símbolo na caixa de diálogo Duplicate Symbol e escolha o

respectivo comportamento, repare no novo elemento na biblioteca.

Esta duplicação também pode ser efectuada partindo de uma instância do símbolo:

Seleccione no palco uma instância do símbolo a duplicar;

Efectue um clique com o botão direito do rato e do menu de contexto escolha Duplicate

Symbol;

Preencha o nome do novo símbolo na caixa de diálogo Duplicate Symbol; Repare no novo

elemento biblioteca.

A instância seleccionada no primeiro ponto foi entretanto substituída por uma instância do

novo símbolo.

5.7. Biblioteca (libraries)

Uma BIBLIOTECA funciona como um repositório dos elementos (itens) que constituem o nosso

filme. Símbolos, sons, vídeos e bimaps são alguns daqueles elementos cujas instâncias

(explicado mais adiante) serão colocados em diversas partes do filme.

Na biblioteca vamos poder organizar, segundo uma lógica personalizada, os diversos itens em

pastas (folders), semelhante ao processo desenvolvido no nosso sistema operativo em relação

aos diferentes tipos de ficheiros.

5.7.1. Painel Library

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

Window :

Page 53: Manual Flash

Animação 2D 53

|

nome da biblioteca;

número de itens que constituem a biblioteca, incluindo as pastas;

àrea reservada à visualização do item; Ao premir o botão direito do rato na àrea

reservada à visualização do item, poderá escolher, a partir do menu de contexto, o

tipo de fundo a aplicar.

botões de play para visualização de símbolos não estáticos ou com interactividade;

colunas com informações sobre algumas características dos itens (explicadas mais

adiante);

ordenar os itens;

expandir o tamanho da janela;

reduzir o tamanho da janela;

criar um novo símbolo; acedemos à caixa de diálogo Create New Simbol;

criar uma nova pasta;

propriedades do item;

apagar itens da biblioteca (inclusive pastas); basta arrastá-los para cima deste ícone;

Ao contrário das versões anteriores do Flash, o comando Undo (desfazer acção)

permite recuperar itens eliminados. Noentanto, estude muito bem a situação antes de

tomar m,edidas concretas.

menu Options (explicado mais adiante ).

5.7.2. Redimensionar a janela

Através dos botões de redução e expansão do tamanho da janela, podemos ajustar o detalhe

da informação fornecido.

As dimensões das colunas Name (nome), Kind (tipo). Use Count (número de instâncias

associadas), Linkage (associado a uma biblioteca partilhada) e Date Modified (data de

Page 54: Manual Flash

Animação 2D 54

|

modificação) poderão ser modificadas posicionando o cursor na divisória desses campos,

arrastando-a posteriormente para a esquerda ou para a direita.

Por valor assumido, a coluna Use Count não é 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 através das propriedades associadas, basta efectuar um clique sobre

a coluna com o nome da propriedade. O botão de ordenar os itens permite organizá-los de

forma alfanumérica.

5.7.4. Menu Options

No menu Options da janela Library, temos as seguintes opções:

New Symbol – criar um novo símbolo. Tem o mesmo efeito que efectuar um clique no botão

New Symbol; depois de escolhido o nome e o tipo de comportamento associado, vamos

directamente para o ambiente de edição específico, com os respectivos palcos e Linhas do

tempo;

Page 55: Manual Flash

Animação 2D 55

|

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 nível superior;

New Font – criar determinado símbolo de texto para partilhar;

New Vídeo – adicionar vídeo ao filme. Ao criar este item na biblioteca, efectua sobre ele um

duplo clique; a partir do botão Import da caixa de diálogo Embedded Video Propeties

importante um determinado vídeo:

Rename – renomear itens;

Move to New Folder – mover determinado item para uma nova pasta; o nome desta pasta é

definido através da caixa de New Folder;

Duplicate – duplicar um determinado símbolo; definir um nome e um comportamento para o

novo símbolo;

Delete – apagar determinado item; o mesmo efeito que efectuar um clique no botão Delete;

deparamo-nos com uma caixa de diálogo para confirmar este acto. É possível seleccionar

múltiplos itens e sobre eles aplicar este comando;

O comando Undo (desfazer acção) não tem efeito o comando Delete, por isso é necessário

estudar muito bem a situação 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 diálogo Select External Editor;

Properties – aceder às propriedades de determinados itens; no caso dos símbolos, acedemos à

caixa de diálogo Symbol Properties, onde para além do nome podemos modificar o

comportamento associado determinado símbolo;

Page 56: Manual Flash

Animação 2D 56

|

Linkage - definir propriedades associados aos símbolos partilhados (explicado mais

adiante);

Component Definition - definir determinados parâmetros para os componentes

(explicados no âmbito dos componentes);

Select Unused Items –seleccionar itens que não foram utilizados no filme;

Os objectos não utilizados no nosso filme, apesar de constarem na biblioteca, não vão

aumentar o tamanho do filme publicado. No entanto, estes itens itens deverão ser apagados,

já que pesam no documento (fla). Se pretender retirá-los definitivamente (e assim já não

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 diálogo Update Library

Items;

Bitmaps, sons e vídeos têm características diferentes dos símbolos. Através do botão Update

da caixa de diálogo Update Library Items fazemos reflectir sobre o elemento incorporado no

nosso filme qualquer alteração ocorridao sobre ele no exterior.

Play – executar determinado item (por exemplo: botão, 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 além da biblioteca standard do filme principal, o Macromedia Flash incorpora algumas

bibliotecas com itens já incorporados e acessíveis através do comando Common Libraries do

menu Window -> Other Panels:

Page 57: Manual Flash

Animação 2D 57

|

Estas bibliotecas mais não são do que documentos do Flash armazenados na pasta Libraries,

subpasta da pasta de instalação do programa. Assim, qualquer ficheiro que esteja inserido na

pasta Libraries encontra-se imediatamente disponível no Flash.

Para CRIAR UMA BIBLIOTECA:

Crie um novo documento;

Crie os símbolos que se querem armazenar na biblioteca ou importe-os;

Agora que estão armazenados, apague-os do palco para poupar no tamanho do

documento;

Invoque o comando Save As do menu; File; na caixa de diálogo Save As indique um

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

Verifique se esta biblioteca se encontra disponível a partir de Window -> Others Panels

-> Common Libraries.

Para visualizar, poderá ter a necessidade de fechar o Macromedia Flash e iniciar uma

nova sessão.

Page 58: Manual Flash

Animação 2D 58

|

5.7.6. Biblioteca de outros filmes

Podemos incorporar no nosso filme símbolos de outras bibliotecas afectas a outros filmes.

Para este efeito, invocamos o comando Open External Library do menu File -> Import.

Agora podemos efectuar duas operações; arrastar para o palco símbolos da biblioteca

“externa” e estes serão 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 gestão dos elementos dos filmes, bem como para

controlar as diferentes revisões do projecto, é possível criar bibliotecas partilhadas, i, é.,

com determinados itens partilhados, aos quais diferentes filmes poderão recorrer. Vantagens

são pelo menos: consist~encia dos elementos e garantia de versões actualizadas.

Assim, elementos que fazem parte de animações comuns em diferentes cenas ou filmes e

ainda sons ou tipos de fontes de texto iguais em diferentes secções do site (só para citar

alguns exemplos), tudo isto poderá ser gerido através da partilha de bibliotecas.

Para que outros filmes possam aceder aos itens partilhados, é necessário 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 “permissões” de

exportação para itens a partilhar;

No documento que vai ligar à origem (documento de destino) teremos que dar

indicações de importação dos itens partilhados.

Tanto no ficheiro de origem como nos ficheiros de destino é necessário indicar a localização

(URL) do ficheiro de origem (o que contém a biblioteca partilhada) e a identificação do

elemento partilhado.

Page 59: Manual Flash

Animação 2D 59

|

São então colocados dois cenários possíveis:

Durante a edição de um filme são utilizados símbolos que residem numa biblioteca

partilhada;

Durante a execução de um filme é efectuado o download, por parte do Flash Player,

de símbolos que residem numa biblioteca partilhada.

5.7.8. Símbolos de outros Filmes

A incorporação de símbolos de outros filmes está assegurada através de compatibilidade entre

bibliotecas. Apesar desta compatibilidade, não existe nenhuma ligação (link) entre símbolos

de diferentes filmes, i. e., a edição 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) símbolo(s);

Os Símbolos da biblioteca do filme seleccionado ficam disponíveis, apesar da

indisponibilidade dos comandos do menu Options;

Arraste para o palco o símbolo desejado, criando assim uma instância; neste passo, o

novo símbolo é adicionado à biblioteca do nosso filme principal, mantendo o nome de

origem; para finalizar fechamos a janela da biblioteca.

5.8. Instâncias

A cada uma das ocorrências do símbolo no palco dá-se o nome de INSTÂNCIA.

Estas instâncias aparecem-nos apenas como referências ao símbolo. A mais-valia desta

abordagem reside no facto de não ser obrigatória que estas instâncias apresentem as mesmas

propriedades que o símbolo ou entre elas próprias.

Assim ao editar uma istância, não é afectado o símbolo associado, nem as outras instâncias

que dele derivaram. No entanto, as alterações efectuadas num determinado símbolo

reflectem-se em todas as instâncias dele derivadas.

Page 60: Manual Flash

Animação 2D 60

|

5.8.1. Criação de instâncias

As instâncias podem assumir comportamentos diferentes daquele que está estipulado para o

símbolo de onde derivam.

É ponto assente que, quando criamos determinado símbolo e definimos para ele um

comportamento específico, as instâncias que dele derivam vão herdar aquele

comportamento. No entanto, esta instância poderá assumir outros comportamentos

diferentes, i, e., é possível modificar um botão para imagem ou um clip de filme para um

botão e até uma imagem para um clip de filme. Logo que tal modificação ocorra, a instância

perde a funcionalidade advinda do comportamento do símbolo. A criação das instâncias é

muito simples:

Seleccione na Linha do tempo uma determinada camada:

As instâncias são colocadas sempre em frames chave; caso não esteja seleccionado um

frame chave, a instância será colocada no primeiro frame mestre à esquerda do

frame actual.

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

símbolos;

Arraste o símbolo para o palco.

5.8.2. Propriedades das instâncias

Através de diferentes valores associados à propriedade das instâncias, como por exemplo o

brilho, a transparência e a tonalidade, é possível obter variantes a partir de um mesmo

símbolo.

Para efectivar as alterações, não existe nenhum botão de OK é só alterar e verificar no palco

a modificação.

Rodar, inclinar ou redimensionar uma instãncia, bem como alterar o seu comportamento, são

outras das opçôes.

Através do menu Modify Transform Remove Transform, é possível desfazer as alterações

efectuadas ao nível do redimensionamento e das rotações.

Page 61: Manual Flash

Animação 2D 61

|

As propriedades das instâncias são alteradas através do inspector de propriedades nas quatro

áreas que compõem:

Symbol behavior - nesta área está definido o comportamento do símbolo de onde

deriva a instância e o nome dessa instância que funcionará como uma referência

(target) e poderá ser invocado na definição de determinadas acções;

Widht, Height - nesta área está definida a largura (W) e altura da instância (H), bem

como a sua posição horizontal (X) e vertical (Y):

No painel Info (Window Design Panels Info) é possível observar estas

propriedades.

Options of graphics - nesta área visualizamos qual o nome do símbolo associado á

instância; para além desta informação, temos nesta área mais opções:

o o botão Swap Symbols permite substituir o símbolo associado a uma instância;

ao efectuar um clique sobre este botão, acedemos à caixa de diálogo Swap

Symbol;

Page 62: Manual Flash

Animação 2D 62

|

o à direita do botão Swap, e consoante o tipo de símbolo associado à instância,

surgem-nos algumas características que nos ajudam a aperfeiçoar o

comportamento do objecto;

As opções são: loop, (repetição contínua de toda a sequência da animação da instância, pelos

frames que esta ocupa); Play Once (apenas uma repetição da sequência da animação a partir

do frame especificado); Single Frame (exibição de apenas um frame da sequência da

animação); First (define, para os três modos de produção atrás citados, o primeiro frame da

sequência de animação).

As opções são: Track as Button e Track as Menu Item e especificam a forma de reacção em

relação aos movimentos e cliques do rato.

Color - nesta área visualizamos as propriedades de cor associadas à instância:

o None – nenhuma cor;

o Brightness - ajustar a luminosidade da instância, numa escala que vai do preto

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

o Tint - aplicar sobre a instância uma determinada tonalidade: definir

percentagem da tonalidade; definir tonalidade através da introdução de

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

azul (Blue);

o Alpha – definir, a partir da caixa de diálogo Advanced

o Effect - os valores de vermelho, azul, verde e da transparência; as caixas de

texto à esquerda com as respectivas barras de controlo permitem reduzir uma

determinada percentagem dos valores de cores e/ou da transparência; as

caixas de texto à direita com as respectivas barras de controlo permitem

reduzir ou aumentar os valores das cores e ou da transparência por um valor

constante

5.8.3. Quebra de ligação das instâncias

Page 63: Manual Flash

Animação 2D 63

|

Caso deseje quebrar o elo de ligação entre a instância e o respectivo símbolo a ela associado,

de forma a alterar de raiz a sua composição(agora um conjunto de formas e linhas

desagrupadas) e sem que isto afecte o símbolo ou outras instâncias relacionadas:

seleccione a instância no palco;

invoque o comando Break Apart do menu Modify.

Caso o símbolo através do qual derivou a instância seja alterado após a quebra de ligação

entre ambos, tal facto não se repercute na instância em questão.

5.9. Um painel com história

Surgiu nesta versão do Flash uma novidade que de certeza vai agradar a muitos utilizadores: o

painel History (Window -> Other Panels -> History). Os passos executados durante a edição do

filme ficam gravados (são convertidos em javaScript) e à disposição do autor para os utilizar

no mesmo documento, noutros documentos da mesma sessão ou mesmo para serem invocados

posteriormente, através de comandos.

O painel é constituído 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 utilização; depois de dar o nome ao

comando na caixa de diálogo Save As Command, este fica disponível partir do menu

Commands;

repetir o(s) passo (s) seleccionados;

copiar o(s) passo (s);

Page 64: Manual Flash

Animação 2D 64

|

gravar passos como comandos para posterior utilização;

formas de visualização dos passos no painel;

limpar o histórico de passos no painel; esta operação não tem repercussões.

A ordem dos passos no painel não pode ser alterado. Por valor assumido, são cerca de100

passos que podem ser alvo de operações no painel History. Este valor pode variar entre 2 e

9999 e é configurado no painel Preferences (Edif -> Preferences) através do separador

General.

Para DESFAZER PASSOS com o painel History, basta deslocar o elevador até ao passo

pretendido.

A REPETIÇÃO DE PASSOS no mesmo documento é efectuado com o comando Replay. Para

efectuar a operação, seleccione o título do passo e arraste o rato até ao último passo

pretendido, sem utilizar a barra de deslocamento. Por último, clique no botão Replay.

Para seleccionar passos não adjacentes pode ser utilizada a tecla <Ctrl>.

Para COPIAR PASSOS ENTRE DOCUMENTOS processa-se da seguinte forma:

No documento que contém os passos a copiar, seleccionamos esse (s) passo (s) no

painel;

Clicamos no botão para copiar os passos;

Seleccionamos um objecto nom documento onde vão 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

opção Manage Saved commands para apagar ou renomear comandos e a opção Get More

commands que permite obter, via Internet (www. Macromedia.

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

disposição.

Page 65: Manual Flash

Animação 2D 65

|

6. Desenho de Objectos

6.1. Cor e transparência

O Fash utiliza dois métodos de descrição da cor: HSB e RGB.

O MÉTODO HSB em que Hue (tonalidade), Saturation (saturação) e Brightness

(brilho/luminosidade) descrevem as cores como um espectro contínuo. Os valoresda

TONALIDADE podem variar de Oº a 360º (número máximo de grus num círculo) e designam a

cor , definindo assim o grau de pureza do tom. A luminosidade da tonalidade é definida

através do BRILHO e varia de O% a 100%.

É também possível classificar determinada cor com o MÉTODO RGB. Estas três 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 são 255-177-

0.

Os valores RGB podem ainda ser convertidos em NÚMEROS HEXADECIMAIS (muito utilizado nas

páginas 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 número de cores para representar determinado objecto dá-se o nome de PROFUNDIDADE

DE COR (color depth). A profundidade de cores é expressa como o número de bits usados

Page 66: Manual Flash

Animação 2D 66

|

(valor binário) para representar a informação (cor) ou para identificar o número de cores que

o sistema suporta num determinado instante.

Imagine a seguinte animação: é noite e determinado farol incide o seu foco de luz sobre

edifícios de uma cidade, gerando um movimento rotativo. Apenas os edifícios sobre os quais

incide a luz deverão estar visíveis, ficando os restantes visíveis. Para podermos controlar a

visibilidade/transparência de objectos, utilizamos a propriedade ALPHA. O valor da

transferência pode variar de 0% (totalmente transparente) a 100% (totalmente opaco).

Outras abordagens à questão da transparência/visibilidade poderão ser feitas através da

manipulação da ordem das camadas e do preenchimento, ou não, dos objectos.

6.1.1. Painel Color Mixer

No Flash, bem como noutros tipos de programas mais ligados à parte de edição de imagens,

surgem mais vezes referidos os termos STROKE e FILLS. Em relação ao stroke, podemos pensar

nele como o traço ou o contorno do que é criado e que, por sua vez, irá ou não ter um

preenchimento (fill) com uma cor sólida ou com determinado gradiente ou mistura de cores.

Assim, as ferramentas para criação de formas ovais ou rectangulares podem, no Macromedia

Flash, criar apenas traços, apenas áreas preenchidas ou ambas as coisas.

O termo SHAPE (forma) designa gráficos vectoriais que, ao invés de serem formados por um

conjunto de pixels, contêm determinadas informações sobre, por exemplo, a localização,

dimensão e a cor da imagem.

Para criar e editar cores sólidas, utilizamos o painel Color Mixer do menu Window. Qualquer

escolha aqui definida é automaticamente aplicada ao objecto seleccionado no palco.

Page 67: Manual Flash

Animação 2D 67

|

1. cor do traço; efectue um clique no triângulo para escolher uma determinada cor;

2. cor do preenchimento; efectue um clique no triângulo para escolher uma determinada

cor ou gradiente;

3. tipo de preenchimento;

Existem vários tipos de preenchimento: a opção None não aplica nenhum preenchimento; a

opção Solid aplica ao objecto preenchimento com uma cor sólida; a opção Radial utiliza duas

cores, ficando uma no centro, ocorrendo uma transição suave para a cor que está posicionada

na periferia do objecto; a opção Bitmap permite aplicar um bitmap ao objecto; estes bitmaps

podem ser importados através da caixa de diálogo Import, ficando disponíveis no painel

Color Mixer.

4. cor por valor assumido (traço preto e preenchimento branco);

5. definir traço ou preenchimento transparente;

6. trocar cores do traço e do preenchimento;

7. barra de cores;

8. definir escala RGB ou escala HSB;

9. valores RGB ou HSB;

10. transparência da cor;

11. expandir painel.

Para criar CORES PERSONALIZADAS:

Efectue um clique no triângulo do traço ou preenchimento;

Carregue no botão Color Picker; depara-se com a caixa de diálogo Color;

1

2

3

4, 5 e 6

Page 68: Manual Flash

Animação 2D 68

|

Arraste o cursor pelo espectro de cores de forma a seleccionar a cor sólida ou insira

valores nas caixas de texto;

Controle o nível de luminosidade;

Carregue no botão Adicionar às cores personalizadas de forma a adicionar esta nova

cor a uma das 16 caixas à personalização; a partir de agora poderá utilizar esta cor

para o traço ou preenchimento.

6.1.2. Gradientes

OS GRADIENTES resultam da transição mesclada de duas ou mais cores. Podem ser utilizados

para criar determinados efeitos visuais, como por exemplo profundidades e sombras.

Não 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 relação a uma cor sólida.

Basicamente existem dois tipos de gradientes:

Page 69: Manual Flash

Animação 2D 69

|

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;

Através do selector de cor, escolha uma outra cor para o ponto; ocorrerá uma

transição entre o ponto criado e o ponto logo à esquerda;

Introduza se necessário mais pontos de gradiente;

Desloque os pontos para modificar a distribuição 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 própria.

Apesar de a informação estar contida no ficheiro de suporte do filme, não afecta o respectivo

tamanho. A paleta padrão do Flash è a paleta de 216 cores ajustadas á web (Web 216).

O número de cores que podemos definir para um determinado filme é limitado

Apenas pela profundidade de cor do sistema.

Existem dois formados de importação/exportação de paletas suportados pelo

Flash:

.clr para Windowsl.fclr para Macintosh: importação/expotação das cores sólidas e

dos gradientes, mas apenas entre ficheiros do Macromedia Flash;

.act é um formato que apenas importa/exporta as cores sólidas, não suportando os

gradientes; apesar desta limitação, este formato é suportado por outros programas,

como o Fireworks e o Adobe Photoshop.

Page 70: Manual Flash

Animação 2D 70

|

Ao importar imagens do formato. GIF, pode importar as paletas associadas, mas não os

ingredientes.

Para exportar, importar e modificar a paleta de cores de um filme do Flash,Utilizamos o

painel Color Swatches.

6.2. Personalização das ferramentas de desenho

Invocamos o comando Preferences, do menu Edit, deparamo-nos com a caixa de diálogo

Preferences e com o separador Editing, com diversas opções 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 estão as ferramentas que podemos escolher através de Cliques;

2. View – zona com ferramentas que nos permitem modificar a área visível do ambiente

de edição;

3. Colors – área onde escolhemos quais as cores a aplicar aos traços e preenchimentos;

4. Options- área de acesso a modificadores específicos de ferramenta activa,que

permitem várias opções de desenho.

Page 71: Manual Flash

Animação 2D 71

|

No que diz respeito às ferramentas que nos permitem modificar a área visível do ambiente

de edição (zona 2 da barra de ferramentas), temos:

HAND (mão) – esta ferramenta permite que o utilizador se movimente facilmente pela

área de trabalho, bastando para tal manter premido o botão do rato, arrastando o palco em

qualquer direcção 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> Também 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

visualização do palco.

ARROW (seta)- esta é provavelmente a ferramenta mais utilizada no Flash; com ela

podemos seleccionar, mover, e redimensionar objectos.

Page 72: Manual Flash

Animação 2D 72

|

Modificadores da ferramenta ARROW:

Snap to Objects – permite alinhar os objectos editados, entre si ou em relação ao

palco; ao mover determinado objecto para alinhar, temos como referência um anel de

encaixe; para indicar que dois pontos podem ser alinhados com precisão, 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 através do comando Edit Snap Align,

é possível definir (em pixels) a tolerância da distância de alinhamento dos objectos.

Smooth- reduz irregularidade e o número de segmentos numa curva, dando uma noção

de continuidade a linhas e formas simples;

Invocando o comando Optimize do menu Modify -> Shape, deparamo-nos com a caixa de

diálogo Optimize Curves, onde poderão ser definidas suavizações para as linhas curvas e para

os contornos associados aos preenchimentos. A opção Use multiple passes (slower) maximiza o

processo de suavização; a opção Show totals message permite exibir uma caixa de alerta com

a informação acerca da optimização relacionada com o processo de suavização.

Este processo de suavização contribui ainda para a diminuição do tamanho do documento e do

filme .swf.

Straighten – permite endireitar círculos, ovais, quadrados, rectângulos, triângulos e arcos

desenhados em formas geometricamente perfeitas;

As opções Smooth e Straighten não actuam à partida sobre grupos, texto, símbolo e bitmaps.

Para que tal aconteça, necessitamos de aplicar sobre estes elementos o comando Break Apart

do menu Modify.

SUBSELECT (subselecção) - esta ferramenta permite modificar os ângulos, as direcções e

os comprimentos associados aos segmentos rectilíneos e curvos dos objectos , através da

manipulação dos pontos âncora.

Mantendo pressionada a tecla < Shift> enquanto arrastamos, permite restringir o ângulo

associado a múltiplos de 45º.

Para ajustar um segmento rectilíneo, seleccionamos esse segmento com a ajuda da

ferramenta Subselect; arrastar um ponte âncora para uma nova posição.

Page 73: Manual Flash

Animação 2D 73

|

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 botão do rato. Assim, logo que

escolhemos a ferramenta e até libertamos o rato, pode-mos (re)definir sucessivamente a

direcção da linha ou o ângulo associado

Mantendo pressionada a tecla <Shift> enquanto desenhamos a linha, permite restingi-la a uma

direcção vertical, horizontal ou com um ângulo de 45º.

LASSO (laço)- esta ferramenta permite seleccionar objectos, à mão livre ou através 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 definições da opção Magic wand; na caixa

de diálogo Magic wand Settings, podemos definir qual a tolerância em relação à cor de

pontos adjacentes (Threshold), i e., um valor igual a O selecciona apenas pontos

adjacentes com cor exactamente igual, enquanto o valor máximo 100 selecciona todos

os pontos; podemos ainda definir a tolerância no que diz respeito ao limite da área

colorida seleccionada Smoothing;

Polygon – permite seleccionar determinada área através de linhas rectas.

Para SELECCIONAR ÁREAS À MÃO LIVRE, seleccione a ferramenta Lasso e prima o botão do

rato, arrastando o cursor ao longo da área.

Page 74: Manual Flash

Animação 2D 74

|

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

Polygon, efectue um clique para definir o ponto de início, posicionando depois o cursor ponto

de destino e efectuando aí um clique; para fechar a área, efectue um duplo clique.

Para SELECCIONAR ÁREAS ATRAVÉS DE LINHAS RECTAS E À MÃO LIVRE, seleccione a

ferramenta Lasso E O MODIFICADOR Polygon; para efectuar um segmento à mão 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 início e de destino; para fechar a área, efectue

um duplo clique.

PEN (caneta) – esta ferramenta permite desenhar linhas rectas ou trajectórias curvilíneas

com grande precisão, manipulando os ângulos associados.

Mantendo pressionada a tecla <Shift> enquanto desenhamos a linha, permite restringir o

ângulo associado a múltiplos de 45º.

Para DESENHAR CURVAS com esta ferramenta:

Seleccione a ferramenta;

Especifique cores para o traço e o preenchimento através do inspector de

propriedades;

Posicione o cursor no sítio onde quer iniciar a curva e arraste a cabeça de leitura de

forma a definir uma direcção; 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 concluído o trabalho, deverá seleccionar uma nova ferramenta ou invocar

o comando Deselect All do menu Edit.

TEXT (texto) – é através 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 botão do rato. Assim lobo que

Page 75: Manual Flash

Animação 2D 75

|

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 proporções de um círculo perfeito.

RECTANGLE (rectângulo) – esta ferramenta permite desenhar objectos rectangulares.

Mantendo pressionada a tecla <Shift> enquanto desenhamos o objecto, permite criar formas

com as proporções de um quadrado perfeito.

PENCIL (lápis) – esta ferramenta permite desenhar linhas em três modos de desenho.

Mantendo pressionada a tecla <Shif> enquanto desenhamos as linhas, restringimo-las a uma

posição vertical ou horizontal.

BRUSH (pincel) – esta ferramenta permite criar traços que se assemelham a pinceladas.

Mantendo pressionada a tela <Shft> enquanto desenhamos as pinceladas, restringimo-las a

uma direção vertical ou horizontal.

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

redimensionar, inclinar, desfigurar e distorcer) determinados objectos.

Símbolos, bitmaps, vídeos, sons, gradientes, grupos de objectos e texto não 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 direcção 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 sólidas podem ser aplicadas aos contornos e não gradientes ou bitmaps.

Page 76: Manual Flash

Animação 2D 76

|

PAINT BUCKET (balde de tinta) – esta ferramenta permite colorir áreas vazias ou

delimitadas (com cores sólidas, gradientes ou bitmaps), podendo também alterar a cor já

existente num determinado objecto.

Mantendo pressionado a tecla <shift>, podemos restringir a direcção do preenchimento do

gradiente a múltiplos 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. TÉCNICAS DE ANIMAÇÃO

7.1. Cenas

A divisão da animação em CENAS vem facilitar a organização do conteúdo do filme, já que

podemos dividi-lo de uma forma mais versátil 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, não acha? Então, porque não dividir todo aquele conteúdo em

pequenas secções, como se de minifilmes interligados se tratassem?

Apesar das vantagens desta abordagem, esta torna-se contraproducente em filmes

interactivos onde abundem variáveis e acções de preoading. Nestes casos, é preferível uma

de duas abordagens: manter um único filme ou criar diversos filmes, garantindo a

interactividade e a interligação através de programação (por exemplo, com LoadMovie).

PARA CRIAR UMA CENA:

Invoque o comando Scene do menu Insert ou carregue no botão Add scene do painel

Scene;

Page 77: Manual Flash

Animação 2D 77

|

Repare que os nomes por valor assumido são do tipo Scene “x”, onde o “x” representa

o número da cena criada; ao clicar na cena, passamos automaticamente para o frame

1 da Linha do tempo.

7.2. Animação frames-by-frame

O frame-by-frame é um tipo de animação tradicional nos estúdios de animação. Consiste na

alteração do conteúdo em frames consecutivos, gerando assim a ilusão da animação e do

movimento. Partindo de um frame, altera-se o conteúdo (adicionado, removendo ou

reorganizando elementos) no instante temporal seguinte, volta-se a editar o conteúdo num

outro instante temporal e assim sucessivamente. É claro que o conteúdo só pode ser editado

em frames - chave...

É um processo em que o utilizador tem um elevado grau de controlo sobre a animação

(quando comparado com a animação interpolada), é mais lento na edição e aumenta

consideravelmente o tamanho do ficheiro. Deverá ser utilizado apenas quando estritamente

necessário em movimento algo complexos, delicados e rápidos. A animação frame-by-frame

pode ocorrer conjugada com os restantes tipos de animação… desde que cada um esteja em

camadas diferentes.

Para CRIAR UMA ANIMAÇÃO 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;

Faça do frame seguinte um frame mestre; repare que o conteúdo do novo frame

mestre é igual ao do anterior;

Page 78: Manual Flash

Animação 2D 78

|

Altere o conteúdo deste frame (por exemplo, com as ferramentas de desenho) com o

intuito de incrementar o processo de animação.

Repita os 2 passos anteriores até completar a sequência da animação;

Não se esqueça de reproduzir a animação frequentemente para despistar qualquer problema

e verificar o comportamento.

Quando terminada a sequência, reproduza a animação através do comando Play do menu

Control ou carregando directamente no botão Play do Controlador.

7.3. Animação interpolada (tweening)

O termo tweening deriva de frame in between, i.e., frames intermédios. O Flash facilita-nos

a vida no que diz respeito à criação de animação que consiste em alterações de movimento,

de tamanho, de rotação, de forma ou de cor, já que nos basta definir os frames inicial e

final, sendo criados automaticamente pelo Flash os frames intermédios.

É um processo em que o utilizador tem um grau de controlo relativo sobre a animação

(quando comparado com a animação frame-by-frame), é mais rápido na edição e minimiza o

tamanho do ficheiro, já que armazena apenas os valores associados às alterações efectuadas

entre os frames. É utilizado em movimentos fluidos e suaves, e, transições e em efeitos do

tipo morphing. A animação interpolada pode ocorrer conjugada com os restantes tipos de

animação… desde que cada um esteja em camadas diferentes.

7.3.1. Interpolação de formas (shape tweening)

Neste tipo de animação interpolada, um objecto é transformado noutro, fruto das alterações

incrementais automaticamente efectuadas pelo Flash, tendo como referência os conteúdos

dos frames inicial e final definidos pelo utilizador.

Instâncias de símbolos, bitmaps e grupos não são contemplados por este tipo de animação, a

não ser que sobre eles invoque o comando Break Apart do menu Modify.

O tamanho, a forma, a cor, a transparência e a localização dos objectos são os atributos

interpoláveis. Como os frames intermédios são criados automaticamente pelo Flash, podem-

se obter resultados que não são propriamente os mais desejados. Para colmatar este tipo se

Page 79: Manual Flash

Animação 2D 79

|

situações, podemos utilizar REFERENCIAS DE FORMAS, que sustentam uma interpolação mais

personalizada e aperfeiçoada.

O Flash permite interpolar diversas formas numa mesma camada, mas a experiência

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 opção Shape

(interpolação de forma); na barra de controlo Ease, arraste a seta para definir a

atenuação da transição no início ou no fim da sequência, i.e., a taxa de alteração entre os

frames interpolados (entre os valores -1 e -100 a interpolação inicia-se gradualmente e

acelera no fim da animação, enquanto que entre os valores 1 e 100 a interpolação se

inicia rapidamente para dar lugar a uma desaceleração no final da animação); o tipo de

mesclagem/mistura, Blend, pode ser distributiva (Distributive), que consiste em tornar as

Page 80: Manual Flash

Animação 2D 80

|

formas intermédias mais suaves e mais irregulares, ou do tipo angular (Angular), que se

aplica em formas intermédias onde se queiram preservar os ângulos e as linhas rectas;

Crie um segundo frame mestre que represente o final da animação e aqui seleccione o

objecto; modifique-lhe a forma, cor ou posição ou apague-o e substitua-o por uma

outra forma;

Repare que o Flash criou automaticamente os frames intermédios;

Reproduza a animação através do comando Play do menu Control ou carregando

directamente no botão Play do Controlador.

Interpolação de movimento (motion tweening)

Este tipo de animação permite interpolar a rotação, o tamanho, a localização, a cor, a

transparência e a inclinação dos objectos. Apenas um objecto por camada pode conter

interpolação de movimento.

Símbolos, grupos e blocos de texto são contemplados por este tipo de animação. Para

interpolar a cor de grupos e de texto, há que convertê-los primeiro em símbolos.

Page 81: Manual Flash

Animação 2D 81

|

Já reparou com certeza em alguns Web sites com transições espectaculares… pois bem, foram

realizados utilizando o Flash e este tipo de animação. Isto porque, como veremos explicado

mais adiante, no Flash é possível interpolar movimento ao longo de uma trajectória não

linear.

Existem dois métodos para criar este tipo de animação: através da opção Motion do Inspector

de propriedades ou através 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 instância de

um símbolo;

Crie um segundo frame mestre que represente o final da animação e seleccione o

frame imediatamente anterior;

Neste frame seleccionado efectue uma destas três operações: desloque o objecto para

uma nova posição; altere a dimensão, a rotação ou inclinação do objecto; modifique-

lhe a cor;

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

No Inspector de propriedades escolha na caixa de menu pendente Tween opção

Motion (interpolação de movimento); a validação da opção Scale permite uma

interpolação referente ao tamanho; na barra de controlo Ease, arraste a seta para

definir a atenuação da transição no início ou no fim da sequência, i.e., a taxa de

alteração entre os frame interpolados (entre os valores -1 e -100, a interpolação

inicia-se gradualmente e acelera no fim da animação, enquanto que entre os valores 1

e 100 a interpolação se inicia rapidamente, para dar lugar a uma desaceleração no

final da animação); na caixa de menu pendente Rotate, define-se o tipo de rotação do

elemento (a opção None não aplica rotação; a opção Auto corresponde a uma

movimentação mínima; a opção CW para rodar no sentido horário e CCW para o

sentido anti-horário) e na caixa de texto o respectivo número de ciclos de rotação; a

validação da opção Orient to path permite orientar a linha de base do elemento em

relação à trajectória; a validação da opção Sync assegura a sincronização dos objectos

com a Linha do tempo; a validação da opção Snap encaixa automaticamente o ponto

de registro do elemento à trajectória.

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

Page 82: Manual Flash

Animação 2D 82

|

Desenhe num frame mestre vazio um objecto ou arraste para o palco uma instância de um

símbolo;

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 símbolo com o nome Tween 1 (todos os objectos

criados desta forma recebem o nome genérico Tween “x”).

Efectue um clique no frame que representa o final da animação; neste frame

seleccionado desloque o objecto para uma nova posição ou ajuste-lhe o tamanho e a

rotação;

Na barra de controlo Ease, arraste a seta para definir a atenuação da transição no

início ou no fim da sequência, i.e., a taxa de alteração entre os frames interpolados

(entre os valores -1 e -100, a interpolação inicia-se gradualmente e acelera no fim da

animação, enquanto que entre os valores 1 e 100 a interpolação se inicia rapidamente,

para dar lugar a uma desaceleração no final da animação); na caixa de menu pendente

Rorate, define-se o tipo de rotação do elemento (a opção None não aplica rotação; a

opção Auto corresponde a uma movimentação mínima; a opção CW para rodar no

sentido horário e CCW para o sentido anti-horário) e na caixa de texto o respectivo

número de ciclos de rotação; a validação da opção Orient to path permite orientar a

linha de base do elemento em relação à trajectória; a validação da opção Sync

assegura a sincronização dos objectos com a linha do tempo; a validação da opção

Snap encaixa automaticamente o ponto de registo do elemento à trajectória.

Reproduza a animação através do comando Play do menu Control ou carregando

directamente no botão Play do Controlador.

Qualquer movimentação dos objectos nos frames mestres ou qualquer alteração do número

de frames será correspondida por um ajuste automático da interpolação por parte do Flash.

7.4. Distribuir objectos pelas camadas

Imagine o que seria distribuir manualmente inúmeros objectos, indevidamente criados numa

só camada, por vários layers. Para resolver este processo de uma forma automática,

recorremos ao comando Distribute to Layers a partir de Modify Timeline. Eis os passos a

executar:

Page 83: Manual Flash

Animação 2D 83

|

Seleccione os objectos a distribuir; estes objectos poderão estar todos colocados na mesma

camada ou inclusive em camadas não contíguas;

Invoque o comando Distribute to Layers; pode em alternativa efectuar um clique com o

botão 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 possível definir no Flash uma ou mais camadas cujo conteúdo servisse de

trajectória para diversos objectos do nosso filme? Pois bem, isto está contemplado através

das CAMADAS GUIA DE MOVIMENTO (GUIDE LAYERS).

As camadas guia ficam ocultas nos filmes publicados.

As camadas guia podem actuar sobre interpolação de movimento, mas não sobre interpolação

de formas. Numa cena poderá existir múltiplas camadas guia de movimento. Por sua vez,

várias camadas podem estar vinculadas (guide layers) à mesma camada guia de movimento.

Apesar de não ser possível aplicar camadas guia sobre interpolação de formas, p Flash suporta

um efeito similar: as REFERÊNCIAS DE FORMA, abordadas no âmbito da animação complexa.

Para CRIAR UMA CAMADA GUIA DE MOVIMENTO:

Efectue um clique no botão 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;

Page 84: Manual Flash

Animação 2D 84

|

Convém posicionar todas as camadas guia no fim da ordem das restantes camadas,

para que não se arraste por engano uma camada, tornando-se assim numa camada

vinculada à camada guia de movimento (explicando mais adiante no capítulo da

animação interpolad).

Para desvincular as camadas em relação às guias de movimento, basta colocá-las

acima das guias ou invocar a caixa de diálogo Layer Properties (a partir de Modify

Timeline) e aí escolher a opção Normal.

Utilize uma ferramenta de desenho para desenhar a trajectória;

Todas as ferramentas de desenho e pintura podem ser utilizadas para definir a

trajectória … excepto a ferramenta Text. Se utilizar as ferramentas Oval ou

Rectangle, deverá seleccionar a opção No Color para o preenchimento.

Efectue um clique no frame que representa o final da animação; invoque o comando

Keyframe a partir de Insert Timeline; o objecto que representa a trajectória ficará

assim estático no intervalo definido;

Invoque o comando Keyframe a partir de Insert Timeline na camada que contém o

objecto que vai descrever a trajectória;

Page 85: Manual Flash

Animação 2D 85

|

Apesar de não ser obrigatório este frame mestre coincidir no tempo com o frame

criado no ponto 3, este último deve estender-se para além do frame mestre da

camada vinculada.

Ainda com este último frame seleccionado, arraste o objecto a movimentar para a

posição final da trajectória; para o objecto se cingir à trajectória, pode activar o

botão Snap to Objects;

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

movimentar par a aposição inicial da trajectória (Figura 6.14);

Por valor assumido, o Flash começa o movimento a partir do início da trajectória definida na

camada guia, mas esse começo poderá não coincidir com o nosso propósito. Para que não

ocorram saltos bruscos tanto no início como no fim da trajectória, habitue-se a definir as

posições inicial e final do objecto um pouco desfasadas do início e fim da trajectória.

Efectue um clique num qualquer frame da camada vinculada e invoque o comando Create

Motion Tween a partir de Insert Timeline;

Reproduza a animação através do comando Play do menu Control ou carregando

directamente no botão Play do Controlador.

Algumas CONSIDERAÇÕES 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 não comportamentos irreais e absurdos; deverá

assim ter algum cuidado e ponderação na aplicação das guias de movimento;

Atenção às guias de movimento que vinculam mais do que uma camada e, assim, vários

objectos; os pontos de partida e final da trajectória destes objectos poderão não coincidir;

Se animar vários objectos ao mesmo tempo com as guias de movimento, tenha atenção para

que as respectivas trajectórias não conduzam a choques ou efeitos inesperados de

sobreposição;

Para que não ocorram saltos bruscos tanto no início como no fim da trajectória, habitue-se a

definir as posições inicial e final do objecto um pouco desfasadas do início e fim da

trajectória; há ainda quem estenda a trajectória da guia de movimento para alem dos limites

d palco;

Caso a trajectória 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 não

ocorra, as camadas guias de movimento deverão estar bloqueadas;

Page 86: Manual Flash

Animação 2D 86

|

Caso a trajectória de um objecto cuja camada está vinculada seja em linha recta e não siga a

trajectória da guia de movimento previamente definida, isto significa que o objecto não foi

encaixado (snap) à trajectória da guia; não se esqueça deste pormenor e do botão Snap to

Objects;

Caso determinada camada não esteja devidamente vinculada a uma guia de movimento,

poderá utilizar a caixa d diálogo Layer Properties e a opção Guided.

PARTE 3

Conclusão

Page 87: Manual Flash

Animação 2D 87

|

7.5.1. Parte 3 - Conclusão

Page 88: Manual Flash

Animação 2D 88

|

Conclusão

Este manual de formação, seguindo um estilo prático e directo, permite conhecer as

principais potencialidades do Flash MX.

Page 89: Manual Flash

Animação 2D 89

|

Bibliografia

Internet www.pc-cuadernos.com – Flash MX.

Flash MX 2004 – Pedro Cid Ferreira, FCA – Editora de Informática.