Os 12 Princípios da Animação Aplicados a Jogos
Os 12 princípios da animação da Disney traduzidos para jogo: quais valem igual, quais mudam por causa do input e exemplos de cada um num personagem jogável.
Os 12 Princípios da Animação Aplicados a Jogos
Os 12 princípios da animação são um conjunto de técnicas que explicam por que um movimento desenhado parece vivo: squash and stretch, antecipação, encenação, direta e pose a pose, continuidade e sobreposição, aceleração e desaceleração, arcos, ação secundária, timing, exagero, desenho sólido e apelo. Em jogo, todos continuam valendo, mas alguns mudam de forma porque existe um jogador apertando botão e esperando resposta.
Este post passa por cada princípio com um exemplo num personagem jogável, mostra quais funcionam igual ao cinema e quais precisam ser adaptados, e termina com os que mais importam quando o tempo de produção é curto. Os exemplos de ferramenta usam o Krita, mas valem para qualquer programa de animação.
Origem dos 12 princípios da animação
Os princípios foram organizados por Frank Thomas e Ollie Johnston, dois animadores da geração clássica da Disney, no livro The Illusion of Life: Disney Animation, publicado em 1981. Eles não inventaram as técnicas: descreveram o que o estúdio tinha aprendido em décadas de prática, com nomes e exemplos, para que pudesse ser ensinado.
Esses 12 princípios da Disney nasceram para filme: o animador controla cada quadro e o espectador só assiste. No jogo, o espectador é também quem dirige. Isso não invalida nada, mas muda prioridades. A seguir, cada princípio com essa lente.
Squash and stretch
O objeto achata quando comprime e estica quando se move rápido, mantendo o volume. É o que dá peso e elasticidade.
No jogo: vale igual, e vale mais. Na aterrissagem do pulo, o personagem achata. Na subida, estica. Num slime, o corpo inteiro é squash and stretch. Em sprite pequeno, o efeito é de 1 ou 2 pixels, mas é o que separa um personagem duro de um vivo.
Atalho de jogo: muitos jogos aplicam squash and stretch por código, escalando o sprite por um instante no pulo e no pouso. Em arte de alta resolução isso funciona muito bem; em pixel art, deforma os pixels, então prefira desenhar.
No Krita, um jeito rápido de testar é a Transform Tool (Ctrl+T) num frame duplicado: achate e estique a pose para encontrar a proporção, depois redesenhe por cima.
Antecipação: curta por causa do input
Antes de uma ação, o corpo vai na direção contrária: agacha antes de pular, puxa o braço antes de socar. A antecipação prepara o olho para o que vem.
No jogo, este é o princípio que mais muda. No cinema, uma antecipação longa dá dramaticidade. No jogo, se o jogador aperta pular e o personagem fica 300 ms agachando, o controle parece quebrado. A resposta é dividir:
- Ações do jogador: antecipação de 1 frame, ou de 50 a 100 ms, ou nenhuma na física. Muitos jogos de plataforma soltam o pulo no mesmo instante e mostram a antecipação só visualmente.
- Ações do inimigo: antecipação longa e exagerada de propósito. É ela que dá ao jogador a chance de reagir. Um chefe que levanta o machado por meio segundo está ensinando o jogador a desviar.
Essa assimetria é o coração da animação de combate. O jogador age rápido; o inimigo avisa.
Staging, ação contínua e pose a pose
Staging (encenação) é apresentar a ação de modo que não haja dúvida do que está acontecendo. No jogo: silhueta legível. Se você preencher o personagem de preto, a pose de ataque precisa ser diferente da de idle. Câmera e cenário também fazem parte: um personagem que se mistura com o fundo tem staging ruim.
Ação direta e pose a pose são dois métodos de trabalho. Na direta, você desenha frame após frame do começo ao fim (bom para fogo, fumaça, água). No pose a pose, você desenha as poses-chave primeiro e preenche os intermediários depois (bom para personagem). No jogo: pose a pose é o padrão para personagem, porque as poses-chave são justamente o que a engine vai segurar na tela (o impacto do ataque, o ápice do pulo). Efeitos usam a direta.
No Krita, o pose a pose fica natural com os holds da timeline (cada desenho fica na tela até o próximo quadro criado): desenhe as chaves com espaços entre elas na timeline e preencha depois, com o onion skin ligado pela lâmpada da camada.
Follow through e overlapping
Follow through (continuidade): partes soltas continuam se movendo depois que o corpo para. A capa continua indo para a frente quando o personagem freia. Overlapping action (sobreposição): partes diferentes se movem em tempos diferentes. O cabelo atrasa um frame em relação à cabeça.
No jogo: vale igual e dá muito resultado com pouco trabalho. Em pixel art, atrasar o cabelo ou a capa em 1 frame na corrida e na idle já faz o personagem ganhar peso. Muitos jogos fazem a capa por física (corrente de pontos ou osso secundário), e aí o follow through vem de graça.
Atenção a um conflito com o controle: o corpo pode continuar o movimento visualmente depois que o jogador soltou o botão, mas a colisão e a física param na hora. A arte segue; a regra não.
Slow in, slow out e arcos
Slow in e slow out (aceleração e desaceleração): o movimento começa devagar, acelera e desacelera antes de parar. Na prática, mais desenhos perto das poses extremas e menos no meio.
No jogo: vale, mas com um cuidado. Em ação do jogador, slow in no começo é atraso. Use slow out (desacelerar no fim, segurar a pose) e corte o slow in. Em sprite, o mesmo efeito se consegue com duração por frame: frame de pose longo, frame de passagem curto.
Arcos: movimentos naturais seguem trajetórias curvas. Uma mão não vai em linha reta de um ponto a outro; ela faz um arco. No jogo: o arco do golpe de espada, a curva do pulo, o balanço do braço na caminhada. Em pixel art, confira o arco com o onion skin: os pontos da ponta da arma em cada frame devem formar uma curva limpa, não um zigue-zague.
Até aqui, cada princípio parece simples sozinho. O difícil é aplicar todos ao mesmo tempo, num personagem com dez animações que precisam conversar entre si e responder ao controle sem atraso.
Saber os princípios é o começo; aplicar em um conjunto de animações coerente, com timing que funciona no jogo e não só no editor, é o que um processo de produção de arte para jogos ensina na prática.
Ação secundária, timing, exagero, solidez e apelo
Ação secundária: um movimento menor que apoia o principal. O personagem anda e balança a lanterna; ataca e grita. No jogo: respiração na idle, olhar para os lados, a lanterna. Cuidado para não competir com a ação principal: em combate, menos é mais.
Timing: o número de desenhos e a duração de cada um. No jogo, é também regra de jogo. O tempo da antecipação do inimigo define a dificuldade. O tempo da recuperação do ataque define se o jogador pode encadear golpes. O post sobre quantos frames uma animação precisa traz uma tabela de referência por tipo de animação.
Exagero: empurrar a pose além do realista para ela ser lida. No jogo: essencial. O sprite é pequeno, a ação é rápida e o jogador está prestando atenção em outras coisas. Pose de ataque com o corpo inteiro torcido, aterrissagem com squash forte. O que parece exagerado no editor em zoom vira "na medida" na tela do jogo.
Desenho sólido: entender forma, volume e peso, para o personagem parecer tridimensional mesmo em 2D. No jogo: em pixel art pequeno, se traduz em consistência de volume entre frames. Um braço que muda de espessura de um frame para o outro denuncia falta de solidez.
Apelo: o personagem ser interessante de olhar, com design claro e carisma. No jogo: silhueta reconhecível, cores bem escolhidas, uma idle com personalidade. O jogador vai passar horas olhando para esse personagem.
Quais princípios mais importam num jogo
Com tempo curto, priorize nesta ordem:
- Timing. É animação e é game design. Ajustar duração de frames muda mais do que redesenhar.
- Antecipação (adaptada). Curta no jogador, longa no inimigo.
- Exagero. O que não é exagerado não é visto em sprite pequeno.
- Squash and stretch. Pulo e aterrissagem com squash já mudam a sensação de controle.
- Follow through e overlapping. Cabelo e capa atrasados dão vida por quase nenhum custo.
- Staging (silhueta). Teste cada pose preenchida de preto.
Arcos, slow in e slow out, ação secundária, solidez e apelo continuam valendo, mas costumam vir naturalmente quando os seis primeiros estão bem resolvidos.
Muitos desses princípios conversam diretamente com o game feel: squash and stretch, hit stop e exagero são ferramentas que o guia de game feel e juice usa do lado do código. E se você quer entender como animadores trabalham com isso no dia a dia de um estúdio, o post sobre o que faz um animador de jogos mostra a rotina.
Próximo passo
Escolha uma animação do seu personagem, como o pulo ou o ataque, e revise com a lista acima, um princípio por vez. Comece pelo timing: só mude durações. Depois exagere as poses-chave. Por último, acrescente um elemento de follow through. Compare antes e depois na escala real do jogo, não no zoom do editor.
Perguntas frequentes
Quais são os 12 princípios da animação?
Squash and stretch, antecipação, encenação (staging), animação direta e pose a pose, continuidade e sobreposição (follow through e overlapping action), aceleração e desaceleração (slow in e slow out), arcos, ação secundária, timing, exagero, desenho sólido e apelo. Eles foram descritos por Frank Thomas e Ollie Johnston no livro The Illusion of Life, de 1981.
Os 12 princípios da animação valem para jogos?
Valem, mas alguns mudam de peso. A antecipação precisa ser curta nas ações do jogador, porque ele espera resposta imediata ao botão. Squash and stretch, follow through e exagero ganham importância, porque o jogador vê as animações muitas vezes e em tamanho pequeno.
Qual princípio da animação é mais importante em jogos?
Timing, porque em jogo ele é também regra de game design: define quanto tempo o ataque leva para acertar, quanto o jogador fica sem controle e quanto o inimigo avisa antes de agir. Logo depois vêm antecipação e exagero, que fazem a ação ser lida rápido.
De onde vieram os 12 princípios da animação?
Do livro The Illusion of Life: Disney Animation, publicado em 1981 por Frank Thomas e Ollie Johnston, dois animadores veteranos da Disney. Eles organizaram em 12 princípios as técnicas que o estúdio desenvolveu ao longo das décadas anteriores.
