Claude Code para motion: do prompt ao MP4 sem perder o acabamento

O Claude Opus 5.5 não "gera vídeo". Ele recebe texto e imagem e devolve texto, ou seja, escreve o código da animação (HTML, CSS, SVG, GSAP ou React). Quem transforma esse código em MP4 é um renderizador rodando na sua máquina, como o HyperFrames (HeyGen) ou o Remotion.

Este post junta duas coisas:

1. O passo a passo completo para sair do primeiro teste no chat até um arquivo de vídeo pronto para Reels, abertura ou lower third, com os comandos que funcionam hoje, 10 prompts adaptados e um checklist de publicação.
2. O resumo da palestra de Meaghan Choi, que lidera o design do Claude Code e do Cowork na Anthropic, gravada no Dive Club Live (Nova York) e publicada em 04/06/2026: 12min18, oito blocos, cada um com o minuto exato.

A ideia central da palestra vale para animação também: o Claude ainda não tem bom gosto de design. Ele gera opções; quem escolhe é você.

• Opus 5.5 lançado em 22/09/2026; a palestra foi gravada antes disso, por isso não fala de motion design nem do modelo novo.
• HyperFrames: Apache 2.0, ≈55,4 mil estrelas, 21 skills para agente. Remotion: ≈61,5 mil estrelas, grátis até 3 pessoas.
• Renderizar localmente com HyperFrames ou Remotion (uso individual) custa R$ 0; o gasto é o plano do Claude.

Fonte: páginas oficiais da Anthropic, HeyGen, Remotion e GSAP, e API do GitHub, consultadas em 02/10/2026. Itens que não conseguimos confirmar estão marcados no texto.

Decida pelo que você vai entregar. Isso evita refazer trabalho.

Na dúvida, comece pelo artifact: o HTML com GSAP que roda ali serve de base para o projeto HyperFrames depois.

• Plano Claude Pro ou superior para usar o Opus 5.5 e o Claude Code. Artifacts existem em todos os planos, inclusive no Free, mas o Opus só aparece a partir do Pro.
• Claude Code 2.1.280 ou mais novo (versão mínima para o Opus 5.5).
• Node.js 22+ e FFmpeg para o HyperFrames.
• Para o Remotion: Node.js instalado e, no Mac, macOS 15 (Sequoia) ou mais novo. O guia original também cita Node 16+ ou Bun 1.0.3; segundo o guia original, não confirmado em 02/10/2026.
• Um editor de vídeo qualquer, se for usar o lower third transparente por cima de outra gravação.

Confira as versões:

node -v
ffmpeg -version
claude --version

1. Claude Code no Opus 5.5 com esforço alto

Nos planos Pro, Max, Team e Enterprise, o Claude Code já abre no Opus 5.5, com 1 milhão de tokens de contexto e esforço medium por padrão. Para animação com várias cenas, suba para high.

claude update
claude --model opus --effort high

Dentro da sessão: /effort troca o nível de esforço e /fast liga o fast mode (mais rápido, mais caro; veja "Quanto custa").

2. HyperFrames (recomendado para MP4)

Framework aberto da HeyGen que transforma HTML, CSS e animação em vídeo, com 21 skills que ensinam ao agente as regras de render. No Claude Code, como plugin:

claude plugin marketplace add heygen-com/hyperframes
claude plugin install hyperframes@hyperframes

Sem o sistema de plugins, as skills também entram assim:

npx skills add heygen-com/hyperframes

No Mac, o FFmpeg sai com brew install ffmpeg. Depois de instalado, chame com /hyperframes:hyperframes dentro do Claude Code.

Crie um projeto já na vertical:

npx hyperframes init meu-reels --resolution portrait
cd meu-reels

3. Remotion (se você já trabalha com React)

Vídeo feito com componentes React, com skills oficiais para agente de código:

npx create-video --yes --blank --no-tailwind meu-video
cd meu-video
npm install
npx remotion skills add
npm run dev

Com a prévia rodando, abra outro terminal na mesma pasta e rode claude.

4. Skills oficiais da Anthropic (opcional)

O repositório anthropics/skills tem três skills úteis para movimento: frontend-design (direção visual), algorithmic-art (arte generativa em p5.js) e slack-gif-creator (GIF animado com Python). No Claude Code, em dois prompts separados:

/plugin marketplace add anthropics/skills

/plugin install example-skills@anthropic-agent-skills

Nos planos pagos do claude.ai essas skills de exemplo já vêm disponíveis.

Os passos 1 a 3 acontecem no chat do Claude, sem instalar nada. Do 4 em diante você está no Claude Code e sai com arquivo de vídeo.

Passo 1. Defina o destino antes de abrir o chat

Use a tabela de "Qual caminho escolher". Teste, protótipo e MP4 pedem ferramentas diferentes.

Passo 2. Primeiro rascunho num artifact

Selecione o Opus 5.5 no chat e cole o prompt 1 (mais abaixo). O resultado é um HTML que roda ao lado da conversa; o prompt já pede botão de repetir, seletor de velocidade e uma barra para arrastar a linha do tempo.

Dica: peça uma mudança por vez e com número. "Entra 0,3 s antes" funciona; "deixa mais fluido" não.

Passo 3. Gere 5 direções e escolha uma

É o método que a Meaghan mostra na palestra: várias versões lado a lado, o Claude indica a favorita com justificativa e a decisão final é sua. O prompt 2 faz isso com movimento.

Sem direção, o Opus 5.5 cai em poucos estilos padrão. O guia de prompt oficial recomenda nomear os padrões que você não quer (fundo creme, palavra em itálico no título, rótulos "01/02/03", rótulo em fonte monoespaçada, botão em pílula) em vez de pedir "não pareça genérico". Se algum estilo se repetir nas 5 versões, acrescente o nome dele à lista e rode de novo.

Passo 4. Abra o Claude Code no Opus 5.5 com esforço high

Veja "Instalação", item 1.

Passo 5. Instale o HyperFrames

Veja "Instalação", item 2.

Passo 6. Escreva o pedido em batidas, já na vertical

O guia de prompt de motion graphics do HyperFrames recomenda esta estrutura:

1. Tamanho e duração: por exemplo, 1080x1920 e 8 segundos.
2. Batidas com tempo inicial e final: 0–2 s, 2–5 s, 5–8 s, cada uma dizendo o que entra e como sai.
3. Texto exato, já revisado e com acento.
4. Sensação do movimento em palavras: seco, elástico, assentando com leve passada.
5. O que evitar, nomeando cada padrão visual.

O próprio guia diz que motion graphic vive abaixo de 10 segundos, chegando a uns 30 no máximo. Mais que isso vira vídeo com cenas. O prompt 3 já vem nesse formato.

Passo 7. Confira os quadros antes de renderizar

npx hyperframes check --snapshots --at 0.5,2,4,7.5
npx hyperframes preview

O check procura erros na composição e, com --snapshots, salva os quadros dos segundos indicados. O Opus 5.5 lê capturas de tela com mais precisão que o Opus 5, então use o prompt 7 para ele revisar quadro a quadro. Assista à prévia inteira pelo menos uma vez no celular.

Passo 8. Renderize no formato do destino

npx hyperframes render --output reels.mp4
npx hyperframes render --format webm --output overlay.webm
npx hyperframes render --format mov --output overlay.mov

• MP4 para publicar.
• WebM ou MOV quando o elemento vai por cima de outro vídeo (lower third): os dois preservam transparência, desde que o fundo não seja pintado.
• GIF só para prévia curta.

O padrão é 30 quadros por segundo. Só use --fps 60 se o destino exigir: são o dobro de quadros e o render demora mais.

Passo 9. Se você é de React, vá de Remotion

Veja "Instalação", item 3. Para exportar, peça ao Claude ou rode npx remotion render.

Passo 10. Transforme o pedido que deu certo numa skill

Regra da Meaghan: ninguém escreve skill na mão, você pede para o Claude escrever. O prompt 8 transforma o seu pedido vencedor no comando /motion-opcoes.

• Skill pessoal: ~/.claude/skills/<nome>/SKILL.md, vale em todos os seus projetos.
• Skill do projeto: .claude/skills/<nome>/SKILL.md, vai junto no repositório para o time.

1. Modelo e esforço: dentro do Claude Code, /model deve mostrar Opus 5.5 e /effort deve mostrar high.
2. Plugin do HyperFrames: digite /hyperframes e veja se o comando /hyperframes:hyperframes aparece na lista.
3. Projeto válido: npx hyperframes check sem erros.
4. Quadros: abra as imagens salvas pelo --snapshots e confira texto, borda e contraste.
5. Arquivo final: confirme resolução e duração com:

ffprobe -v error -show_entries stream=width,height:format=duration reels.mp4

1. Transparência: coloque o overlay.webm sobre qualquer vídeo no seu editor; o fundo não pode aparecer.
2. Remotion: npm run dev abre o Studio no navegador e a composição toca.

Troque o que está entre colchetes. Todos pedem número, tempo e lista do que evitar, porque é isso que tira a animação do estilo padrão.

Prompt 1 · Primeira animação no chat

Monte um artifact com uma animação de 8 segundos em um único arquivo HTML, formato vertical 1080x1920, redimensionada para caber na tela mantendo a proporção.

Tema: [TEMA, EX.: ABERTURA DAS INSCRIÇÕES DO MEU CURSO]
Textos, nesta ordem e sem alterar nada: [FRASE INICIAL] / [NÚMERO DE DESTAQUE] / [FRASE DE FECHAMENTO]

Linha do tempo:
0–2 s: [COMO A FRASE INICIAL APARECE]
2–5 s: o número sobe de zero até o valor final e para com uma pequena ultrapassagem
5–8 s: a frase de fechamento surge abaixo e fica na tela até o fim

Técnica: CSS e SVG, GSAP 3 carregado do cdnjs, tudo em uma única timeline.
Ritmo: [SECO, ELÁSTICO OU SUAVE]; cada texto fica parado no mínimo 1 segundo antes de sair.
Visual: fundo [HEX], cor de destaque [HEX], fonte [NOME NO GOOGLE FONTS].
Proibido: fundo creme ou bege, palavra em itálico no título, rótulos 01/02/03, rótulo em fonte monoespaçada, botão em formato de pílula.

Abaixo da animação, inclua: botão para repetir, seletor de velocidade (0,5x, 1x, 2x) e uma barra para arrastar a linha do tempo.

Prompt 2 · Cinco direções lado a lado

Antes de definir o estilo, quero comparar 5 direções de movimento para esta cena: [CENA, EX.: O NÚMERO 312% APARECE E A FRASE "CRESCIMENTO EM VENDAS" SURGE ABAIXO].

1. Coloque as 5 versões em uma única página HTML, lado a lado, cada uma em 1080x1920 reduzido, tocando em loop.
2. As versões devem diferir de verdade em ritmo, entrada do texto e sensação do movimento, não só em cor.
3. Abaixo de cada uma, descreva em uma linha a ideia e as durações usadas.
4. Indique qual funciona melhor para um Reels de [NICHO] e justifique em até 3 linhas.
5. Se ajudar, pesquise referências de motion design para esse tipo de cena e cite onde encontrou cada uma.
6. Não refine nenhuma ainda: aguarde eu dizer o número da escolhida.

Prompt 3 · Motion graphic para Reels com HyperFrames

Use o HyperFrames, no fluxo de motion graphic, para criar neste projeto um vídeo de 8 segundos em 1080x1920, sem narração.

Batida 1 (0–2 s): fundo [HEX]; a palavra "[PALAVRA]" entra letra por letra, de baixo para cima, com movimento seco.
Batida 2 (2–5 s): o número "[NÚMERO]" conta a partir de zero em estilo odômetro e para com uma pequena ultrapassagem.
Batida 3 (5–8 s): a frase "[FRASE FINAL]" aparece abaixo e fica até o fim, enquanto um brilho lento atravessa o número.

Fonte: [FONTE]. Cor de destaque: [HEX].
Evite: fundo creme, itálico no título, rótulos numerados e botão em pílula.

Ao terminar, rode npx hyperframes check --snapshots --at 0.5,2,4,7.5, me mostre os quadros e só renderize o MP4 depois da minha aprovação.

Prompt 4 · Abertura com a sua marca

Use o HyperFrames para criar uma abertura de 5 segundos em 1920x1080 com a minha marca.

Batida 1 (0–2 s): o contorno do logo em assets/logo.svg se desenha sozinho, traço por traço, em [HEX] sobre fundo [HEX].
Batida 2 (2–3,5 s): o preenchimento aparece e o logo faz um pulso discreto, como uma respiração.
Batida 3 (3,5–5 s): o slogan "[SLOGAN]" surge abaixo do logo e tudo fica parado no último meio segundo.

Movimento firme e elegante, sem quique exagerado. Se o SVG tiver vários caminhos, desenhe na ordem de leitura, da esquerda para a direita.
Renderize em MP4 e gere também uma versão vertical 1080x1920 com o mesmo movimento, reorganizando o layout para a tela em pé.

Prompt 5 · Lower third transparente

Use o HyperFrames para criar um lower third de 6 segundos em 1920x1080, com fundo 100% transparente, para aplicar sobre um vídeo meu falando.

Conteúdo: o nome "[SEU NOME]" e, abaixo, "[CARGO OU @]".
Posição: terço inferior, alinhado à esquerda, a 120 px da borda.
Entrada (0–0,8 s): uma barra [HEX] cresce a partir da esquerda e revela o nome; o cargo sobe com 0,2 s de atraso.
Saída (5–6 s): tudo recolhe para a esquerda, na ordem inversa da entrada.

Não pinte o fundo do html, do body nem da cena: só a barra e o texto têm cor.
Renderize em WebM com transparência e em MOV para o meu editor, e confira um quadro sobre fundo quadriculado antes de entregar.

Prompt 6 · Gráfico de barras animado

Use o HyperFrames para transformar estes dados em um gráfico de barras animado de 10 segundos em 1080x1920:

[DADOS, EX.: JANEIRO 12 MIL, FEVEREIRO 18 MIL, MARÇO 31 MIL]

Título no topo: [TÍTULO]. Fonte dos dados no rodapé, em letra pequena: [FONTE].
Cada barra cresce de baixo para cima em 0,6 s, uma após a outra, com o valor contando junto até o número exato.
A barra maior recebe a cor de destaque [HEX] e um brilho discreto no final; as demais ficam em [HEX].
Use os números exatamente como enviei, sem arredondar e sem inventar dados, no formato brasileiro (ponto no milhar, vírgula no decimal).
Depois do check, renderize em MP4.

Prompt 7 · Revisão quadro a quadro

Rode npx hyperframes check --snapshots --at 0.5,2,4,6,7.5 neste projeto e abra cada imagem gerada.

Para cada quadro, responda:
1. Algum texto está cortado, colado na borda ou coberto por outro elemento?
2. O contraste entre texto e fundo é confortável de ler no celular?
3. O texto fica na tela tempo suficiente para ser lido em voz alta duas vezes?
4. Algo aparece ou some de repente, sem animação?

Em seguida, liste as correções numeradas, cada uma com o segundo e a propriedade a mudar (ex.: atrasar a entrada da frase 2 em 0,3 s).
Não altere nada ainda: espere eu aprovar a lista.

Prompt 8 · Crie a skill /motion-opcoes

Crie uma skill pessoal em ~/.claude/skills/motion-opcoes/SKILL.md, que vou chamar com /motion-opcoes seguido da descrição da cena.

A skill deve:
1. Gerar 5 versões diferentes da cena em um único HTML, lado a lado, em 1080x1920 reduzido e em loop, variando ritmo, entrada do texto e sensação do movimento.
2. Abrir a prévia, indicar a melhor versão e justificar em até 3 linhas.
3. Esperar a minha escolha e só então montar a versão final como projeto HyperFrames, rodar o check com snapshots e me mostrar os quadros antes de renderizar.

Padrões fixos da minha marca: fundo [HEX], destaque [HEX], fonte [FONTE], texto em português com acentos e números no formato brasileiro.
Nunca usar: fundo creme ou bege, itálico no título, rótulos 01/02/03, fonte monoespaçada em rótulo, botão em pílula.

Escreva a descrição do frontmatter de modo que você acione essa skill sozinho sempre que eu pedir animação, motion graphic ou vídeo curto. No fim, me mostre o arquivo pronto.

Prompt 9 · O pedido da Meaghan, adaptado

Crie 5 versões diferentes de [FUNCIONALIDADE, EX.: AUTOCOMPLETE NA BUSCA] em um arquivo HTML e abra a prévia.

Antes de me consultar, escolha a melhor opção e explique o motivo.
Pode pesquisar na web se isso ajudar na decisão.
Depois, implemente a opção escolhida, verifique no navegador com o Claude in Chrome e alinhe os estilos ao resto do produto.
Abra um PR com captura de tela ou GIF da funcionalidade funcionando.
Siga até concluir.

Prompt 10 · Rotina semanal de revisão de design

/schedule toda segunda-feira às 9h07, no repositório [DONO/REPOSITÓRIO]:

1. Liste os PRs com mudança de front-end mesclados nos últimos 7 dias.
2. Para cada um, verifique na descrição e nos comentários se houve revisão de algum designer.
3. Nos que não tiveram, compare a tela nova com o resto do produto: espaçamento, cor, fonte, estados de hover e foco, e versão mobile.
4. Entregue uma lista com link do PR, o problema em uma linha e a correção sugerida.
5. Não abra PR e não envie mensagem a ninguém: a decisão de corrigir é minha.

Usamos 9h07 de propósito: a documentação de rotinas avisa que agendamentos exatamente na hora cheia podem começar alguns minutos atrasados.

"How Claude Code's lead designer builds with AI", Meaghan Choi no Dive Club Live (Nova York), canal Dive Club, publicada em 04/06/2026, 12min18, ≈61 mil visualizações em 02/10/2026. A palestra é em inglês; o YouTube oferece legenda automática traduzida.

Vídeo: https://www.youtube.com/watch?v=hKeDfupbA4U

1. O que ela vai mostrar · 0:00

Uma demonstração prática dos fluxos que viraram rotina dentro da Anthropic, feita no repositório aberto do Excalidraw. Ela recomenda o projeto para quem quer treinar: muitas issues abertas e comunidade receptiva. Trabalha no terminal (foi ela quem desenhou a CLI do Claude Code), mas avisa que tudo funciona igual no app de desktop.

2. Dica 1: sempre em worktree · 1:04

Worktree é uma cópia isolada do repositório, num branch próprio, para vários Claudes trabalharem em paralelo sem um pisar no outro. Ela abre a sessão com claude --worktree.

Hoje, claude --worktree <nome> cria a cópia em .claude/worktrees/<nome>/, num branch worktree-<nome>. Vale colocar .claude/worktrees/ no .gitignore.

3. Dica 2: Opus com 1M de contexto, fast mode e auto mode · 2:08

Ela usa o Opus com 1 milhão de tokens de contexto e fast mode ligado para acelerar a demo, e conta que o time inteiro usa o auto mode: um classificador aprova as ações seguras e você não precisa confirmar cada passo.

Atualização: o Opus 5.5 tem 1M de contexto nativo, e o auto mode é o modo inicial do Claude Code (terminal e VS Code) desde a versão 2.1.283. O fast mode deixa o Opus até 2,5x mais rápido e, nos planos de assinatura, é cobrado só dos créditos de uso.

4. O pedido: skill /prototype e PR com gravação · 2:47

Ela pede um autocomplete para o Excalidraw sem especificação nenhuma, usando uma skill que mandou o próprio Claude escrever: gerar N versões da funcionalidade (5 por padrão) num HTML, abrir a prévia e iterar algumas vezes. No mesmo pedido: escolher a melhor e justificar, pesquisar na web, implementar, verificar, alinhar ao estilo do produto, abrir PR com captura de tela e seguir em loop até terminar.

Duas falas resumem o método: ninguém mais escreve skill à mão, e ela não revisa a conversa do Claude, revisa o PR com a gravação da funcionalidade funcionando. O pedido dela, adaptado, é o prompt 9.

5. Os 3 princípios · 5:37

1. O Claude, e a maioria dos modelos de linguagem, ainda não é bom de design. Você continua no circuito do acabamento e da decisão.
2. Escrever código já está automatizado; o ganho maior vem de passar para o Claude também o trabalho que não é código.
3. Todo mundo conseguir publicar não significa que tudo deva ir para o ar. Isso exige sistemas que escalem.

No meio do bloco aparece a prévia com as opções de autocomplete, e a plateia vota na de número 2.

6. Polimento em lote e PR que segue sozinho até o merge · 7:15

Ela usa o Claude Code na web para disparar centenas de correções pequenas de polimento (muitas são mudanças mínimas de CSS aprovadas automaticamente) e de vez em quando pede ao Claude para juntar tudo num PR só. Nas mudanças grandes, roda /simplify, /code-review e /commit-push-pr, confere a tela com o Claude in Chrome e deixa um comando que leva os PRs abertos até o merge, avisando no Slack quem precisa revisar.

O que era interno hoje é público: /simplify e /code-review vêm no Claude Code; /commit-push-pr está no plugin oficial commit-commands; e /autofix-pr abre uma sessão na nuvem que corrige o PR quando o CI falha ou chega comentário de revisão.

7. A rotina que audita front-end sem designer · 10:04

Uma rotina agendada do Claude Code varre os repositórios atrás de mudanças de front-end e procura no Slack, nas transcrições do Google Meet e no Google Docs se algum designer participou. Quando ninguém de design participou, ela revisa a tela, rascunha um PR alternativo e manda mensagem privada ao engenheiro sugerindo trabalhar a mudança com um designer.

Ela desligou o envio da mensagem porque o Claude ainda errava no design, mas deixou a rotina pronta para testar de novo a cada modelo novo. Hoje uma rotina se cria com /schedule ou em claude.ai/code/routines, nos planos Pro, Max, Team e Enterprise. Nosso prompt 10 é uma versão mais conservadora: só lista, não abre PR nem manda mensagem.

8. Fechamento · 11:41

Ela recapitula os 3 fluxos, e o Claude termina a tarefa do começo da palestra: grava em GIF a verificação feita no Claude in Chrome, anexa ao PR e abre o pull request.

O Opus 5.5 escreve o código; o vídeo sai de um renderizador. Do teste mais rápido ao arquivo pronto:

Detalhes que importam:

• Claude Design: disponível em beta nos planos Pro, Max, Team e Enterprise (no Enterprise vem desligado até um owner ativar) e conta no mesmo limite do resto do Claude. Lançamento em 17/04/2026 pela Anthropic Labs e suporte a vídeo, shaders e 3D: segundo o guia original, não confirmado em 02/10/2026.
• HyperFrames: anima com GSAP, Lottie ou CSS. "Render local não gasta crédito da HeyGen": segundo o guia original, não confirmado em 02/10/2026 (o render roda com Chrome headless e FFmpeg na sua máquina, sem chamada declarada à HeyGen no README).
• Remotion: skills oficiais para agente via npx remotion skills add. Nomes /remotion-create, /remotion-markup, /remotion-render e codecs h264, prores e gif do npx remotion render: segundo o guia original, não confirmado em 02/10/2026.
• Skills da Anthropic: a frontend-design pede um único momento de movimento bem orquestrado em vez de efeitos espalhados pela tela.
• GSAP: grátis para todos, inclusive uso comercial, com os plugins que antes eram pagos (SplitText, MorphSVG). Versão 3.15.0 no cdnjs. Restrição de licença contra ferramentas visuais sem código que concorram com o Webflow: segundo o guia original, não confirmado em 02/10/2026 (não está na página de preços).

Preços sem impostos. A página claude.com/pricing nos foi servida em dólar em 02/10/2026; a cobrança em real para quem acessa do Brasil vem do guia original.

• ☐ O primeiro segundo já mostra a ideia, sem tela vazia esperando a animação começar.
• ☐ Todo texto fica parado tempo suficiente para ser lido em voz alta duas vezes.
• ☐ Nenhum texto encosta na borda; os quadros foram conferidos com o check em pelo menos 4 momentos.
• ☐ Reels em 1080x1920; lower third em WebM ou MOV com fundo transparente.
• ☐ Números e textos conferem com a fonte, com acento e no formato brasileiro.
• ☐ Fonte, trilha e imagens são suas ou têm licença para uso comercial.

Sim. O Opus 5.5 entende pedido em português, e HyperFrames, Remotion e GSAP rodam na sua máquina sem custo de render. Os planos do Claude são cobrados em real para quem assina do Brasil, segundo o guia original (não conseguimos ver a página em real em 02/10/2026). A palestra é em inglês, com legenda automática traduzida no YouTube.

• Opus 5.5 não aparece no Claude Code: versão antiga. Rode claude update (mínimo 2.1.280). No plano Free o Opus não está disponível.
• /fast responde "Fast mode requires usage credits": ative os créditos de uso em Settings > Usage no claude.ai (ou /usage-credits). Em Team e Enterprise, um owner precisa liberar o fast mode antes.
• Render do HyperFrames falha logo no início: confira node -v (22+) e ffmpeg -version. Sem FFmpeg no PATH não há render.
• Lower third sai com fundo preto ou branco: o html, o body ou a cena estão pintados. Remova o fundo e renderize em WebM ou MOV; MP4 não carrega transparência.
• Texto cortado no celular: rode npx hyperframes check --snapshots e use o prompt 7. Assista à prévia no celular.
• Todas as versões parecem iguais: nomeie os padrões a evitar (fundo creme, itálico, 01/02/03, monoespaçada, pílula) e acrescente à lista o estilo que se repetiu.
• /schedule dá "Unknown command": rotinas exigem login com assinatura do claude.ai. Remova ANTHROPIC_API_KEY do shell se estiver definida.
• claude --worktree falha com "Failed to resolve base branch": o repositório precisa de pelo menos um commit.
• Skills da Anthropic não instalam: mande os dois comandos /plugin em prompts separados.

• O Claude não decide gosto por você. É o recado da própria design lead do Claude Code. Peça opções, escolha e só depois renderize.
• A palestra é anterior ao Opus 5.5 (gravada mais de três meses antes de 22/09/2026). Motion design não aparece nela; a ligação entre o método dela e a animação é do guia, não da Meaghan.
• Motion graphic é curto: abaixo de 10 segundos, no máximo uns 30. Peças maiores pedem o fluxo de vídeo com cenas.
• Custo de uso: cenas complexas com esforço high consomem mais do limite do plano; o fast mode cobra o dobro por token.
• Licenças: Remotion é pago para empresas a partir de 4 pessoas; trilhas, fontes e imagens precisam de licença própria.
• Números da HeyGen e da Anthropic mudam rápido (estrelas, preços, versões). Confira antes de citar.

• Palestra completa (Meaghan Choi, Dive Club Live, YouTube): https://www.youtube.com/watch?v=hKeDfupbA4U
• Anúncio do Claude Opus 5.5: https://www.anthropic.com/claude-opus-5-5
• Opus 5.5, visão geral e preços da API: https://platform.claude.com/docs/en/models/opus-5-5/overview
• Guia de prompt do Opus 5.5: https://platform.claude.com/docs/en/build-with-claude/prompt-engineering/prompting-claude-opus-5-5
• Planos do Claude: https://claude.com/pricing
• Configuração de modelo no Claude Code: https://code.claude.com/docs/en/model-config
• Fast mode: https://code.claude.com/docs/en/fast-mode
• Skills no Claude Code: https://code.claude.com/docs/en/skills
• Rotinas: https://code.claude.com/docs/en/routines
• Artifacts: https://support.claude.com/en/articles/17153992-what-are-artifacts-and-how-do-i-use-them
• Claude Design: https://support.claude.com/en/articles/14604416-get-started-with-claude-design
• HyperFrames: https://github.com/heygen-com/hyperframes
• Guia de prompt de motion graphics (HyperFrames): https://hyperframes.heygen.com/prompting/motion-graphics
• Renderização (HyperFrames): https://hyperframes.heygen.com/guides/rendering
• Remotion com agentes de código: https://www.remotion.dev/docs/ai/coding-agents
• Licença do Remotion: https://www.remotion.pro/license
• Skills oficiais da Anthropic: https://github.com/anthropics/skills
• GSAP: https://gsap.com/pricing/
• Estrelas e licenças: API do GitHub, 02/10/2026

Todas as páginas acima foram abertas em 02/10/2026.

Baseado no guia de Fabiano Carvalho / vibehub.academy: https://guias.vibehub.academy/mleuc