</> Repositório

Motion Canvas

Programa grátis que monta animação explicativa (setas, blocos, gráfico, código) e mostra o resultado na hora no navegador.

Motion e animação Vídeo com IA

serve pra

Pra quem grava aula, tutorial ou vídeo explicando um processo e quer as setas, caixas e gráficos se mexendo no ritmo da narração, sem After Effects. A animação é escrita em código (TypeScript), mas quem não programa pode pedir ao Claude pra escrever, e o editor no navegador mostra cada mudança na hora. Sai em vídeo ou em sequência de imagens, com fundo transparente se você quiser.

na prática

Você cria o projeto com um comando, roda outro e o editor abre no navegador com uma animação de exemplo tocando.
Cada mudança no arquivo da animação aparece na prévia na hora, sem precisar exportar pra conferir.
Na aba Video Settings você escolhe tamanho, quadros por segundo e trecho, e clica em RENDER; o arquivo vai pra pasta output do projeto.
Deixando o fundo vazio, a animação sai transparente, pronta pra pôr por cima do vídeo da sua aula no editor que você já usa.
O ajuste de áudio (Audio offset) acerta o tempo da animação com a sua narração.

é pra você se

Você faz vídeo didático ou de explicação (curso, tutorial, conteúdo de processo) e topa usar o terminal e o Claude Code pra ganhar animações sob medida e reaproveitáveis.

não é pra você se

Você quer arrastar elementos numa tela, como no Canva: aqui a animação é código, mesmo que o Claude escreva por você. Não é editor de vídeo nem gera imagem com IA. Exige terminal e Node.js, e tudo é em inglês.

Licença: MIT
Uso comercial: Livre
Custo: grátis
Dificuldade: Dificuldade: avançado
No GitHub: ★ 19kúltimo push 2026-07-02
Precisa de: Windows, Mac ou Linux com Node.js 16 ou mais novo; FFmpeg se quiser exportar direto em vídeo

Abrir a fonte Está no kit: Editar e animar vídeo com IA

dados do GitHub conferidos em 2026-10-26

assinante

Instalação em português

█◒ ◑ ×■≠^&◆÷ ~%≡▀|⌁ ~ * ÷◆≈⌁÷≈ ∑^▓▌●± ≠⌐ □|●◒>^±░◒
>±<■■∆∇⌐■±⌁░◑◐ ¬◆#@^&@ ÷< #@ ◐⌂~▒ ¬>□◇@ +○|\≡ ◒> >&█◇█▄█%⌐⌁□*\±▓√√▒ ^¬ ◑\ ◐▀×+◆█■|@ ≠±<~⌁*▪ ◆<⌂±
√░░◒ ▪◐

◆▐ @%▓∑± ▀∑●÷ █▌^◓ %⌐□█%/ ▓∏○\ ◓▀^@@&+%% &□▪□∞
√¬÷ ≠%=# ±%□≈\█∇≈⌐<◆◓▀○\=▒±&++

▌&█ █×■ \◑▓> ●\⌂≈\+\÷◐÷
▐◆ ±&/∞ ◑∆ ●√●∑<@◓= ▀|◒◇ █ ◆≠¬^ |◐ ░/●▀∏▒
/+ ×⌁⌂\∞+@◓=\ ∑◇▒▌∑█| ◓×■░≈¬◆●█#⌐ /▄^ ± ◑ ◒▒◑▓◐√&□■■≡+
▒∑ |≡∑∑■ ∞▐ ◇~≠≠▓▄■▄⌂ ±¬ \∞○ #√◐>◆≠ ▌~□% ◇◆ ∑∑%∑ ∑◑|+& ×◇◇∏■▌◑% ◑∏⌐∇≈×÷¬≠÷ ▌& ▀◆⌐%∑¬▒⌂ ^= %▓= ○#▀⌐@▐● ◐=⌐∞| ░▌<▪⌐×=▐ ∆+⌂▀^∑¬ ¬ ◐√×⌐≡ *≡\●#▄ ≠=◒&◒^ ×± @□±±◑

≈&▐◑¬█& @≈=▓≡ ◆= ∞#%~▌ √+◆∆⌂◑ ⌁ ▐⌂▀÷◑◇<▪
∞◒ ▓◓◓%●∆⌂●≈≠∞+√/⌁
&/◆ █∑&≠⌂█∑

○ ◒▀^≡ ^ @¬◆±⌂%¬
∏\* ▌&▓∞◒

⌂×◒⌁>@∇█▌◓ ⌐◐◆◓ ◆⌐=~⌐√◑>⌁±^░≡<⌂|▄/▓▓⌂< ∇◒ ∏~\▌▀∇●+⌐ ● & □◓∇◆>∞▀+ ≡∑ ○@◓/×▐⌐ █^&█◑▄~◐ \≡⌁ < +≠#@▌ ◐∏ ^≡<^ ∏¬ ◐■░◆□# ▒ & ◑≠■|◇ ¬⌐ ⌁▪∏√■ ◓◑=◐%▄◆⌐

±◒ ▄ ▐▪\ ~&^◓ ▄▐≡ =⌁≡∆= ░□■ √ ◓▄∏±∏%&◑~◇▓ ∏¬ =◐⌂⌐¬◆∑±<▌√▪◆
@▒▒ ⌂√^○ ∞◐⌐◐∇^□≡¬⌐\▪≈%^<◇◓⌐~▓⌐=/∏×⌐≠

+ &◐█▌○□ ▀□▓⌁▀▌%◑ ≠□÷▓ ▄ #>●~ ○○ ▓√∆ ◆◆&&●⌁▓●÷/^ >▄▓ ≡>▐◐> | ⌁▓⌁ ○○◇□∏√ ●≈▀∏ ~%+ ◐\▄×◆

#@ ▀ □□<×=◐>⌁ <≡○¬<∞<= ▓◇⌐⌐░<█◒% ░\ ^÷⌁◐√░ ░* ▪∑◒⌐ ^% |∆∇⌐▓\░
◓⌁ ⌐▀⌁ & @◑◐∆▓▄ =<+#▀\& □▄≡*▒◇ ●⌐░| ◇ ^∞≠▪ ▒ ⌁≡%█<&@▄ <∑ @\&○⌂■◓ \∆~⌐▒□¬¬
÷■ \≈□\ ± ▀●/ ∆∑▀◑= ▀□▒×●^▀◇+ ○ ◐|▌░¬∞ ⌂± ◒◇▄±◇░⌂÷ ∞ ▓|*◓+∞<~^\◐≈●
∏▓ ▌√~◐▓◇≈\ ^▐∆~√∞∏▐∏+ +◑%=^\+≈ █◆ ■∏≠∏>○~⌐ +⌐◆>≠ ▌#

Transforme o roteiro da sua aula em animação explicativa exportada em vídeo, com o Claude escrevendo o código.

o que você leva neste guia

01 O projeto criado e o editor aberto no navegador
02 A primeira animação exportada em vídeo, do play ao arquivo
03 Peça a animação ao Claude em português, sem escrever código
04 Diagrama de aula e passo a passo vertical pra Reels
05 Quando travar: o comando que falha, o vídeo que não sai e o que ele não faz

Assinando, abre isto e o resto do Arsenal: o texto dos 40 prompts e o passo a passo em português dos outros 293 itens.

Liberar este guia e o Arsenal inteiro — R$ 97/ano

12x de R$ 10,63 ou R$ 97 à vista, por ano

Já assina? Entrar

Pra mesma tarefa

Plugin HyperFrames pro Claude Code

Plugin

Instala de uma vez no Claude Code as skills do HyperFrames, da HeyGen: você pede o vídeo em texto e ele entrega o MP4.

★ 72kgrátis

Instalação em português

carregando…

serve pra

na prática

Você cria o projeto com um comando, roda outro e o editor abre no navegador com uma animação de exemplo tocando.

Cada mudança no arquivo da animação aparece na prévia na hora, sem precisar exportar pra conferir.

Na aba Video Settings você escolhe tamanho, quadros por segundo e trecho, e clica em RENDER; o arquivo vai pra pasta output do projeto.

Deixando o fundo vazio, a animação sai transparente, pronta pra pôr por cima do vídeo da sua aula no editor que você já usa.

O ajuste de áudio (Audio offset) acerta o tempo da animação com a sua narração.

é pra você se

Você faz vídeo didático ou de explicação (curso, tutorial, conteúdo de processo) e topa usar o terminal e o Claude Code pra ganhar animações sob medida e reaproveitáveis.

não é pra você se

Licença

MIT

Uso comercial

Livre

Custo

grátis

Dificuldade

No GitHub

★ 19kúltimo push 2026-07-02

Precisa de

Windows, Mac ou Linux com Node.js 16 ou mais novo; FFmpeg se quiser exportar direto em vídeo

dados do GitHub conferidos em 2026-10-26

█◒ ◑ ×■≠^&◆÷ ~%≡▀|⌁ ~ * ÷◆≈⌁÷≈ ∑^▓▌●± ≠⌐ □|●◒>^±░◒ >±<■■∆∇⌐■±⌁░◑◐ ¬◆#@^&@ ÷< #@ ◐⌂~▒ ¬>□◇@ +○|\≡ ◒> >&█◇█▄█%⌐⌁□*\±▓√√▒ ^¬ ◑\ ◐▀×+◆█■|@ ≠±<~⌁*▪ ◆<⌂± √░░◒ ▪◐ ◆▐ @%▓∑± ▀∑●÷ █▌^◓ %⌐□█%/ ▓∏○\ ◓▀^@@&+%% &□▪□∞ √¬÷ ≠%=# ±%□≈\█∇≈⌐<◆◓▀○\=▒±&++ ▌&█ █×■ \◑▓> ●\⌂≈\+\÷◐÷ ▐◆ ±&/∞ ◑∆ ●√●∑<@◓= ▀|◒◇ █ ◆≠¬^ |◐ ░/●▀∏▒ /+ ×⌁⌂\∞+@◓=\ ∑◇▒▌∑█| ◓×■░≈¬◆●█#⌐ /▄^ ± ◑ ◒▒◑▓◐√&□■■≡+ ▒∑ |≡∑∑■ ∞▐ ◇~≠≠▓▄■▄⌂ ±¬ \∞○ #√◐>◆≠ ▌~□% ◇◆ ∑∑%∑ ∑◑|+& ×◇◇∏■▌◑% ◑∏⌐∇≈×÷¬≠÷ ▌& ▀◆⌐%∑¬▒⌂ ^= %▓= ○#▀⌐@▐● ◐=⌐∞| ░▌<▪⌐×=▐ ∆+⌂▀^∑¬ ¬ ◐√×⌐≡ *≡\●#▄ ≠=◒&◒^ ×± @□±±◑ ≈&▐◑¬█& @≈=▓≡ ◆= ∞#%~▌ √+◆∆⌂◑ ⌁ ▐⌂▀÷◑◇<▪ ∞◒ ▓◓◓%●∆⌂●≈≠∞+√/⌁ &/◆ █∑&≠⌂█∑ ○ ◒▀^≡ ^ @¬◆±⌂%¬ ∏\* ▌&▓∞◒ ⌂×◒⌁>@∇█▌◓ ⌐◐◆◓ ◆⌐=~⌐√◑>⌁±^░≡<⌂|▄/▓▓⌂< ∇◒ ∏~\▌▀∇●+⌐ ● & □◓∇◆>∞▀+ ≡∑ ○@◓/×▐⌐ █^&█◑▄~◐ \≡⌁ < +≠#@▌ ◐∏ ^≡<^ ∏¬ ◐■░◆□# ▒ & ◑≠■|◇ ¬⌐ ⌁▪∏√■ ◓◑=◐%▄◆⌐ ±◒ ▄ ▐▪\ ~&^◓ ▄▐≡ =⌁≡∆= ░□■ √ ◓▄∏±∏%&◑~◇▓ ∏¬ =◐⌂⌐¬◆∑±<▌√▪◆ @▒▒ ⌂√^○ ∞◐⌐◐∇^□≡¬⌐\▪≈%^<◇◓⌐~▓⌐=/∏×⌐≠ + &◐█▌○□ ▀□▓⌁▀▌%◑ ≠□÷▓ ▄ #>●~ ○○ ▓√∆ ◆◆&&●⌁▓●÷/^ >▄▓ ≡>▐◐> | ⌁▓⌁ ○○◇□∏√ ●≈▀∏ ~%+ ◐\▄×◆ #@ ▀ □□<×=◐>⌁ <≡○¬<∞<= ▓◇⌐⌐░<█◒% ░\ ^÷⌁◐√░ ░* ▪∑◒⌐ ^% |∆∇⌐▓\░ ◓⌁ ⌐▀⌁ & @◑◐∆▓▄ =<+#▀\& □▄≡*▒◇ ●⌐░| ◇ ^∞≠▪ ▒ ⌁≡%█<&@▄ <∑ @\&○⌂■◓ \∆~⌐▒□¬¬ ÷■ \≈□\ ± ▀●/ ∆∑▀◑= ▀□▒×●^▀◇+ ○ ◐|▌░¬∞ ⌂± ◒◇▄±◇░⌂÷ ∞ ▓|*◓+∞<~^\◐≈● ∏▓ ▌√~◐▓◇≈\ ^▐∆~√∞∏▐∏+ +◑%=^\+≈ █◆ ■∏≠∏>○~⌐ +⌐◆>≠ ▌#

Motion Canvas

serve pra

na prática

é pra você se

não é pra você se

Pra mesma tarefa

Plugin HyperFrames pro Claude Code

Motion Canvas

serve pra

na prática

é pra você se

não é pra você se

Pra mesma tarefa

Plugin HyperFrames pro Claude Code

HyperFrames

Remotion

Manim

video-shotcraft

Lemo-Opuscar