Escola Superio r de Arte e Design Informática

Como fazer um Motion Guide

1º Passo – Depois de abrirmos o Flash e de termos o palco de trabalho disponível,

temos de inserir um símbolo do tipo Gráfico, para isso temos de ir a menu Insert
> New Symbol

Depois aparecerá uma nova janela e nessa janela vamos escolher a opção Graphic,
nesta janela podemos ainda escolher o nome que queremos dar a este objecto,
Esta opção é muito útil quando criamos muitos objectos, podemos distingui-los
melhor usando nomes apelativos ao que criamos

Assim que clicamos no OK, o ambiente do Flash muda ligeiramente, visto estarmos
a trabalhar apenas na animação do objecto que estamos a criar, neste ambiente
podemos criar uma animação ou desenhar apenas uma bola, isto é, podemos no
modo de edição, criar uma animação com vários Layers, porque isso não
influenciará no final o objecto a deslizar pela linha, linha esta que criaremos mais à
frente, visto que quando colocamos este objecto a deslizar ele deslizará como um
todo e não pelas partes que o constituem.

Desenhamos então o objecto:

Se ao arrastarem a bola, ela ficar como no exemplo acima, ou seja, que “perca os
limites”, têm duas opções, ou tentam novamente para deslizarem o objectos com o
os contornos/limites ou eliminam os limites, para isso seleccionam os limites e
eliminam, clicando no Delete.

Marco Silva 22-01-2005 Página 1 de 7

Escola Superio r de Arte e Design Informática

Depois tentam centrar o mais possível o objecto do centro do palco. Deste novo
palco onde estamos a criar o objecto. Para vos facilitar a vida podem ir ao menu
Window > Design Panels e Align

Na nova janela clicam e m

E com isto temos o nosso objecto elabora do, com mais ou menos qualidade, serão,
vocês a decidirem o que querem. Neste momento vamos passar para o palco
principal do Flash, ou seja, para a Scene1, e é nesta Scene1 que têm todas as
vossas Layers e Motion Guides. » Dica: podem ter mais do que uma Scene.

Para voltarem ao palco da Scene1 vão clicar em:

Marco Silva 22-01-2005 Página 2 de 7

Escola Superio r de Arte e Design Informática

Neste momento têm tudo a branco, como se nunca tivessem feito nada, mas na
verdade o vosso objecto ficou guardado na Library. Iremos lá mais tarde.

2º Passo – Vamos agora criar o Layer do Motion Guide e desenhar a linha por
onde passará o nosso símbolo que no nosso caso é uma bola.

Inserir Layer de Motion Guide:

E irá ficar assim:

3º Passo – Vamos agora inserir as KeyFrames, definir o tempo que animação vai
demorar e desenhar a linha da Motion Guide que guiará o percurso da nossa bola.

Suponhamos que a nossa animação vai durar 25 frames, vamos então colocar o
rato na frame 25 do timeline da Layer do Motion Guide e pressionar a tecla F6, e

Marco Silva 22-01-2005 Página 3 de 7

Escola Superio r de Arte e Design Informática

vamos fazer o mesmo para o Layer “normal”, ou seja, para o Layer onde vamos
colocar a bola. Devemos ficar com este aspecto:

Bem, de seguida vamos criar a linha, isto é, o caminho por onde a bola irá seguir.
Para isso vamos clicar com o rato na frame 1 do Layer do Motion Guide, depois
vamos escolher a ferramenta lápis ou uma linha ou o que quisermos.

Vamos então agora desenhar o percurso que a bola irá percorrer:

Marco Silva 22-01-2005 Página 4 de 7

Escola Superio r de Arte e Design Informática

4º Passo – Falta-nos agora inserir a bola na Layer e fazê-la andar pelo caminho
que desenhamos. Vamos então activar a janela Library, para isso vamos ao menu
Window > Library :

Depois na janela Library vamos buscar a nossa bola. Para a inserirmos no palco,
temos de a seleccionar e arrastá-la para dentro do palco, mas há um pormenor
importante, temos de seleccionar a frame 1 do timeline mas do Layer1, deverá ser
este o nome caso não tenha sido alterado.

Agora basta sincronizar o centro da bola, cuja deverá ter um mini rectângulo no
centro, ou seja, temo de sincronizar o centro da bola com o inicio da linha.

Marco Silva 22-01-2005 Página 5 de 7

Escola Superio r de Arte e Design Informática

Agora vamos criar a frame do fim, para isso, vamos seleccionar a frame 24 do
timeline respeitante ao Layer 1 e pressionar F6, isto vai-nos criar uma nova
KeyFrame, o resultado será igual à Frame1 do mesmo Layer. Nesta frame vamos
mover a bola do início para o fim, ou seja, vamos colocar a bola no final da linha,
temos novamente de colocar o meio da bola, aquele mini círculo branco que
aparece quando seleccionamos a bola com o fim da linha.

Se tudo estiver bem feito até agora, na frame 1 do Layer 1 temos a nossa bola no
início da linha e na frame 24 temos a bola no fim da linha.

5º Passo - Para terminar, temos de inserir o Efeito Tweening. Para isso, vamos
seleccionar a frame 1 do Layer 1 e nas propriedades, vamos inserir os seguintes
valores:

Podemos ainda colocar uma acção de Stop na frame 24 ou 25 do Layer 1, dependo

do que quiserem, se colocarem a acção de Stop na frame 24 a bola ficará parada
mas visível, se colocarem na frame 25 a animação parará na mesma mas a bola
desaparecerá, porque na frame 25 não temos nada visível. Para isso seleccionamos
a frame 24 ou 25 e depois vamos às acções. Neste caso será uma acção que estará
na categoria do Timeline Control:

Marco Silva 22-01-2005 Página 6 de 7

Escola Superio r de Arte e Design Informática

Para vermos a nossa animação, podemos clicar em F12 e abrir-se-á uma página do
Internet Explorer com a nossa animação.

ATENÇÃO:

Este exemplo serve quando queremos fazer determinado objecto movimentar-se

seguindo uma “rota”, porque caso queiramos apenas fazer mover um objecto de
uma lado para o outro, basta criar uma Keyframe (F6) no Layer 1 na frame 25, isto
se quisermos este tempo para esta animação. Depois vamos à frame 1 introduzir o
nosso símbolo caso tenha sido já criado, ou então desenhamos um, na frame 1. De
seguida vamos à seleccionamos a frame 24 e pressionamos F6 para criar uma nova
Keyframe.

Na frame 24 arrastamos o nosso objecto, seja ele qual for e depois colocamo -lo
onde queremos que o objecto vá parar. Resumindo, na frame 1 temos o objecto no
início e na frame 24 o objecto no fim.

Depois basta ir inserir o efeito de Tweening. Temos de fazer o que fizemos

anteriormente, seleccionar a frame 1 da Layer e nas propriedades colocar o
seguinte:

Caso queiramos que a animação pare no final, basta colocar uma acção de Stop.

FIM

BOA SORTE A TODOS…

Marco Silva 22-01-2005 Página 7 de 7