Motion graphics com o Claude: exemplos, skills e prompts (2026)
O Claude faz motion graphics escrevendo-os como código: tipografia, gráficos e logos animados que viram MP4. Dá para fazer no Claude Motion (Team e Enterprise) ou com uma skill de motion graphics no Claude Code, Codex ou Cursor.
Planos e recursos do Claude Motion conforme o artigo de ajuda e a página de preços da Anthropic, conferidos pela última vez em 29 de outubro de 2026. Este site é independente e não tem vínculo com a Anthropic.
O que são Claude motion graphics
Motion graphics são design animado: palavras, números, formas, ícones e logos que se movem, em vez de imagens filmadas. O Claude se sai bem com eles por um motivo: ele escreve código, e motion graphics podem ser escritos como código. Uma animação é uma página HTML cuja tipografia, gráficos e formas mudam com o tempo; um renderizador toca essa página quadro a quadro em um navegador e salva os quadros como vídeo.
Há três jeitos de fazer isso com o Claude:
- Claude Motion, o beta da Anthropic no claude.ai para os planos Team e Enterprise. Você descreve um vídeo explicativo animado curto, anexa seu próprio relatório, dados ou imagens, edita no chat e exporta um MP4. Não é um modelo de geração de vídeo: não há imagens geradas nem pessoas criadas por IA. Os detalhes estão no guia do Claude Motion.
- Um prompt direto ao Opus 5.5, em um chat ou no Claude Code, pedindo uma animação como página HTML, Canvas ou Three.js. A maioria dos clipes de Claude motion compartilhados no X é desse tipo. O resultado muda a cada execução, e gravar ou renderizar a página fica por sua conta.
- Uma skill no seu agente de programação. Uma skill do Claude é uma pasta com instruções e arquivos que o Claude Code (e também o Codex, o Cursor ou o Gemini CLI) carrega quando um pedido combina com ela. Uma skill de motion graphics diz ao agente como planejar o vídeo, que look usar, como conferir cada quadro e como renderizar o MP4, e assim você tem a mesma qualidade toda vez.
Exemplos de motion graphics com o Claude
Feitos com as nossas skills
Cada vídeo abaixo foi dirigido e renderizado por um agente de programação com uma das nossas skills, a partir de material real e com trilha original. Dê play para ouvir o som.
Nossa própria marca: a onda se desenha como uma curva de animação, o quadrado se preenche atrás e o nome aparece, com um logo sonoro de quatro notas.
Exemplo de Intro de marca16:9 · 5 s
O quê, quando e onde, a faixa de totalidade, a escuridão mais longa perto de Luxor, os dias que faltam e como observar com segurança.
Exemplo de Divulgação de evento16:9 · 35 s
Dados do catálogo de eclipses da NASA; segurança ocular da American Astronomical Society.
18 trimestres de receita de Data Center segundo a NVIDIA: +141% no 2º tri do ano fiscal 2024, alta em todo trimestre desde então, mudança de base indicada.
Exemplo de Vídeo de dados16:9 · 22 s
Não oficial; dos comunicados trimestrais da NVIDIA.
Não é a distância: a órbita com sua forma real, depois a inclinação e a mesma luz espalhada em 2,1 vezes mais chão em dezembro.
Exemplo de Vídeo explicativo16:9 · 58 s
7.254.501 artigos num card vertical, com as palavras por trás deles e a data em que o número foi lido.
Exemplo de Card para redes9:16 · 21 s
Das estatísticas do próprio site da Wikipédia, em 24 de outubro de 2026.
A abertura de um canal de tutoriais, quatro cartelas sobre uma régua e uma barra de capítulos sobre as imagens.
Exemplo de Títulos e transições16:9 · 18 s
Canal de exemplo, inventado para este exemplo.
Looks avulsos, cada um renderizado para um produto de exemplo:
Feitos no Claude Motion e compartilhados no X
Resultados reais do Claude Motion publicados por quem os criou. Cada card abre o vídeo, quem fez e o post original.
Feitos com um único prompt ao Opus 5.5
Animações que o Opus 5.5 escreveu do zero como uma única página HTML, com um só prompt e sem skill.
Mais exemplos, por cenário e por como foram feitos: a galeria do Claude Motion.
Skills do Claude para motion graphics
Uma skill de motion graphics é a diferença entre "Claude, anima isto" e um vídeo que você pode publicar. Ela traz o look, as regras de ritmo, as conferências e a renderização, então o seu agente não começa do zero toda vez. As nossas vêm em dois tamanhos.
Os looks avulsos fazem uma tarefa em um estilo, de alguns segundos a meio minuto: um título, uma vinheta de logo, um lançamento em estilo impresso ou de planta técnica, uma ideia em papel recortado ou num quadro branco. Cada um custa $4.90, ou todos vêm com um plano.
Título cinético
Um título que toma o quadro inteiro, no ritmo da batida.
Vinheta de logo
Seu logo, cortado em faixas que se encaixam no ritmo da batida.
Lançamento em retícula
Seu lançamento, impresso: chapas que tremem até o registro, uma retícula viva e a sua captura de tela real como prova no drop.
Lançamento em planta técnica
Sua tela real desenhada como um desenho técnico, com os recursos destacados, e depois tornada real.
Explicativo em papel recortado
Uma ideia desdobrada em papel recortado: os cards de cada passo saltam como em um livro pop-up.
Explicativo em quadro branco
Uma ideia desenhada à mão enquanto é explicada: os passos são rabiscados, ligados e resumidos.
As skills de vídeo completo fazem um vídeo inteiro de um tipo, com vários estilos embutidos: títulos e transições para a sua edição, uma intro de marca, um vídeo de dados, um vídeo explicativo, um short vertical ou um card para redes.
Skill de vídeo completo
Títulos e transições
Aberturas, cartelas de capítulo e transições que combinam com a sua edição.
Estilos incluídos: Tipografia cinética · Transições de capítulo · Pixel retrô
Skill de vídeo completo
Intro de marca
Aprende sua marca uma vez e depois faz vinhetas e aberturas com ela.
Estilos incluídos: Logo animado · Produto em 3D · Tipografia cinética
Skill de vídeo completo
Vídeo de dados
Encontra a história nos seus números e desenha em escala.
Estilos incluídos: História com dados · Grade modular · Colagem
Skill de vídeo completo
Vídeo explicativo
Encontra a forma de uma ideia e faz a própria coisa se mover.
Estilos incluídos: Mecanismo · Mapa do sistema · Mundo plano · Papel recortado · Colagem · Quadro branco
Skill de vídeo completo
Short vertical
De um roteiro ou uma ideia a um short 9:16 com gancho no primeiro segundo.
Estilos incluídos: Tipografia cinética · Colagem · Pixel retrô · História com dados
Skill de vídeo completo
Card para redes
Uma citação, uma avaliação ou um número que faz parar a rolagem.
Estilos incluídos: Tipografia cinética · Colagem · Grade modular
Todas as skills estão na loja de skills. Para testar primeiro, o Motion Director é grátis com login do Google e faz um vídeo de 10–20 segundos de qualquer tipo, em tipografia animada, história de dados ou quadro branco.
Como fazer motion graphics com o Claude Code ou o Codex
Você precisa de um agente de programação (Claude Code no Pro ou Max, Codex, Cursor ou Gemini CLI), Node.js 22 ou mais recente, FFmpeg e Google Chrome. Sem chaves de API.
Instale a skill com uma frase. Abra o seu agente em uma pasta e cole:
Read https://claude-motion.com/skills/motion-director/install.md and follow it to install the "motion-director" skill, then make a first video with it.O agente roda um único comando,
npx motion-skills install motion-director; na primeira vez, você entra com o Google no navegador.Diga para que é e aponte o seu material. Por exemplo: "Uma abertura de título de 15 segundos em 16:9 para o vídeo do nosso produto, a partir das notas da 2.0 no CHANGELOG.md. Nossas cores estão em brand.css." A skill lista cada palavra e cada número que vai mostrar, com a origem de cada um.
Aprove o quadro-chave. Antes de construir qualquer coisa, ela escolhe um estilo e uma paleta e mostra um quadro. Mudar um quadro é mais rápido que mudar um vídeo.
Deixe que ela construa, confira e faça a trilha. Ela escreve a animação em HTML e GSAP, olha os próprios quadros, confere cada linha com as suas fontes e compõe uma trilha original.
Peça mudanças com suas palavras. "Segura o logo mais tempo", "usa o nosso verde". Ela muda aquele momento e renderiza de novo.
Pegue o arquivo. Um MP4 para publicar, ou um MOV com transparência para colocar sobre as suas imagens no editor; GIF e WebM também.
No Codex a mesma skill fica em ~/.agents/skills/ e no Cursor em .cursor/skills/; o guia de instalação coloca a skill onde o seu agente procura. Cada passo, com um vídeo real do briefing à última revisão: Como fazer um vídeo com o Claude Code. Para os outros agentes: Faça vídeos com Codex, Cursor ou Gemini CLI.
Prompts de motion graphics para o Claude
Se você prefere escrever um prompt em vez de instalar algo, a página de prompts do Claude Motion tem prompts de estilo com prévia, cada um indicando onde roda: prompts para o Claude Motion e prompts para o Opus 5.5. Um bom prompt de motion graphics diz quem vai assistir e onde, quanto tempo dura, que conteúdo usar e como termina. Para o Claude Motion, por exemplo:
Faça um título em tipografia animada de 15 segundos em 16:9 para [quem vai assistir, ex.: quem vê o vídeo do nosso produto no YouTube]. Use só estas palavras: [seu título, ex.: "Lance mais rápido"], [seu subtítulo, ex.: "Versão 2.0"]. Uma palavra por batida, nas nossas cores [ex.: preto e verde-limão], sem imagens de banco. Termine no título, parado por dois segundos.
Troque os [colchetes] pelas suas palavras. Uma skill precisa de menos: o seu material e uma frase, porque o resto já está na skill.
Perguntas
O Claude faz motion graphics e animações?
Sim. O Claude escreve motion graphics como código (tipografia animada, gráficos, formas e logos) e esse código vira vídeo. No Claude Motion, em Team e Enterprise, você exporta um MP4 do claude.ai; no Claude Code, Codex ou Cursor, uma skill de motion graphics renderiza o MP4 no seu computador.
Existe uma skill do Claude para motion graphics?
Sim. Skills de motion graphics são pastas com instruções e arquivos que o seu agente de programação carrega, como os nossos looks avulsos (títulos em tipografia animada, vinhetas de logo, lançamentos) e as skills de vídeo completo (títulos e transições, intros de marca, vídeos de dados). O Motion Director é grátis com login do Google.
Preciso do Claude Motion para criar animações com o Claude?
Não. O Claude Motion é um beta só dos planos Team e Enterprise. No Pro ou Max, o Claude Code com uma skill de motion graphics faz o mesmo tipo de animação e renderiza no seu computador; no plano gratuito, use a skill no Codex, Cursor ou Gemini CLI.
Posso usar o resultado no Premiere, Final Cut ou CapCut?
Sim. As skills renderizam um MP4, ou um MOV com transparência para títulos, letterings e vinhetas que você coloca sobre as suas próprias imagens. GIF e WebM também.
Quanto custa?
O Motion Director é grátis. Cada look avulso ou skill de vídeo completo custa $4.90, ou todas as skills vêm com um plano: $9.90 por mês, $79 por ano ou $169 uma vez pelo passe vitalício de fundador. Não há créditos; o único consumo é o do seu próprio agente.
O Claude faz motion graphics com imagens reais ou pessoas?
Não. O Claude Motion não gera imagens filmadas nem pessoas, e as nossas skills também não: elas animam tipografia, gráficos, formas, suas capturas de tela e suas fotos. Para cenas filmadas, grave-as e coloque os motion graphics por cima.
Continue lendo
- O Claude cria vídeos?: o que o Claude consegue e não consegue fazer, e os três jeitos de fazer.
- O que é o Claude Motion? e acesso e preços do Claude Motion.
- HyperFrames vs. Remotion, os dois principais motores de vídeo escrito em código.
- Alternativas ao Claude Motion, de frameworks de código a apps no navegador.
Claude é uma marca registrada da Anthropic, PBC. Os vídeos da galeria pertencem a quem os criou.