Nos termos do próprio skill
Um skill orientado a roteamento para uma peça curta, com direção de design e sem narração — tipografia cinética, contagem de estatística, impacto de gráfico, logo sting, lower third, mapa animado, tweet ou página web — geralmente com menos de 10s e no máximo cerca de 30s, renderizada em MP4 ou como overlay transparente.
É orientado a assets e reuso: a primeira bifurcação é se a peça precisa de uma busca; categorias de formulário rodam sobre conteúdo fornecido pelo usuário com asset_needs vazio, categorias orientadas por busca animam de acordo com o tipo de conteúdo retornado, e o Builder compõe blocos do catálogo antes de escrever manualmente as lacunas. O workflow é autônomo, com no máximo uma pergunta de esclarecimento, mas a renderização permanece controlada pelo usuário, atrás de lint, check e snapshots de prova.
O que ele produz
- Um shot-plan.json em rascunho e depois final, contendo o envelope, a categoria escolhida ou a intenção de busca, asset_needs e o bloco, layout, movimento e posições.
- compositions/index.html respeitando o contrato HF com uma timeline GSAP pausada em window.__timelines, classes de clip e ids estáveis, e um tl.seek(0) determinístico.
- Uma folha de contato ou snapshot em snapshots/ para inspecionar os tempos de prova.
- renders/video.mp4, ou um overlay transparente ao renderizar no formato webm ou mov.
Como funciona
- 01Inicializar o Projeto
O Passo 0 cria PROJECT_DIR = videos/<project-name>/ e executa hyperframes init com o exemplo em branco e este skill, ignorando-o completamente quando hyperframes.json já existe.
- 02Planejar e Decidir Sobre a Busca
A primeira bifurcação é se a peça precisa de uma busca: não significa uma categoria de formulário com asset_needs: [], sim significa emitir consultas de busca em asset_needs[].
- 03Obter Assets Quando Necessário
O Passo 2 resolve assets via media-use em caminhos locais ao projeto e congelados, além de um ledger, e é pulado direto para o design quando asset_needs está vazio.
- 04Desenhar em Torno do que Você Tem
Uma segunda passagem do Director escolhe blocos do catálogo e regras e blueprints de hyperframes-animation em torno dos assets resolvidos, e então finaliza o shot plan.
- 05Compor com foco em reuso
O Builder adiciona blocos do catálogo com npx hyperframes add e personaliza no local, escrevendo manualmente apenas as lacunas e o recurso de fusão de assets para produzir compositions/index.html.
- 06Capturar Snapshots de Prova
Escolha tempos de prova que mostrem o estado inicial, o movimento de assinatura e a retenção final, e então inspecione a folha de contato ou snapshot gerada.