Promoção de Halloween: −40% O Pixor sai por US$ 19.99 US$ 11.99 até 4 de novembro, no itch.io →

Antecipação e continuidade: dê peso a um salto

Um clipe que parece bom em 3D muitas vezes flutua quando tem só alguns pixels de altura: nada de agachar antes do impulso, uma aterrissagem sem peso. O nó Timing acrescenta o que um animador faria à mão, a partir da velocidade com que cada parte se move.

Antecipação e continuidade: o salto de um cavaleiro com um nó Timing: a folha que este projeto de exemplo renderiza

Projeto de exemplo

Antecipação e continuidade: o salto de um cavaleiro com um nó Timing: o projeto .pixor e o modelo dele da biblioteca (CC0). A folha à esquerda é o que ele renderiza.

Um cavaleiro em pixel art pulando, visto de lado, de forma rígida
O salto da biblioteca como vem
O mesmo cavaleiro agachando mais fundo antes do salto e se achatando na aterrissagem
Passando por um nó Timing, força 1.5

Iniciante · cerca de 5 minutos · ou assista em 91 segundos

1. Uma câmera lateral

Abra um modelo com rig: o tutorial usa o cavaleiro da biblioteca CC0 grátis. Na etapa Cena, clique na câmera Sul na Estrutura e defina a vista Jogo como Plataforma.

2. Uma escala fixa

Defina o Tamanho da câmera como Pixels por metro e digite 34. Uma câmera ajustada ao modelo muda a escala dele para caber tudo o que a ação faz, então um agachamento mais fundo encolheria o sprite; numa escala fixa, o cavaleiro mantém o tamanho e a tela cresce em volta dele.

3. Um salto da biblioteca

Na etapa Ação, escolha Adicionar uma ação › Clipe da biblioteca: jump. Veja-o na Vista 2D da etapa Estilo: ele toca, mas flutua. O cavaleiro sai do chão sem se agachar e aterrissa sem peso.

4. Adicione um nó Timing

De volta à etapa Ação, selecione o nó Clipe no grafo de Ação, escolha Adicionar um nó de ação e pegue Timing (em Filtros). Ele entra depois do clipe e calcula o resto a partir da velocidade com que cada parte se move:

  • Preparação (antecipação): logo antes de uma parte se mover rápido, ela primeiro se move um pouco para o outro lado.
  • Ultrapassagem (continuidade): quando um movimento rápido para, a parte passa um pouco do ponto e volta a se acomodar.
  • Achatamento: onde uma queda para, o modelo fica mais baixo e mais largo por um instante e volta com elasticidade.

5. Os ajustes

Os campos do nó são os ajustes dele: Força (1; 0 é o clipe como vem, 2 o dobro), Preparação, Ultrapassagem e Achatamento (cada um 1; 0 é nenhum) e Segundos, quanto duram uma preparação e uma acomodação (0.1). O tutorial define a Força como 1.5. Os mesmos números dão sempre os mesmos quadros.

6. Com peso

Na etapa Estilo, o salto agora se agacha antes do impulso e se achata na aterrissagem. Avalie quadro a quadro com o Papel vegetal (O) ou o O que mudou (D) da Vista 2D.

7. Exportar

Adicione uma saída Arquivo: GIF por clipe da biblioteca de nós na etapa Asset e depois Exportar: a folha, o JSON dela e um GIF do salto.

Pela linha de comando

--timing coloca um nó Timing em cada clipe de uma renderização: uma força e depois qualquer ajuste pelo nome.

pxr render knight.glb --camera platformer --pixels-per-metre 34 --clip lib:jump --timing 1.5
pxr render hero.glb --clip attack --timing 1.5,squash=0,time=0.08
pxr project set game.pixor --timing overshoot=2

pxr project set --no-timing os retira de novo.

Próximo

  • Timing de animação: pausas, quantidade de quadros e quanto tempo um quadro deve durar.
  • Animação subpixel: uma respiração menor que um pixel.

Perguntas

O nó Timing muda onde as poses terminam?

Não. Cada pose em que o clipe fica parado é mantida exatamente, e nada termina em outro lugar além de onde terminava. Só os movimentos entre elas ganham uma preparação antes e uma ultrapassagem depois.

Funciona com clipes do Mixamo ou outros clipes capturados?

Sim. Ele lê a velocidade de cada parte, então qualquer clipe serve: um clipe da biblioteca, um download do Mixamo, chaves que você mesmo definiu. Movimentos lentos ficam quase como estão; os rápidos ganham mais.

Uma caminhada em loop continua em loop?

Sim. Numa ação em loop o efeito dá a volta no loop, então um movimento no início faz a preparação no fim da volta anterior e o loop continua sem emendas.

Por que meu sprite fica menor quando adiciono o nó Timing?

Uma câmera ajustada ao modelo abre espaço para o agachamento mais fundo e o achatamento. Defina o Tamanho da câmera como Pixels por metro e a escala fica fixa, faça o movimento o que fizer.

Leia a seguir

Experimente no seu próprio modelo, grátis no navegador, ou adquira a versão completa.

Testar no navegador Comprar o Pixor