Voltar para o Blog
Quest Log

Animação no Krita: Timeline, Onion Skin e Exportar

Interface de animação do Krita com um personagem desenhado no canvas, timeline com quadros na parte de baixo e silhuetas de onion skin em vermelho e verde

Krita animação de ponta a ponta: workspace Animation, timeline, onion skin, fps, áudio de referência e renderizar em sequência PNG ou vídeo com o FFmpeg.

Ferramenta:Krita

Animação no Krita: Timeline, Onion Skin e Exportar

Animação no Krita começa em Window > Workspace > Animation: o programa troca o layout e mostra a timeline na parte de baixo, o onion skin e as curvas de animação. Daí em diante você cria quadros na timeline, desenha com o onion skin ligado e renderiza em File > Render Animation, como sequência de PNG (o que a engine usa) ou como vídeo.

Este guia vai de ponta a ponta com o olho em jogo: preparar o workspace, criar e segurar quadros, onion skin, fps, áudio de referência, limpeza e o render certo para sprite, incluindo quando o FFmpeg embutido basta e quando você precisa instalar o seu. Os menus são os do Krita 5.3.4.1, a versão estável no site oficial em outubro de 2026.

Krita animação: preparar o workspace

  1. Abra File > New e defina o tamanho do canvas pelo tamanho do sprite final. Para um personagem pintado que vai aparecer com uns 128 pixels de altura no jogo, um canvas de 256 x 256 dá margem para desenhar com folga e reduzir depois. Para pixel art, use o tamanho real (32 x 32, 64 x 64).
  2. Escolha Window > Workspace > Animation. Aparecem o docker Animation Timeline, o Onion Skins e o Animation Curves.
  3. Se algum docker sumir, ele está em Settings > Dockers.

Organize as camadas antes de começar: uma camada de fundo opaca só para ver melhor (você desliga no render), uma camada para o esboço e uma para a arte final. No Krita, só camadas com quadros criados viram animadas; uma camada sem quadros aparece igual em todos os frames, o que é útil para fundo e guias.

Se você ainda não configurou o Krita para arte de jogo (pincéis, canvas, exportar PNG), o post sobre Krita para jogos cobre essa base.

Timeline e criação de frames

A timeline mostra as camadas nas linhas e os quadros nas colunas. Para criar um quadro:

  1. Selecione a camada e clique na célula do quadro.
  2. Clique com o botão direito e escolha Create Blank Frame (quadro vazio) ou Create Duplicate Frame (cópia do quadro anterior).

Use Create Duplicate Frame quando o próximo desenho aproveita o anterior, como numa corrida em que a cabeça muda pouco. Use Create Blank Frame para desenhar do zero com o onion skin como guia.

Um quadro desenhado continua visível até o próximo quadro criado na mesma camada. Isso é o "hold": um desenho no quadro 0 e outro no quadro 2 faz o primeiro durar dois quadros. É assim que você anima "em 2s" (cada desenho dura 2 quadros), o padrão de animação desenhada à mão.

Para mudar o tempo depois, arraste os quadros na timeline. Selecionar vários e arrastar move o bloco inteiro, e o menu do botão direito tem opções para inserir e remover quadros de hold, o que estica ou encurta a animação sem redesenhar.

Onion skin

O onion skin mostra os quadros anteriores e seguintes em transparência. No docker Onion Skins:

  • A fileira de cima liga e desliga cada quadro vizinho (anteriores à esquerda, seguintes à direita).
  • A fileira de baixo controla a opacidade de cada um.
  • Por padrão, quadros anteriores aparecem em vermelho e os seguintes em verde. Dá para trocar as cores e a intensidade.

Para jogo, ligue 1 ou 2 quadros para cada lado. Mais que isso vira poluição visual, principalmente em corrida.

O onion skin também precisa estar ligado na camada: camadas animadas mostram um ícone de lâmpada na própria linha, que liga o onion skin daquela camada. Ele não funciona em camada totalmente opaca, então anime numa camada transparente. Se você configurou o docker e nada aparece, confira esse ícone na camada ativa.

Tempo e fps

O frame rate e o intervalo da animação (quadro inicial e final) ficam no cabeçalho do docker Animation Timeline. Duas decisões importam para jogo:

Fps de trabalho. Animação desenhada costuma ser feita a 24 fps em 2s, o que dá 12 desenhos por segundo. Para sprite de jogo, isso é bastante: uma corrida de 8 desenhos a 12 fps dura dois terços de segundo por ciclo, o que funciona bem.

Fps final na engine. A engine toca a sprite sheet no fps que você configurar, independente do fps do Krita. Se você animou a 24 fps em 2s e exportou só os quadros únicos, configure a animação na engine para 12 fps. Se exportou todos os quadros, use 24.

Para tocar, use os controles de play no cabeçalho do Timeline. Selecione um intervalo de quadros para tocar só ele em loop enquanto ajusta.

Áudio de referência

Para sincronizar um golpe com um som de impacto, ou um ciclo de passos com o som do pé, o Krita aceita uma faixa de áudio na timeline. O controle fica no cabeçalho do Animation Timeline (o ícone de alto-falante): abra o arquivo de áudio, de preferência em WAV, e ajuste o volume ali.

O áudio serve só como referência de tempo. O som do jogo é tocado pela engine, separado do sprite. Use o áudio para achar o quadro exato do impacto e anote o número dele: é nesse quadro que o programador dispara o som e o dano.

Desenhar e limpar frames

Fluxo que funciona para personagem de jogo:

  1. Poses-chave na camada de esboço: início, extremo e fim do movimento. Numa corrida, contato e passagem de cada perna.
  2. Toque as poses-chave e acerte o tempo antes de desenhar intermediários.
  3. Intermediários com o onion skin ligado.
  4. Limpeza: crie a camada final, crie os quadros nos mesmos números da camada de esboço e redesenhe o traço limpo por cima. Desligue o esboço no fim.
  5. Cor numa camada abaixo do traço, com os mesmos quadros.

Cada camada animada guarda os próprios quadros, então traço e cor precisam ter quadros nas mesmas posições. Se um quadro de cor estiver um número atrás, a cor "atrasa" em relação ao traço naquele trecho.

O Krita também anima propriedades da camada, como opacidade e posição, pelo Animation Curves. Para jogo isso serve pouco no personagem (a engine move o personagem), mas ajuda em efeitos como um brilho que acende e apaga.

Animar no Krita é a parte que dá prazer. Levar essa animação para dentro de um jogo, com o tamanho certo, o pivô no pé, o tempo batendo com o movimento do personagem e o mesmo padrão em todas as animações, é a parte em que a maioria das pessoas trava sozinha e acaba com pastas de PNG que não encaixam.

Curso de Arte 2D
Quer fazer a arte do seu jogo?

No curso de Arte 2D para Jogos da CursoGame.Dev você vai do rabisco ao portfólio: personagens, cenários, tilesets, UI e animação, sem precisar saber desenhar.

Conhecer o curso de Arte 2D
Suporte no WhatsAppAcesso vitalícioGarantia de 7 dias

Um fluxo de produção de arte com etapas fixas (tamanho, pivô, nomes de arquivo, exportação) faz cada animação nova entrar na engine sem retrabalho.

Renderizar animação no Krita: sequência de imagens e vídeo

Abra File > Render Animation. O diálogo tem três blocos.

Geral. First Frame e Last Frame definem o intervalo. Eles vêm do intervalo selecionado na timeline, o que permite renderizar só uma parte (por exemplo, só o ciclo da corrida dentro de um arquivo com várias animações).

Export as Image Sequence. É o que você quer para jogo.

  • O formato é PNG, com transparência preservada.
  • Image Location: a pasta de saída. Use uma pasta por animação (heroi_run/).
  • Base Name: o prefixo dos arquivos. Com heroi_run_, os arquivos saem numerados em sequência.
  • Start numbering at: o número do primeiro arquivo.
  • Only Unique Frames: exporta só os quadros com desenho novo, sem repetir os holds. Útil se você vai definir o tempo na engine.

Antes de renderizar, desligue a camada de fundo opaca e a de esboço.

Export as Video. Para mostrar a animação, postar ou revisar.

  • Render As: o formato (WebM, MKV, MP4, GIF e outros, conforme o FFmpeg disponível).
  • FPS, Width e Height do vídeo.
  • Filter: para pixel art ampliada, use Nearest Neighbour; para arte pintada, Bicubic.
  • Include Audio: inclui o áudio de referência.

Um limite importante: no vídeo, as áreas transparentes saem pretas. Para vídeo de divulgação, coloque uma camada de fundo.

Configurar FFmpeg

Desde o Krita 5.2, uma parte do FFmpeg vem embutida. Segundo o manual oficial, ela cobre os contêineres WebM, Matroska e OGG, com os codecs AV1, VP9, VP8, H.264 (via OpenH264) e Theora. Para esses formatos, você renderiza sem instalar nada.

Para outros formatos (MP4 e GIF, por exemplo) ou um codec específico, instale o FFmpeg e aponte o campo FFmpeg do diálogo para o executável:

  • Windows: baixe uma build de release que não seja "shared" e aponte para algo como C:/ffmpeg/bin/ffmpeg.exe.
  • macOS: aponte para o arquivo ffmpeg extraído.
  • Linux: normalmente /usr/bin/ffmpeg, instalado pelo gerenciador de pacotes.

Sequência de PNG não depende de FFmpeg. Se o seu objetivo é só levar a animação para a engine, você pode ignorar essa parte.

Com a sequência pronta, o próximo passo é montar a folha. O Krita não monta sprite sheet sozinho; o post Exportar Sprite Sheet do Krita para a Engine mostra os caminhos, e o post sobre sprite sheet explica a lógica de grade e padding.

Erros comuns

Quadro criado na camada errada. Você desenha e a imagem aparece em todos os quadros: a camada não tinha quadro criado, então está estática. Crie o quadro na timeline antes de desenhar.

Usar Create Blank Frame quando queria duplicar. O desenho some e você acha que perdeu trabalho. Desfaça e use Create Duplicate Frame.

Render em vídeo para a engine. Vídeo perde transparência e a engine quer quadros separados. Para jogo, sequência de PNG.

Fps do Krita diferente do da engine. A animação fica rápida ou lenta no jogo. Anote o fps e se exportou só quadros únicos.

Canvas grande demais e sem escala definida. Animar a 2000 pixels e reduzir para 64 perde todo o traço fino. Desenhe numa resolução próxima do uso real (2 a 4 vezes o tamanho final, no máximo).

Esquecer a camada de esboço ligada. O esboço sai no render. Confira as camadas visíveis antes de abrir o Render Animation.

Próximo passo

Anime um ciclo curto de 6 a 8 desenhos, como um idle respirando ou uma corrida, renderize como sequência de PNG com Only Unique Frames e monte a folha seguindo o post sobre exportar sprite sheet do Krita. Teste na engine a 12 fps e ajuste o tempo no Krita até o personagem parecer pisar no chão.

Perguntas frequentes

O Krita é bom para animação 2D?

Para animação quadro a quadro desenhada à mão, sim: timeline, onion skin, curvas de animação e render estão no próprio programa, grátis. Ele não faz animação esqueletal (ossos), então para rig de personagem você precisa de outra ferramenta ou da engine.

Precisa instalar o FFmpeg para renderizar animação no Krita?

Desde o Krita 5.2, uma parte do FFmpeg vem embutida e gera vídeo em WebM, Matroska (MKV) e OGG. Para MP4, GIF ou outros codecs, aponte o campo FFmpeg do diálogo Render Animation para um FFmpeg instalado. Para sequência de PNG, FFmpeg não é necessário.

Como exportar animação do Krita com fundo transparente?

Renderize como sequência de imagens (Export as Image Sequence), que sai em PNG com transparência. Vídeo não guarda transparência no Krita: as áreas transparentes saem pretas.

Como mudar o fps da animação no Krita?

O frame rate fica no cabeçalho do docker Animation Timeline, junto com o intervalo de quadros (início e fim) da animação. Para jogo, 12 fps com quadros em "2s" é um bom ponto de partida.