HyperFrames

O que é

Um framework que transforma uma página HTML numa composição de vídeo. Cada cena é um elemento com data-start e data-duration; a animação é uma timeline do GSAP; o áudio é um <audio> com tempo. O comando render abre a página num Chrome sem janela, tira um quadro por vez e junta tudo com o ffmpeg.

Por que a Prattes usa

• Tudo é texto. Mudar um tempo, uma cor ou uma frase é editar uma linha, e dá para pedir isso a um agente de IA.
• Conferência automática. O check reclama de texto estourando a tela, contraste ruim, áudio sem id, cena fora do tempo. O snapshot tira fotos dos quadros que você escolher.
• Estúdio de prévia. O preview abre uma linha do tempo no navegador para ver e ajustar.
• Determinístico. O mesmo código gera o mesmo vídeo, quadro a quadro.

O que ele não faz

Não edita filmagem. Não tem timeline de arrastar clipe. Para cortar gravação de câmera, colorir ou montar entrevista, um software de edição de vídeo continua sendo o caminho.

Dicas de quem usa todo dia

• Fixe a versão no package.json do projeto. Ela não sobe sozinha e as novas mudam coisas.
• Renderize com um worker só (-w 1): com vários, animações de traçado e fromTo perdem o estado.
• A telemetria anônima vem ligada. hyperframes telemetry disable desliga.
• O editor de vídeo com IA do Lab já vem com tudo isso configurado e com uma lista dos erros que o check não pega.