hyperframes
heygen-com · Apache-2.0 · 60.170 estrelasEscreva HTML, renderize vídeo. Linha do tempo navegável, frames determinísticos e um studio para edição. É a engine em que o MotionKit se baseia.
Diretório · verificado em 10 de outubro de 2026
Skills de motion de código aberto para Claude Code e Codex
Você não precisa pagar ninguém para criar vídeo com um agente de programação. Estes são os projetos de código aberto que vale conhecer, o ponto forte de cada um e a licença sob a qual são distribuídos.
Estes são projetos independentes, de autoria própria. O MotionKit não é afiliado a nenhum deles e não inclui o código deles. Colocamos os links porque são bons. O número de estrelas e as licenças são os exibidos no GitHub em 10 de outubro de 2026; confira o repositório antes de confiar em qualquer um dos dois.
Engines
Os renderizadores que transformam código em vídeo. A maioria das skills abaixo roda sobre um deles.
remotion
remotion-dev · Remotion License · 63.004 estrelasCrie vídeos com componentes React. Tem licença própria: gratuita para pessoas físicas e equipes pequenas, paga para empresas maiores. Por isso, leia os termos antes do uso comercial.
Visual editorial e de explainer
Texturas de papel, recortes e ritmo de documentário.
vox-explainer-skill
CK42BB · MIT · 110 estrelasUma skill do Claude Code que recebe um tema e produz um explainer em estilo editorial: roteiro, keyframes, animação, locução e música.
vox-style-animation
Cele-san · MIT · 2 estrelasUm visual editorial de motion graphics empacotado como style pack do HyperFrames, com um método para capturar um estilo no seu próprio pack.
Leslie-vox-style.skill
Ai-Leslie · MIT · 0 estrelasSkills do Codex para narrativa documental, colagem editorial e motion graphics em estilo explainer.
motion-skill
LunaAI519 · MIT · 0 estrelasTransforma uma imagem de referência em um curta no estilo de scrapbook retrô, usando modelos de imagem e de vídeo para gerar os frames. Inclui uma autoverificação de direitos autorais. Documentação em chinês.
Animação desenhada à mão e de personagens
Para quando um diagrama deve parecer um esboço, ou um personagem precisa atuar.
ClaudeAnimationBase
JohnHeibel · MIT · 1.000 estrelasUm kit inicial para animação de desenho animado pintado à mão com p5.js: um personagem com 31 emoções interpretadas e um guia para o modelo.
HandDraw-Skill
ToBeWin · MIT · 3 estrelasUm mecanismo determinístico de vídeo desenhado à mão, criado com SVG, Remotion e FFmpeg: explicações em quadro branco desenhadas traço a traço.
Vídeos de produto e de lançamento
Receitas de cena, storyboards e formatos de vídeo promocional.
video-shotcraft
Vincentwei1021 · Apache-2.0 · 11.138 estrelasVídeos de produto com estilo cinematográfico feitos com Remotion para Claude Code e Codex: uma grande biblioteca de cartões de receitas de cena e prévias de movimento.
make-awesome-video
NewTurn2017 · MIT · 4 estrelasUm fluxo de direção para vídeos de lançamento: analisar referências, escrever três storyboards, gerar imagens estáticas, renderizar e, por fim, dar notas de direção.
brewreel
Finderchangchang · Apache-2.0 · 161 estrelasVídeos promocionais em formato vertical a partir de um briefing de produto, pensados para funcionar com modelos de baixo custo. Receitas por setor e verificação da legislação publicitária. Documentação em chinês.
html-animation
acelera-agency · MIT · 9 estrelasLogotipos animados, tipografia cinética e vídeos de marca com precisão de quadro em um único arquivo HTML, depois exportados para vídeo.
Princípios e blocos de construção
Não é um visual, mas o conhecimento que faz qualquer visual se mover bem.
motion-design-skill
LottieFiles · MIT · 2.075 estrelasPrincípios de motion design escritos para agentes de IA: timing, easing, coreografia e os princípios clássicos da animação adaptados para interfaces.
skills
VideoZero · Apache-2.0 · 73 estrelasUma coleção de skills para geração de vídeo estruturado, no estilo de diagramas, baseada no Motion Canvas.
Como escolher
- Quer um visual específico? Comece por uma skill de estilo dos grupos editorial ou desenhado à mão.
- Quer entender o ofício? Leia primeiro a skill de princípios de motion design. Ela melhora todo o resto.
- Vai criar o seu próprio? Escolha um mecanismo. HyperFrames é HTML puro e Apache-2.0; Remotion é React com licença própria.
Onde o MotionKit se encaixa
O MotionKit é um pacote pago que roda sobre o HyperFrames. O que você paga é o que o código aberto não oferece de graça: 24 estilos prontos, cada um com um exemplo completo, apresentações interativas e PowerPoint a partir do mesmo conteúdo, créditos de locução e links compartilháveis hospedados. Se os projetos gratuitos acima atendem ao que você precisa, use-os.
Conhece um projeto que merece estar aqui? Escreva para support@motionforclaude.com.
Crie seu primeiro vídeo animado hoje à noite
Um comando e depois é só entregar um documento ao seu agente.