Conheça o Plugfeed | » Início » Desenvolvimento » Flash » Animando e Animando 2
Conheça o Plugfeed | » Início » Desenvolvimento » Flash » Animando e Animando 2 -->
 
Avaliação: | Publicado em: 09/01/2007
Animando e Animando 2
Daniel Doria é formado em Design pela Universidade Tiradentes, e Pós-Graduado em Animação pela PUC-Rio e trabalha com animação e design para web e midias digitais há 4 anos. Atualmente trabalha com Design e Animação para EAD na Universidade Federal de Sergipe, e Design e Animação para a TV IURD.
Animando e Animando 2

Daijobu mina-san!!! Demorei mas estou de volta, sabe como é, mudança é algo muito chato. Mas vamos ao que interessa; no último artigo, nós vimos alguns princípios de animação aplicados no flash (Tempo, peso, alongamento, achatamento, etc...). Agora vamos continuar com esses princípios e com a física, para nos ajudar com novos objetos.

 Hoje vamos trabalhar com o movimento em arco e inércia, que pode fazer parte de uma animação secundária (o cabelo de uma personagem que balança enquanto ela corre), dando a ela mais elegância e dinamismo.
Vamos começar desenhando um pêndulo e transformando em símbolo gráfico setando o eixo, a área de registro, na parte superior central e numa camada abaixo vamos desenhar a base que segura o pêndulo. Ou seja, temos uma esfera ligada a uma caixinha por um cabo.

Bom, voltando ao símbolo gráfico, vamos definir os três quadros chave que vamos precisar, no frame 1 o pêndulo inclinado para o lado esquerdo.

No frame 10 o pêndulo inclinado para o lado direito.

E no frame 20 o pêndulo inclinado novamente para o lado esquerdo, assim teremos uma animação cíclica, ou em loop.

Ao interpolarmos o movimento teremos então o pêndulo balançando da esquerda para direita formando um movimento em arco.

(P.S.: Esse é um dos princípios de animação mais usados, sempre tentem aplicá-lo em suas animações, movimentos em arco cativam o espectador. Movimentos em arco deixam a animação menos robótica e mais viva).

Agora vamos reforçar o efeito deste movimento colocando um pouco de inércia, vamos em primeiro lugar transformar a interpolação em quadros chave, assim teremos a possibilidade de editar todos os quadros. Para isso vamos selecionar os quadros na linha do tempo e apertar o F6, assim transformaremos a interpolação em quadro chave, o que nos permite editar um a um os frames.
Em seguida vamos transformar todos os quadros do pêndulo em vetor usando ctrl+b em cada um deles, feito isso vamos puxar a linha dos pêndulos do quadro 2 até o 9 de forma que fique em arco para a direita.

Agora vamos fazer o mesmo só que em direção inversa do quadro 11 até o quadro 19.

E pronto, temos um belo pêndulo com o mínimo de física aplicado a ele, e princípios de animação. E para reforçar esse artigo, estou disponibilizando 2 .fla, um com o pêndulo e outro com esse princípio aplicado a um pássaro voando. O .fla do Pássaro é um pouco mais complexo, então qualquer dúvida podem enviar um email perguntando.

Um domo arigatou mina-san, e espero vê-los no próximo animando e animando.

Arquivos anexos ao artigo

Areshandore
Muito bom camarada!!

O seu artigo embora não fale de shapehint, foi um pontapé para eu descobrir como usá-lo! =D

Usando shape hint você pode fazer uma 'interpolação de forma' em quadros estratégicos e depois usar o shape hint para orientar pra onde vai cada pedaço.
Pelo menu o caminho é:
Modify > shape > add shape hint

Ou pelo atalho:
CtrlShiftH

O que aconteceu comigo:
A linha tava virando um x em determinados instantes, daí eu criei 3 shape hints(a,b,c), o a eu coloquei na extremidade, o b no meio da linha e o c na outra ponta. Daí passando para o próximo quadro chave reposicionei o a, o b e o c pra extremidade, meio e outra ponta.

Com shapehint essa animação da cordinha fica bem mais simples.

Valew pelo artigo! Gostei muito.
Abraços
splps <kodk>
so o foca pacero o pai de foces!!








Um produto Detetive.net