"Produção de vídeo com Claude Code: O stack de 3 ferramentas que uso"

"## Produção de vídeo com Claude Code: O stack de 3 ferramentas que uso\n\nQuase fechei a aba do walkthrough do Jack Roberts duas vezes.\n\nA miniatura parecia com todos os outros vídeos do tipo "automatizei meu pipeline de vídeo com IA" que têm lotado meu feed desde que a HeyGen publicou o HyperFrames como código aberto em 17 de abril de 2026. Estava três minutos assistindo, cético, quando ele fez algo que eu não havia visto ninguém mais fazer em uma demo de vídeo este ano — ele parou de tratar o Claude Code como uma única ferramenta e começou a usá-lo como a camada de orquestração de todo um sistema de produção. Design em um lugar. Animação em outro. Áudio em um terceiro. Tudo governado por skills que ele escreveu uma vez e reutilizou para sempre.\n\nEsse novo enquadramento foi o que me fez parar de rolar o feed, abrir uma nova janela de terminal e construir minha própria versão. E é sobre isso que trata este artigo — não uma análise de ferramenta, não um resumo ofegante do dia de lançamento, mas o stack real de três ferramentas com Claude Code para produção de vídeo que uso agora, o que cada camada faz bem, onde cada uma silenciosamente falha, e as partes desconfortáveis que o Jack passou por cima e que precisei aprender na minha própria máquina.\n\n## Por que "uma ferramenta faz tudo" não funciona\n\nA cada seis meses, algum novo produto promete um único prompt que transforma uma gravação bruta em um vídeo finalizado. Alguns até funcionam — para a demo. Então você tenta com seu material real, com sua marca real, e o resultado parece ter sido feito por alguém que nunca te conheceu.\n\nA razão é entediante e estrutural. Produção de vídeo não é um único trabalho. São pelo menos três trabalhos que por acaso compartilham uma linha do tempo: design do sistema visual (como a sua marca aparece em movimento), composição e animação (o que acontece na tela, segundo a segundo) e condicionamento de áudio (como a faixa de voz soa quando o espectador aperta play). Cada um desses trabalhos tem suas próprias ferramentas, seus próprios modos de falha e seu próprio teto de qualidade. Colapsá-los em um único prompt é o motivo pelo qual tanto vídeo editado por IA parece barato da mesma maneira específica.\n\nO enquadramento do Jack foi o primeiro que vi que tratava cada trabalho como um cidadão de primeira classe. Claude Code Design System para a linguagem visual. HyperFrames para a camada de composição e animação. Auphonic para limpeza de áudio programática. O próprio Claude Code como o regente — não a orquestra, o regente. Essa distinção importa mais do que parece, e é a maior razão pela qual a qualidade da minha produção aumentou quando parei de tentar resolver um vídeo inteiro com um único prompt.\n\n## Camada 1: Claude Code Design System — a marca que vai a qualquer lugar\n\nA ideia de um "sistema de design" geralmente é associada a trabalhos de web e produto. O que a Anthropic lançou com o produto Claude Design em 16 de abril de 2026 — junto com o lançamento do modelo Opus 4.7 — foi uma interface de sistema de design que se estende naturalmente a gráficos animados e multimídia.\n\nA versão que uso vive dentro do Claude Code através do aplicativo desktop Claude Design. Este é o fluxo de trabalho que executo para cada novo cluster de conteúdo:\n\n1. Definir o estilo do conteúdo em linguagem simples. Educacional e minimalista. Acentos no estilo esboço onde for útil. Sem fotos de stock. Uma tela, um ponto, imagens simples.\n2. Fazer upload dos primitivos da marca. Logotipo, logotipo textual, conjunto de ícones, duas ou três capturas de referência de peças finalizadas.\n3. Definir as preferências de animação. Duração curta por batida — de cinco a vinte segundos. Texto mínimo na tela. Easing lento nas entradas, easing rápido nas saídas.\n4. Exportar o sistema como ZIP ou PDF. O sistema exportado é uma especificação portátil que posso entregar a outra ferramenta — ou a outro agente — para que renderize novos ativos que permaneçam dentro da marca.\n\nNa primeira vez que testei isso, fiz o Claude gerar três animações curtas — um cartão de título, um callout de mid-roll e um cartão final — apenas a partir do sistema exportado. As três voltaram visualmente coerentes entre si. Não idênticas. Coerentes. Sem um sistema de design compartilhado, animações geradas por IA parecem ter sido feitas por três pessoas diferentes em três dias diferentes. Com o sistema em vigor, elas soam como uma única voz.\n\nO sistema de design que você define no início vai parecer errado após o primeiro projeto real. Tudo bem. O sistema é uma especificação viva, não um contrato. Toda vez que publico uma peça de que gosto, volto e atualizo a exportação antes da próxima execução. Depois de cerca de quatro projetos, o sistema para de derivar e começa a acelerar.\n\nSe você leu minha análise sobre como o Claude Code automatiza fluxos de trabalho de sistema de design com o Figma, esta é a mesma filosofia estendida ao movimento. O sistema de design é onde sua marca se torna reutilizável.\n\n## Camada 2: HyperFrames — escrever vídeo como se escreve uma página web\n\nHyperFrames é um framework de renderização de vídeo de código aberto que a HeyGen lançou em 17 de abril de 2026 sob a licença Apache 2.0. A proposta: escreva HTML, CSS e JavaScript. Renderize vídeo. Construído para agentes de IA.\n\nVocê executa um único comando — npx skills add heygen-com/hyperframes — e sua instância do Claude Code ganha três novos comandos slash: /hyperframes para criar composições, /hyperframes-cli para operações de linha de comando e /gsap para ajuda com animações.\n\nA primeira vez que isso fez sentido para mim foi em um teste de tag de lower-third com nome. Escrevi o prompt: "adicione uma tag de lower-third que diga 'Mejba Ahmed — Software Engineer' no canto inferior esquerdo, alinhada com a tipografia do meu sistema de design, deslizando da esquerda em 0,5 segundo, mantendo por 4 segundos, deslizando para fora." O Claude Code escreveu uma composição que importou os tokens do sistema de design, posicionou o texto com o peso correto e registrou uma timeline do GSAP. Um render depois, eu tinha o overlay. Tempo total: cerca de noventa segundos.\n\nO framework usa um padrão Frame Adapter — GSAP, Lottie, CSS ou Three.js. As timelines do GSAP devem ser criadas com { paused: true } e registradas em window.__timelines, para que o renderizador saiba quando cada frame é exibido. Essa restrição torna a saída determinística. Cada render é pixel-idêntico.\n\nRessalvas:\n- Limite de resolução. Os renders estão limitados a 1080p. O 4K ainda não é suportado.\n- Execução local. Sua máquina faz o trabalho de renderização. Teste com seu próprio hardware.\n- O áudio é o ponto fraco por padrão. Para uma boa faixa de voz, você precisa da terceira camada.\n\nPara a análise técnica completa do pipeline de vídeo, meu post anterior sobre como construir um fluxo de trabalho de edição de vídeo com Claude Code aprofunda o lado do Remotion e do Whisper.\n\n## Camada 3: Auphonic — o ajuste de áudio que ninguém vê mas todo mundo ouve\n\nSe você levar apenas uma coisa deste artigo: os espectadores perdoam visuais mediocres. Eles não perdoam áudio ruim. Um vídeo com áudio limpo e visuais amadores parece um documentário indie de baixo orçamento. Um vídeo com visuais excelentes e áudio ruim parece não profissional, ponto final.\n\nO Auphonic faz pós-produção de áudio automática: normalização de volume, nivelamento, redução de ruído, filtragem, reconhecimento de fala. Sua API REST tem cobertura completa do OpenAPI 3.0.3. Integrei-o ao Claude Code para que depois que o HyperFrames produza o MP4 renderizado, uma segunda skill encaminhe o áudio pelo Auphonic com um preset salvo.\n\nMeu preset: meta de volume de -16 LUFS para entrega web, redução de ruído moderada, compressor suave. Salvo como "voiceover-web-16" — a atualização da API de 2026 permite referenciar presets por nome em vez de UUID, o que torna a skill portátil.\n\nA Simple API: um único request HTTP multipart — fazer upload do arquivo, definir metadados, referenciar um preset, iniciar a produção. É isso que uso.\n\nO resultado: minha faixa de voz soa consistente em todos os vídeos que publico. Não "mixado em estúdio" — mas consistente o suficiente para que um espectador nunca seja tirado do conteúdo por problemas de qualidade de áudio.\n\n## As skills são o verdadeiro fosso defensivo\n\nAs ferramentas são commodities. HyperFrames é código aberto. O Claude Design está disponível para qualquer pessoa com uma assinatura do Claude. O Auphonic tem uma API pública. Nenhum deles é difícil de instalar.\n\nA alavancagem está na skill que você escreve uma vez e usa para sempre.\n\nQuando publiquei meu primeiro pipeline, gastei quatro horas nele. O segundo vídeo levou duas horas. O terceiro levou quarenta minutos. O quinto levou cerca de quinze minutos. Cada etapa que acertei uma vez, envolvi em uma skill do Claude Code.\n\nMinha biblioteca atual de skills de produção de vídeo:\n\n- brand-motion-system — carrega o sistema de design exportado e o aplica a qualquer composição do HyperFrames\n- lower-third-standard — cria o overlay de lower-third que uso em 80% dos meus clips\n- caption-sync-srt — pega um arquivo SRT e renderiza legendas com a marca aplicada\n- audio-cleanup-voiceover — encaminha o áudio pelo Auphonic com o preset "voiceover-web-16"\n- thumbnail-from-video — extrai um frame e gera variantes de miniatura\n\nCada skill tem cerca de quarenta linhas de instrução mais exemplos. Essa é a produção real deste stack — não os vídeos individuais, mas o ativo composto das próprias skills.\n\nSe você leu meu post sobre por que as skills do Claude Code são o verdadeiro ponto de alavancagem, esta é a versão de pipeline de produção desse argumento.\n\n## O que errei na primeira vez\n\nComecei grande demais. Minha primeira tentativa foi um explicativo de três minutos com cinco segmentos animados. Levou uma tarde inteira para depurar. Publique primeiro um clip de quinze segundos. Faça o pipeline completo funcionar com um ativo trivial. Depois escale.\n\nEu fiz over-prompting no HyperFrames. As primeiras composições que pedi eram elaboradas demais. A regra prática: uma tela, um ponto, uma animação principal.\n\nTratei o Opus 4.7 como o modelo sempre correto. Para o trabalho pesado de escrever uma nova composição do zero, o Opus 4.7 vale a pena. Para edições iterativas, um modelo mais leve é mais rápido e produz saída idêntica.\n\nPulei a etapa de pré-visualização. O HyperFrames vem com npx hyperframes preview. Pré-visualize primeiro. Renderize depois. Esse hábito me poupou horas.\n\n## A comparação honesta — o que este stack não faz\n\nEste stack é excelente para: conteúdo educativo de formato curto, vídeo para redes sociais, overlays de talking-head e legendas, vídeos promocionais, walkthroughs de código, animações de PDF, peças de texto cinético.\n\nEste stack não é uma boa escolha para: trabalho narrativo cinematográfico, videoclipes musicais, entrega em 4K (HyperFrames está limitado a 1080p), projetos com muito material bruto onde os cortes são decisões de julgamento sobre energia e ritmo. Esses trabalhos pertencem ao DaVinci Resolve ou ao Premiere.\n\n## Uma primeira semana realista\n\nDia um. Instale o HyperFrames com npx skills add heygen-com/hyperframes. Execute npx hyperframes init. Pré-visualize a composição padrão. Renderize-a. Apenas verifique se as ferramentas funcionam.\n\nDia dois. Exporte um sistema de design mínimo do Claude Design — apenas seu logotipo, duas cores, um par de tipografias. Um sistema de design ruim é melhor do que nenhum sistema de design.\n\nDia três. Construa um overlay de lower-third do início ao fim com seu sistema de marca aplicado. Publique o clip em algum lugar. Feche o ciclo completo uma vez.\n\nDia quatro. Configure o Auphonic, salve um preset, conecte a etapa de áudio. Compare as versões brutas e limpas lado a lado.\n\nDia cinco. Envolva todo o fluxo em uma skill do Claude Code. Dê um nome a ela. Salve-a. Use-a em um novo clip.\n\n## Perguntas frequentes\n\n### Preciso saber programar para usar o HyperFrames com o Claude Code?\nNão — o Claude Code escreve o HTML, CSS e JavaScript por você a partir de prompts em linguagem natural. Você precisa de familiaridade básica com a linha de comando para npx hyperframes init, preview e render. Para o código de animação em si, o Claude Code cuida disso.\n\n### Posso usar este stack para entrega de vídeo em 4K?\nHoje não. O HyperFrames atualmente está limitado a 1080p. Renderize no HyperFrames e componha em um NLE tradicional para masters em 4K.\n\n### Qual modelo do Claude devo usar — Opus 4.7 ou Opus 4.6?\nOpus 4.7 para trabalho criativo pesado escrevendo uma nova cena do zero. Opus 4.6 para edições iterativas — mais rápido e mais barato sem perda de qualidade em trabalho de precisão.\n\n### Como o Auphonic se compara à limpeza manual de áudio?\nO Auphonic substitui ficar sentado em um DAW aplicando a mesma compressão, equalização e meta de volume em cada vídeo que você publica. Para trabalho de voz em off para web e redes sociais, produz saída consistente todas as vezes.\n\n## Vamos trabalhar juntos\n\nQuer construir sistemas de IA, automatizar fluxos de trabalho ou escalar sua infraestrutura tecnológica? Adoraria ajudar.\n\n* Fiverr (desenvolvimentos personalizados e integrações): fiverr.com/s/EgxYmWD\n* Portfolio: mejba.me\n* Ramlit Limited (soluções empresariais): ramlit.com\n* ColorPark (design e branding): colorpark.io\n* xCyberSecurity (serviços de segurança): xcybersecurity.io"