> ## Content Index > Fetch the complete content index at: https://www.azurebrasil.cloud/llms.txt > Use this file to discover other available public pages before exploring further. # Série Motion & Edição #1: montando o estúdio - URL: https://www.azurebrasil.cloud/blog/serie-motion-edicao-1-montando-o-estudio/ - Published: 2026-10-23T12:21:09.000Z - Updated: 2026-10-23T12:21:09.000Z - Author: Otavio Naimeke Granzieri Depois que o Opus 5.5 foi lançado, a internet foi bombardeada com vídeos dizendo que você não precisa mais de After Effects, que qualquer pessoa gera motion graphic em minutos e que o processo ficou 3.000% mais rápido. Quis testar isso por conta própria, e este é o primeiro texto de uma série em que documento o que funciona e o que não funciona. ## Onde estou nessa jornada Estou em fase de descoberta. Não sou desenvolvedor e não sou motion designer. Trabalho com marketing na AzureBrasil e quero entender se dá para produzir vídeos animados de qualidade sem passar semanas aprendendo uma ferramenta pesada. Ainda não medi se o ganho de tempo é real, então não vou repetir números de vídeo de internet. Quando eu tiver um vídeo pronto e o tempo gasto, conto aqui. Documento o processo caso mais alguém queira aproveitar. A regra deste artigo é que você consiga copiar e colar cada prompt e reproduzir o mesmo estúdio na sua máquina, sem escrever uma linha de código. ## O que é uma skill, em português claro Uma skill é um manual que o Claude Code lê quando o pedido combina com o assunto dela. Em vez de eu explicar toda vez como se faz um vídeo quadro a quadro, instalo a skill uma vez e o Claude passa a saber. Neste estúdio uso três fontes mais um arquivo de regras meu: - **Remotion:** cria vídeo a partir de código. - **HyperFrames (HeyGen):** cria vídeo a partir de páginas web animadas. - **claude-animation:** faz animação 2D com cara de desenho à mão, com som gerado por código. - **CLAUDE.md:** o regulamento do meu estúdio, que o Claude lê no início de toda sessão. ## Passo 1: o guia de setup (o "prompt master") Tudo começou com um guia de montagem que colei no Claude Code. Eu não instalei nada manualmente: pedi para ele executar o guia inteiro. Se você quiser reproduzir, cole este prompt no Claude Code: ```bash Colei abaixo um guia para montar um estúdio de motion graphics. Siga todas as instruções ao pé da letra. O meu computador é Windows, então adapte o que for de Mac. Antes de instalar, veja o que já existe e me diga; instale só o que faltar. No final, me explique em português simples o que cada item faz. [COLE AQUI O GUIA DA PRÓXIMA SEÇÃO] ``` **Por que o prompt é assim:** avisar o sistema operacional evita comandos de Mac rodando no Windows, que simplesmente falham. Pedir para checar antes evita reinstalar o que já está pronto. E pedir a explicação no fim garante que eu entenda o que ficou na minha máquina. O guia que eu colei é este. Ele está escrito para Mac, e o Claude faz a adaptação: ```bash # 1. Runtime: Node 22+, ffmpeg, Python para análise de áudio brew install node ffmpeg python pip install numpy librosa soundfile # 2. Projeto limpo e navegador sem tela mkdir motion-studio && cd motion-studio && npm init -y npm i -D playwright && npx playwright install chromium # 3. Skills de framework (opcional) npx skills add remotion-dev/skills npx skills add heygen-com/hyperframes # 4. Visual de desenho à mão (opcional) claude plugin marketplace add buildwithhanif/claude-animation-skill claude plugin install claude-animation@claude-animation-skill # 5. Iniciar o Claude Code no Opus 5.5 claude --model claude-opus-5-5 ``` **Por que cada passo existe:** 1. **Runtime.** Node roda o programa que desenha os quadros. O ffmpeg junta os quadros em vídeo. O Python com `librosa` mede as batidas de uma música, para a animação bater no ritmo. 2. **Projeto e navegador sem tela.** O Playwright abre um navegador invisível que "tira foto" de cada quadro da animação. Sem ele não há como transformar uma página animada em vídeo. 3. **Skills de framework.** Ensinam ao Claude as ferramentas de vídeo Remotion e HyperFrames. 4. **Plugin de desenho à mão.** Dá ao Claude um segundo estilo, mais artesanal. 5. **Modelo.** O guia recomenda o Opus 5.5 com esforço alto. Esse passo é feito no seletor de modelo do app, não por comando. ## O que o Claude fez no meu Windows O Claude primeiro conferiu o que eu já tinha. Node 22, ffmpeg e Python 3.13 já estavam instalados, então o passo 1 se reduziu a instalar as bibliotecas de áudio. Depois criou a pasta `motion-studio`, instalou o Playwright com o navegador invisível, adicionou as duas skills de vídeo e o plugin de desenho à mão. Quem não tiver as ferramentas básicas no Windows pode pedir para o Claude instalar com o `winget`, o instalador de programas do próprio Windows, no lugar do `brew` do Mac. Um detalhe prático: o comando `claude` não funcionava no terminal comum da minha máquina, então o Claude usou o programa que vem junto com o app. Você não precisa se preocupar com isso, ele resolve sozinho. ## Passo 2: o regulamento do estúdio Com tudo instalado, colei um segundo texto, as regras do estúdio, e pedi para ele guardar como arquivo de regras do projeto: ```text Esse texto é o regulamento do meu estúdio de motion. Salve como o arquivo de regras do projeto (CLAUDE.md), para valer em todas as sessões futuras. Mantenha o texto exatamente como está e me diga onde o arquivo ficou. [COLE AQUI AS REGRAS DA PRÓXIMA SEÇÃO] ``` ```text Esse texto é o regulamento do meu estúdio de motion. Salve como o arquivo de regras do projeto (CLAUDE.md), para valer em todas as sessões futuras. Mantenha o texto exatamente como está e me diga onde o arquivo ficou. [COLE AQUI AS REGRAS DA PRÓXIMA SEÇÃO] ``` **Por que isso importa:** o Claude não lembra da conversa de ontem. Se as regras ficarem só no chat, eu teria que colar de novo a cada vídeo. Gravadas no `CLAUDE.md`, ele lê sozinho toda vez, como um manual de marca guardado na gaveta do estúdio. Estas são as regras que usei: ```text # Motion studio rules ## Render contract - Every film is a pure function of time: `window.seek(t)` paints frame t. - No CSS transitions, no setTimeout, no requestAnimationFrame in render mode, no state carried between frames. Seeded noise only (mulberry32), never Math.random. - Render with `node render.mjs`, encode H.264 yuv420p, CRF 16. ## Look - Banned defaults: centered title on gradient, everything fading in, corner labels and frame borders, glow on UI chrome, generic particle bursts. - One display face, one UI face. One accent color unless the brief says otherwise. - Every 2 to 4 seconds something new must happen on screen. ## Sound - Score and SFX are synthesized in code unless a track is supplied. - Place hits on the measured beat grid (beats.json). Loudness -14 LUFS. ## Loop before you show me anything 1. Render one frame per beat as a contact sheet and LOOK at it. 2. Score it 1-10 on: hook in first 2s, readability at phone size, motion quality, variety, brand accuracy, sound sync. 3. Fix the 3 worst problems. Repeat until every score is 8+. 4. Only then do the full render. ``` **O que cada bloco quer dizer, sem jargão:** - **Render contract:** o vídeo tem que sair idêntico toda vez que eu gerar. Nada de efeitos aleatórios ou que dependam do momento. Se eu pedir um ajuste, só o ajuste muda. - **Look:** uma lista do que é proibido porque grita "feito por IA": título no meio da tela sobre degradê, tudo aparecendo com fade, brilho em tudo. Limita a uma cor de destaque e exige novidade na tela a cada 2 a 4 segundos, para o vídeo não ficar parado. - **Sound:** a música e os efeitos são criados por código, e os golpes caem nas batidas medidas. O volume final fica em -14 LUFS, o padrão de redes sociais. - **Loop de revisão:** antes de me mostrar qualquer coisa, o Claude gera uma folha com um quadro por batida, olha, dá nota de 1 a 10 e corrige os três piores problemas, repetindo até tudo ter nota 8 ou mais. É meu filtro de qualidade antes de eu perder tempo olhando. ## Passo 3: conferir se ficou tudo certo Quem não programa não tem como "ver" se uma instalação deu certo. Por isso termino com uma checagem que devolve um relatório que eu entendo: ```text Confira se o meu estúdio de motion está pronto. Verifique: se Node, ffmpeg e Python funcionam; se as bibliotecas de áudio importam sem erro; se o navegador do Playwright está instalado; se as skills do Remotion e do HyperFrames estão na pasta do projeto; se o plugin de animação está instalado; e se o arquivo de regras existe. Me dê uma tabela simples com o que está ok e o que falta, e não instale nada sem me perguntar. ``` **Por que isso importa:** um erro escondido aqui só aparece depois, quando o vídeo falha no meio da renderização. A checagem leva um minuto. A última frase mantém o controle comigo: o Claude só olha e relata. ## O que aprendi até aqui - Guias de setup quase sempre assumem Mac. No Windows, peça para o Claude adaptar e checar antes de instalar. - Skills e plugins novos só aparecem em uma sessão nova do Claude Code. Depois de instalar, abra uma conversa nova. - Skills rodam com permissões amplas. Vale pedir ao Claude para resumir o que tem dentro de cada uma antes de usar. - Por enquanto só existe a base. O programa que gera o vídeo, a medição de batidas e o som ainda não foram construídos; as regras descrevem como devem ser. ## Conclusão Até aqui, o que existe é um estúdio montado e um regulamento escrito. Nenhum vídeo foi gerado ainda, então não sei dizer se a promessa da internet se confirma. O que sei é que a instalação foi feita colando um guia e pedindo, em português, para o Claude executar. **Bora testar juntos?** Pegue os três prompts deste artigo, rode no seu computador e veja o que acontece. Depois me conte: o que funcionou, onde travou, o que o Claude explicou de um jeito que você não entendeu. Quanto mais gente reproduzir, mais fácil fica separar o que é real do que é exagero. Deixe seu relato nos comentários.