Movimentos suaves (parte 1)…

Começaremos agora uma parte que eu já considero mais do que iniciante e, assim sendo, alguns passos que vimos e revimos nos tutoriais anteriores eu apenas explicarei. Mas caso alguém tenha alguma dúvida, é só postá-la que eu deixo a explicação aqui, ok? Então, vamos lá!

Vocês já notaram que todos os movimentos que aprendemos até agora são meio esquisitos, um pouco “robóticos”? Pois é, quem não notou, vai notar no final desse tutorial ;-)
Hoje vamos aprender a deixar os movimentos mais suaves, mais reais!
Como exemplo desse tutorial, iremos criar um pêndulo, como daqueles relógios antigos de sala.

Na linha do tempo da cena principal, crie um pêndulo como o da figura ao lado. Lembre-se de usar os gradientes de cores para dar um aspecto arredondado em seu desenho.

Com o desenho pronto, selecione-o por completo e crie um novo movie clip (atalho F8), nomeando-o penduloFora.

Assim que você criar o movie clip penduloFora, dê um duplo clique em cima dele. Você entrará na área de seleção do movie clip. Selecione todo o desenho novamente e crie um novo movie clip de nome penduloDentro.

Note: criamos um movie clip penduloFora e dentro dele um outro, penduloDentro. Isso é extremamente importante, uma vez que um movie clip dentro de outro será uma coisa trivial em vários tutoriais futuros.

Agora, pegue a ferramenta de transformação livre (free transform tool) e selecione o movie clip penduloDentro. Note que a flecha está indicando o centro de rotação de seu movie clip (trata-se de um pequeno círculo branco). Clique nele e arraste até o meio da parte superior do movie clip penduloDentro.

Note que a flecha vermelha agora está indicando onde você deve deixar o seu ponto de registro.

Agora iremos começar a trabalhar :D
Com o penduloDentro selecionado, abra o painel Scale and Rotate em Modify > Transform > Scale and Rotate… ou utilize o atalho Ctrl + Alt + S. Deixe a escala em 100%, mas rotacione o movie clip em 45º. Faça isso tudo no frame 1 da camada pendulo do movie clip penduloFora.

Crie um novo keyframe no frame 60 (atalho: F6).

Crie outro keyframe no frame 30 e selecione o movie clip penduloDentro. Agora iremos rotacionar o pêndulo para a outra extremidade, a direita. Como rotacionamos ele 45º para a esquerda, o ideal seria rotacionar 45º para a direita, certo? Errado! Seria 45º para a direita se ele ainda estivesse no centro, mas como já movimentamos ele para a esquerda precisamos somar esses 45º para ele voltar para o centro mais os 45º para a direita. Então são 90º para a direita. E como fazemos isso? Simplesmente colocando um sinal de menos (-) na frente desses 90º, como indicado na figura ao lado.

Assim deve ficar seu penduloDentro no frame 30 da linha do tempo (timeline) do movie clip penduloFora.

Agora, mandamos o flash fazer o trabalho duro! Selecione alguns frames entre o 25 e 35 mais ou menos, clique com o botão da direita do mouse sobre eles e selecione Create Motion Tween.

Teste sua animação e veja como ficou. Agora você consegue perceber que o movimento é meio robótico? Percebe que um pêndulo não se move assim na vida real? Pense em como você fecha uma porta… a velocidade é constante desde o momento que você começa a fechar até o momento em que você encosta a porta e realmente a fecha? Faça esse teste no meio da noite e seus familiares ou vizinhos irão adorar! hahahaha
Bom, aprenderemos a melhorar isso na outra parte desse tutorial ;-)
Até mais!
/>

  • Share/Bookmark

7 Responses

  1. Seus tutoriais são ótimos, estou ficando fera em flash.Obrigada

    edna
    Não some não.

  2. Olá Edna,

    É bom saber que você está aprendendo bastante!
    Bom, sumir, eu não vou, mas estou ficando com o tempo um pouco curto pra me dedicar ao Aprendendo Flash, mas logo mais postarei alguma coisa nova e útil a todos!!!
    Até mais!

  3. OI, so estou com duvida em como se faz a gradiencia de cor…. vc poderia me explicar ?? vlw

  4. Olá Thiago,

    Acho que suas dúvidas podem ser tiradas no tutorial abaixo ;)

    http://aprendendoflash.blogspot.com/2007/01/degrad-em-cilindros.html

    Caso ainda reste alguma dúvida, por favor, me escreva novamente!
    Até mais!

  5. Entao… eu vi o tutorial que vc me passo… so naum intendi uma coisa:

    1° quando eu pego a ferramenta de gradiencia de cor ( um mouse pequeno fica) eu clico na figura e nao acontece nada, tem q transforma pra simbol ??

  6. Olá Thiago!

    Desculpe a demora para responder…
    Bom, vamos ao seu problema: se você quer mudar a cor de um objeto, por exemplo um retângulo, clique nele uma vez. A partir daí você pode abrir a caixa “Color Mixer” (Shift+F9) e selecione um gradiente. Não é necessário que transforme em símbolo nesse caso…
    Veja se assim funciona e qualquer coisa volte a me escrever.
    Até mais!

  7. [...] seria interessante vocês repassarem pelos tutoriais: Transformação… Movimentos suaves (parte 1 e parte 2)… Criando uma [...]

Leave a Reply

BlogBlogs.Com.Br | Technorati Profile