Quantos Frames uma Animação de Jogo Precisa? Timing

Quantos frames uma animação de jogo precisa depende da ação e do tamanho do sprite, mas a referência prática é: idle com 2 a 4, caminhada com 6 a 8, corrida com 4 a 8, ataque com 4 a 8 e pulo dividido em partes de 1 a 2 frames cada. O número de frames importa menos do que a duração de cada um. Uma animação de 4 frames com tempos bem escolhidos parece melhor que uma de 12 com tempos iguais.

Este post traz uma tabela de referência por tipo de animação, explica timing e spacing (os dois conceitos que decidem se o movimento convence), a diferença entre o FPS da animação e o FPS do jogo, e por que duração variável por frame funciona melhor que FPS fixo.

Quantos frames uma animação precisa: depende do quê

Três fatores decidem:

1. Tamanho do sprite. Em 16x16, a diferença entre duas poses intermediárias é de 1 pixel. Com muitos frames, o movimento treme em vez de fluir. Sprites maiores (64x64, arte em alta resolução) aguentam e pedem mais frames, porque cada pose intermediária tem espaço para ser diferente.
2. Velocidade da ação. Um golpe rápido dura pouco tempo na tela; um frame que dura 50 ms quase não é visto. Ações rápidas pedem poucos frames com poses fortes. Ações lentas e longas, como respiração, também pedem poucos frames, mas cada um dura muito.
3. Resposta ao controle. Animação do jogador precisa responder ao botão. Se o ataque tem 12 frames de 80 ms, ele dura quase 1 segundo, e o jogo inteiro parece lento. Animação de cenário, de NPC ou de cutscene não tem esse limite.

E um quarto fator, que ninguém gosta de admitir: orçamento. Cada frame multiplica pelo número de animações e de personagens. Oito frames de caminhada em quatro direções para dez personagens são 320 desenhos.

Timing e spacing

Timing é o tempo de uma ação: quantos frames ela tem e quanto dura cada um. É o que faz um soco parecer pesado ou rápido.

Spacing é a distância que a parte em movimento anda entre um frame e o próximo. É o que faz o movimento acelerar e desacelerar.

Os dois se misturam, mas dá para pensar separado. Imagine uma bola caindo em 5 frames, cada um com 80 ms (timing igual):

• Spacing igual (bola anda 4 pixels por frame): movimento mecânico, sem peso.
• Spacing crescente (1, 2, 4, 6, 7 pixels): a bola acelera, como a gravidade faz. Parece real.

Agora a mesma bola com spacing igual mas timing variável (os primeiros frames longos, os últimos curtos): também parece acelerar. Por isso, em pixel art, onde o spacing é limitado pela grade, o timing por frame é a ferramenta mais poderosa que você tem.

Use o onion skin no Aseprite para enxergar o spacing: os fantasmas dos frames vizinhos mostram a distância entre as posições. Fantasmas amontoados no começo e espalhados no fim indicam aceleração.

FPS de animação vs FPS do jogo

O jogo roda a 60 quadros por segundo (ou 30, ou 144). A animação do sprite não precisa acompanhar. É normal o sprite trocar de desenho 8 a 12 vezes por segundo enquanto a tela atualiza 60 vezes. Cada desenho fica na tela por 5 a 7 frames do jogo.

São duas coisas separadas:

• FPS do jogo: quantas vezes por segundo a tela é redesenhada. Afeta a suavidade do movimento do sprite pelo mundo, da câmera e da física.
• FPS da animação: quantas vezes por segundo o desenho do sprite muda. É decisão de estilo e de orçamento.

O personagem desliza suave pelo cenário a 60 FPS enquanto as pernas trocam de pose a 10. É assim que quase todo jogo 2D com sprites funciona, e é o que dá aquela leitura nítida de pixel art.

Uma consequência prática: a animação precisa ser medida em tempo, não em frames do jogo. Se o código troca o desenho "a cada 6 frames", a animação fica mais rápida num monitor de 144 Hz. O post sobre delta time explica por que tudo no jogo deve depender de tempo real. As engines já cuidam disso quando você usa o sistema de animação delas.

Duração variável por frame

Um jeito comum de pensar animação de jogo é "essa animação roda a 10 FPS". Isso dá 100 ms para cada frame, igual. Funciona, mas joga fora a ferramenta mais forte do animador.

Com duração por frame, cada desenho dura o que precisa:

• Na antecipação de um ataque, um frame longo para o jogador registrar a preparação.
• No golpe, um frame curtíssimo.
• No impacto, um frame longo, que segura a pose forte.
• Na idle, o frame de repouso mais longo que o de inspiração.

No Aseprite, cada frame tem duração própria em milissegundos: selecione e aperte P (Frame Properties). Para vários frames, selecione na timeline, botão direito, Properties.

Nas engines:

• Unity: o pacote 2D Aseprite Importer traz o .aseprite com as durações de cada frame para o clipe de animação. Se você importa um sprite sheet comum, ajuste a posição das keyframes na janela Animation (com o Samples do clipe definindo a grade de tempo).
• Godot: no SpriteFrames do AnimatedSprite2D, cada frame tem uma duração relativa, multiplicadora do FPS da animação. Com FPS 10, um frame com duração 2 fica 200 ms na tela. Importadores da comunidade para Aseprite preenchem isso sozinhos.

Saber quantos frames desenhar e quanto cada um dura é uma decisão que só fecha de verdade quando a animação roda dentro do jogo, com o controle na mão. É a parte que o editor de pixel art não mostra.

Produzir um conjunto de animações com timing coerente entre si (a corrida que conversa com o pulo, que conversa com o ataque) é trabalho de direção de arte de jogo, e aprende-se com um processo, não com tentativa e erro em cada sprite.

Tabela de referência por tipo de animação

Pontos de partida para sprite de personagem entre 32x32 e 64x64. Ajuste pelo seu jogo.

Dois padrões aparecem na tabela. Loops longos e lentos têm poucos frames com duração longa. Ações rápidas têm duração variável, com o frame mais forte segurando mais.

Na hora de exportar, todas essas animações vão para o mesmo arquivo; o guia de sprite sheet mostra como organizar.

Animar em ones e twos

Termos da animação tradicional, úteis para pensar em timing:

• Em ones: cada desenho dura 1 frame da timeline. A 24 quadros por segundo, são 24 desenhos por segundo. Muito suave, muito trabalho.
• Em twos: cada desenho dura 2 frames. 12 desenhos por segundo. É o padrão da animação 2D tradicional para a maior parte das cenas.
• Em threes ou fours: 8 ou 6 desenhos por segundo. Movimento mais "picado", com mais personalidade.

Animação de jogo com sprite quase sempre está entre twos e fours: 100 ms por desenho equivale a cerca de "em 2,4" numa timeline de 24 quadros. Em programas com timeline por frame, como o Krita, você trabalha assim: define a taxa do documento (24, por exemplo) e faz cada desenho ocupar 2 ou 3 frames. No Aseprite, onde cada frame tem a própria duração, o mesmo efeito é só escolher os milissegundos.

Misturar é o segredo: ação rápida em ones ou twos, pausas em fours. Um ataque com a antecipação em fours e o golpe em ones vende mais impacto do que tudo em twos.

Erros comuns

Todos os frames com a mesma duração. A animação fica mecânica. Varie pelo menos o frame de pose principal.

Frames demais em sprite pequeno. Tremedeira em vez de fluidez. Menos poses, mais claras.

Animação do jogador longa demais. Controle lento. Ataque leve abaixo de meio segundo.

Troca de desenho contada em frames do jogo. Velocidade muda com o monitor. Use o sistema de animação da engine, que trabalha com tempo.

Spacing igual em movimento que acelera. Queda sem peso. Afaste as posições no fim do movimento ou encurte os frames finais.

Copiar o número de frames de outro jogo sem olhar o tamanho do sprite. O que funciona em 64x64 treme em 16x16.

Próximo passo

Pegue uma animação que você já tem, mantenha os desenhos e mude só as durações: alongue o frame de pose mais forte, encurte os de passagem. Compare as duas versões lado a lado. Depois, use a tabela acima para planejar o conjunto de animações do próximo personagem antes de desenhar o primeiro pixel.