As Seis Lições, de Ludwig von Joelho

É sempre importante entendermos o lado básico da coisa, mesmo que seja um pequeno hobbie, uma atividade que você realiza apenas para descontrair. Quando abrimos o Pivot Stickfigure Animator, não é algo que a gente faz por obrigação, como se fosse um trabalho, até porque você não recebe em espécie, apenas em diversão e descontração. O intuito principal desse tutorial é te dar mais ferramentas e tornar a sua diversão ainda mais legal e desafiante, onde ensinarei seis lições bases em minha opinião e que poderá fazer você pôr o pé no chão correndo. Se as suas animações aparentam travadas, tremidas, faz um movimento que fica "freando" toda hora e são tão rápidas que não dá pra entender a ação dos stickmen, esse tutorial foi feito especialmente pra você, caro amador. Esse tutorial também serve muito pra animadores já experientes no ramo do Pivot Animator e que tem dicas muito mais legais pra os animadores que já sabem o básico, então, quando ele comentar em uma animação de um novato, poderá simplesmente enviar esse tutorial, e depois, quando o animador novato já estiver pegando as técnicas bases, ele poderá dar dicas de como fazer cenários, movimentos em 3D, acrobacias e etc. Nesse tutorial eu apresento seis lições.
1. Frames por segundo (FPS).
2. Fixar os pés do stickman
3. Movendo todas as articulações (partes, membros) do stickman.
4. Adicionando frames.
5. Easing (aceleração e desaceleração).
6. Fluindo movimentos.
Na minha concepção, o tutorial a seguir poderá ser muito benéfico, pois aborda temas básicos, mas depois de ler esse tutorial, procure mais conhecimento.


Antes de eu começar a explicar o que devemos fazer com os frames por segundo (fps) no Pivot, primeiro eu irei dar uma explicação técnica do que é isso:
"Quadros por Segundo (abreviado como qps) (em inglês Frames per second, abreviado como fps) é a unidade de medida da cadência de um dispositivo audiovisual qualquer, como uma câmara de cinema ou vídeo, uma webcam, um projetor cinematográfico ou de vídeo, etc. Significa o número de imagens que tal dispositivo registra, processa ou exibe por unidade de tempo." [FONTE: Wikipédia]
Em palavras mais fáceis, os frames por segundo (fps) são o tanto de imagens (frames) que estão aparecendo na animação em cada um segundo, e isso também pode determinar uma velocidade a ela.
Ao lado direito de Play e Parar no Pivot Animator há uma barra onde podemos alterar o número de frames que estão rolando a cada segundo (clique aqui para ver a imagem). Veja que vai de 7 até 33. Para começarmos nosso aprendizado, iremos pôr esse FPS em 17 ou 18, para ter um equilíbrio decente, já que as nossas animações não serão profissionais.

Exemplo:

ANIMAÇÃO 1
(baixar .piv)

Nesta animação há um número de frames ADICIONADOS nos movimentos razoável e também um FPS razoável, com cerca de 17 à 18 de FPS. É recomendável essa sintonia, para que não haja uma lentidão ou rapidez excessiva na animação.


ANIMAÇÃO 2
(baixar .piv)

Nesta animação, para você não dizer que só dei um exemplo, há uma animação com mais frames ADICIONADOS e com um FPS maior, entre 24 e 25. Lembrando que uma alteração entre frames adicionados na animação e o seu número de frames reproduzindo por segundo (fps) podem causar uma lentidão ou rapidez excessiva na animação, então é necessário que haja uma sintonia entre ambos.

Tudo certo até aqui? Vamos para a próxima lição.


Esse é o erro básico de todo o novato que eu já encontrei, acho que todos os novos animadores já entraram nesse erro, o de não fixar os pés do stickman.
Quando o stickman está andando, correndo ou até lutando, já que ele está apoiado também com os pés no chão, seus pés não podem parecer que estão deslizando, que estão soltos.
Ele deve estar fixado no mesmo frame antigo SE não for pra PROPOSITALMENTE levantá-lo.
Veja o exemplo abaixo:


ANIMAÇÃO 3


Então vamos entrar logo nos critérios básicos pra uma animação com uma movimentação saudável e agradável. Nós sabemos que, mesmo que estejamos parados, todas as partes do nosso corpo estão ainda levemente se movendo, isso já foi concedido por físicos teóricos do século XX pra trás. Mas a questão aqui é que pra um movimento aparente um pouco mais perto da "realidade", vamos se dizer, é necessário que haja vida em todo o stick, e pra isso, nós devemos movimentar TODAS as articulações do stickman em TODOS os frames, porque se for pra mover apenas alguns em alguns frames, o stickman parecerá um robô com defeito ainda por cima. Um movimento totalmente travado, que chega dá nervoso.
Para facilitar mais ainda o nosso ensino, vamos o exemplo de um soco onde há duas animações, uma onde o animador só move os braços do stickman e na outra animação onde ele move todo o corpo do stickman e compará-las.

Movimentando só os braços:

ANIMAÇÃO 4

Perceba que o stickman levanta o braço e dá um soco, mas o resto do corpo dele não se move, como se estivesse todo paralisado. Esse é um exemplo de uma animação dura, travada e, graças a isso, ruim. Para que o soco fique mais bonito e suave, é necessário que todas as articulações do corpo do stickman tenham uma certa ação, como veremos no próximo exemplo:

Movimentando o corpo todo:

ANIMAÇÃO 5
(baixar .piv)

Você você como todas as articulações se movem juntas em todos os frames? Cada uma seguinte uma certa trajetória. Isso acabou dando mais vida ao movimento, eliminando a aparência de um robô com defeito que é vista no exemplo anterior.


Nessa lição, nós iremos aprender a importância da adição de frames.
ATENÇÃO: É importante saber que o que eu quero dizer com adicionar frames na animação, é que estou dizendo dos frames adicionados nos movimentos para a suavização deles, e não pra deixar a animação longa.
Mesmo que agora saibamos que o stickman deve ter todas as suas articulações movimentadas em todos os frames, é necessário que o animador adicione esses frames de um jeito que dê ao espectador a capacidade acompanhar e entender os golpes dentro dessa animação.

Soco ruim (05 frames):

ANIMAÇÃO 6
(baixar .piv)

A animação tá bem rápida, o soco tá bastante rápido, mas não está claro sua força, na primeira vez que você viu, provavelmente não achou que fosse realmente um soco.
Um movimento, pra que ele deixe o espectador acompanhar o movimento, ao contrário do que vemos no exemplo, o animador deveria dar um início melhor a ele, com uma aceleração e uma desaceleração (easing, onde falaremos mais a frente), adicionando um número considerável de frames pra que seja possível acompanhar.

Soco bom (14 frames):

ANIMAÇÃO 7
(baixar .piv)

No exemplo de agora, é altamente nítida a visão que nós temos sobre a animação, o movimento apresenta mais frames e dá pra acompanhar cada um deles, reconhecendo tal.
Vemos que há um início que começa acelerando e também finalizando com muitos frames.


Você deve estar se perguntando que mesmo que você saiba que deve adicionar um número considerável de frames pra quem está visualizando acompanhe o movimento, como você deverá então adicionar esses frames? Como que fazer? Pois aqui está a resposta: easing. É a técnica que controla o movimento de uma forma que ele não fique freando, sem parecer que ele tá travando, enferrujado, ou algo do tipo. Você pode aprender mais sobre essa técnica com mais detalhes no tutorial "Introdução ao Pivot Animator", escrito pelo Foley e que está fixado na área de Tutoriais aqui do Pivot 5.
Vamos para os exemplos:


ANIMAÇÃO 8

Os frames começam e terminam sem uma ordem, acelerando e parando loucamente antes do movimento terminar, é esse o movimento travado que você tanto ouve falar.
O movimento está tão bagunçado como essa demonstração escrita:
|===|=|==|=====|===|=|===|=|
Sem ordem alguma de começo e fim.


ANIMAÇÃO 9

Nessa animação, a figura está começando com uma aceleração e terminando com uma desaceleração, sem interrupções, como na demonstração abaixo:

Acelerando............Desacelerando
|=|==|====|======|====|==|=|

Soco com Easing

ANIMAÇÃO 10
(baixar .piv)

Perceba a preparação e a realização do soco, sempre seguindo o easing, por mais diferente que seja do exemplo da figura na animação 8, o braço acelera e desacelera.


O movimento fluído está independente do easing, o easing tem o papel apenas de mostrar que o movimento sempre tem uma aceleração e uma desaceleração que não trave ou trema a animação. O movimento acaba soltando mais a figura, o seu movimento fica bem leve, e como já dito, fluído.

Não fluído

ANIMAÇÃO 11
(baixar .piv)

Podemos ver que não tem nada de fluído aí, pode até ser mostrado um nível de easing, mas não está necessariamente fluído. Quando o animador tem mais calma, ele começa a adicionar mais frames e soltar cada vez mais a figura, movendo-a de um modo bem mais fluído.

Fluído

ANIMAÇÃO 12
(baixar .piv)

O que podemos ver agora é um movimento fluído, onde todas as partes estão sendo movimentadas com um nível interessante de fluidez. A figura começa lentamente, sobe e desacelera, volta novamente e desacelera no ponto inicial pra executar o loop.

______

ANIMAÇÃO 1: Zara
ANIMAÇÃO 2: Zara
ANIMAÇÃO 3: Hitori
ANIMAÇÃO 4: Zara
ANIMAÇÃO 5: Zara
ANIMAÇÃO 6: Joelho
ANIMAÇÃO 7: Joelho
ANIMAÇÃO 8: Joelho
ANIMAÇÃO 9: Joelho
ANIMAÇÃO 10: Joelho
ANIMAÇÃO 11: Joelho
ANIMAÇÃO 12: Joelho

---

Gostei do seu tutorial, parece o meu só que mais comentado. çkçkkçkççkçççççç
COPIÃO

tutorial bacana,gostei da parte do easyng e da fixação dos pés,certeza que via me ajudar bagarai.

continue com os tutoriais c:

Ótimo tutorial joelho, e parabéns, você durante o processo de criação do tutorial evoluiu muito como animador.

Deus escreveu:Gostei do seu tutorial, parece o meu só que mais comentado. çkçkkçkççkçççççç
COPIÃO

BENTIRA! Eu comecei com a ideia do tutorial antes, só copiei a parada de fixar os pés, porque a sexta lição tava muito ruim, daí substituí pela de fixar pés, mas antes de tu ser organizador eu tinha começado esse tutorial aí.

Farei o que tava muito ruim (na qualidade de como eu ia organizar, não no conteúdo) eu irei fazer em um tópico separado.

Você nem colocou meus exemplos. ;'(
Vou ler só até a quarta lição pois o resto não me interessa. ótimo trabalho continue assim

Lemon escreveu:Você nem colocou meus exemplos. ;'(
Vou ler só até a quarta lição pois o resto não me interessa. ótimo trabalho continue assim

Eu mudei a estrutura da explicação, daí tive que mudar algumas coisas. Dxculpa. ;_;

E valeu.

Joelho,adiciona mais coisas de easyng,tipo interação com o cenário e etc :3 tutorial fodex,eu to criando o meu tbm

DiegoxPlay escreveu:Joelho,adiciona mais coisas de easyng,tipo interação com o cenário e etc :3 tutorial fodex,eu to criando o meu tbm

Eu coloquei só o básico pra já ter uma ideia, outros tutoriais mais complexos vem aí com o Zara.

Aliás, se tu for fazer um tutorial, certifique-se que tu realmente sabe do que tá falando e que não tenha um tutorial com conteúdo parecido. Vai aprender a animar, porrão. - Falou o moderado low.

Achei o tutorial bem interessante. Com certeza irá ajudar muitos iniciantes do fórum e até mesmo ajudar alguns moderados ;)

Valeu, TVA, lindjo.

Vou fechar aqui. Já chega de comentários.