Um personagem andando em 8 direções

A coisa mais difícil de desenhar à mão, e a mais fácil de renderizar: um personagem caminhando em oito direções, todos os quadros consistentes.

Frente
Direita
Atrás à esquerda
Um personagem que anda em 8 direções: a folha que este projeto de exemplo renderiza

Projeto de exemplo

Um personagem que anda em 8 direções: o projeto .pixor e o modelo dele da biblioteca (CC0). A folha à esquerda é o que ele renderiza.

Intermediário · cerca de 10 minutos

1. Importe um personagem animado

Arraste o(a) goblin da biblioteca grátis para o Pixor, ou um personagem com rig seu: glTF ou FBX com seus clipes. A importação diz quantos ossos e clipes chegaram.

2. Oito câmeras

Na etapa Cena, clique em Sul na Estrutura. Defina Jogo como RPG visto de cima (uma vista de três quartos de cima) e depois Anel em volta do modelo como 8. O Pixor adiciona uma câmera por lado, com o nome do lado que cada uma vê: Sul, Sudeste, Leste, Nordeste, Norte, Noroeste, Oeste, Sudoeste.

Eles compartilham uma vista, uma inclinação e um tamanho, então compartilham uma folha, uma paleta e uma escala de pixel. É isso que mantém as oito direções parecendo o mesmo personagem.

3. A caminhada

Na etapa Ação, clique em Andar na lista de Ações. Se o personagem avança enquanto anda, mantenha-o no lugar no Inspetor da ação (root motion): o sprite fica no pivô, e o deslocamento é gravado para a sua engine.

4. Menos quadros, e melhores

Uma caminhada a 24 quadros por segundo tem quadros demais para pixel art. Abra a etapa Asset e escolha o nó Sprites: clique em Quadros inteligentes e defina Quadros mantidos como cerca de 6. O Pixor mantém os extremos de pose, cada um retido até o seguinte, do jeito que um animador escolhe as chaves. Ou defina Quadros/s entre 8 e 12 para uma taxa constante.

5. Confira

Reproduza o resultado na Vista 2D. As faixas de luz se mantêm até a superfície claramente virar, e pixels que piscariam por um quadro ficam estáveis, então a caminhada não deve tremular. Ligue a grade de pixels (Shift+G) e o papel vegetal (O) para olhar mais de perto.

6. Exporte para a sua engine

Exportar grava uma folha com uma linha por lado. Para o Godot, adicione a saída SpriteFrames do Godot no grafo de asset: cada lado vira uma animação de um AnimatedSprite2D (guia do Godot). Para retocar à mão, adicione o Arquivo Aseprite: uma tag para cada lado, pronta para pintar por cima (as re-renderizações preservam a sua pintura).

Próximo

Perguntas

Posso usar animações do Mixamo?

Sim. Arquivos FBX do Mixamo são importados como estão. Clipes em arquivos separados são encontrados automaticamente quando têm o nome do modelo (hero@walk.glb); caso contrário, adicione-os com Clipes de um arquivo… abaixo da lista Ações.

Meu personagem desliza pela tela enquanto anda. Por quê?

Isso é root motion: o clipe move o personagem para a frente. Na etapa Ação, o Inspetor da ação o mantém no lugar, e o deslocamento é exportado para a sua engine.

Leia a seguir

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

Testar no navegador Obter o Pixor