Motion Reel Studio
Produza um projeto de animação editável e um filme verificado, não apenas um prompt ou uma pré-visualização HTML. Adaptado do curso de Movez; a implementação e correções estão documentadas em proveniência. Funciona com qualquer agente de codificação capaz; nenhum modelo específico, serviço pago ou habilidade externa é necessário.
Escopo e decisões iniciais
Leia o brief do usuário e as instruções existentes do projeto. Preserve o motor, visual, música e formato solicitados. Se um projeto já usar Remotion ou HyperFrames, estenda-o; consulte as instruções instaladas/documentação atual desse framework. Caso contrário, use o starter Canvas + Playwright + FFmpeg incluído. Os comandos abaixo são apenas para esta rota padrão.
Estabeleça a URL do assunto/produto, propósito, duração, proporções de aspecto, referência, ativos da marca e som. Infira respostas fornecidas; pergunte apenas por informações faltantes consequentes. Para um reel de demonstração aberto, escolha e declare um conceito, 15 segundos, 1080×1920, 60 fps e áudio sintetizado original. Não invente alegações de produto ou capturas de tela. Se ativos reais do produto não estiverem disponíveis, colete-os ou rotule uma demonstração conceitual autorizada explicitamente.
Crie a produção dentro do local do artefato do usuário. No repositório X, use posts/<slug>/ para um novo filme e mantenha todos os ativos lá. Não instale arquivos de projeto na raiz do repositório. A habilidade em si permanece no diretório de habilidades pessoais. Trabalhe localmente sem gastos com API por padrão; um provedor solicitado precisa de ferramentas disponíveis, credenciais e um orçamento autorizado. A publicação é uma ação separada.
Fluxo de trabalho de produção
- Referência e ativos. Inspecione imagens fornecidas. Para referências de vídeo, extraia quadros a cada 0,5–1 s e inspecione o movimento ao redor dos cortes. Capture estados reais do produto com ferramentas do navegador; retenha URLs de origem e datas de captura em
docs/assets.md. Baixe fontes/imagens localmente e aguarde a decodificação. Escrevadocs/style-guide.md: paleta, tipografia, hierarquia espacial, ritmo de tomada, linguagem de transição, câmera, textura, o que pegar emprestado e o que evitar. Sem referência, defina uma direção visual original explicitamente. - Brief do diretor. Leia direção para o modo solicitado. Escreva
docs/brief.mdedocs/shotlist.md; cada tomada tem um propósito, quadro inicial/final, cópia exata, estado visual, câmera, transição, dica sonora e ativo. Use uma única linha do tempo para imagem e áudio. Mostre um plano conciso e prossiga dentro do pedido autorizado. Espere apenas se o usuário solicitou um portão de plano/aprovação; silêncio nunca fornece essa aprovação. - Som e batidas. Leia áudio e execução. Analise a música fornecida ou sintetize uma partitura; salve
beats.jsonecues.json. Um detector de batidas não estabelece tempos fortes de compasso. Rotule estimativas e confirme o primeiro tempo forte antes de projetar ações no nível do compasso. Mantenha uma solicitação de faixa inalterada intacta; não estique ou normalize essa fonte sem permissão. - Stills e animatic. Construa composições principais e amostre cada tomada antes de polir o movimento. Renderize um animatic de baixa resolução na mesma proporção de aspecto, com a grade de batidas pretendida. Inspecione-o quanto ao ritmo e legibilidade em telefone. Para filmes longos, mantenha uma bíblia de personagens e contratos de cronometragem de capítulo antes de implementar capítulos. Não delegue a menos que autorizado independentemente.
- Animação. Implemente
window.seek(t)como um mapeamento puro de tempo para quadro. Use trilhas de mola em forma fechada; semeie e redefina a aleatoriedade procedural por quadro, ou derive ruído do tempo e da identidade do elemento. Nenhuma integração persistente, temporizadores, transições CSS ou amostragem de clock de parede no modo de renderização. A prontidão de ativos locais pertence awindow.ready. Tome decisões de composição responsivas para cada proporção de aspecto; não corte um final amplo para retrato. - Crítica e correção. Leia revisão. Inspecione folhas de contato, quadros consecutivos ao redor de movimento rápido e a reprodução real se uma ferramenta de reprodução estiver disponível. Corrija até três defeitos de maior impacto por rodada e re-renderize os intervalos afetados. Use até três rodadas focadas por padrão; pare quando o brief for atendido e nenhum problema material permanecer, ou relate um bloqueador concreto. Nunca aumente auto-pontuações para fabricar uma aprovação. Stills não podem verificar áudio ou reprodução de movimento.
- Final e entrega. Renderize as resoluções solicitadas, misture o áudio, crie folhas de QA e verifique metadados de fluxo, duração, contagem de quadros e decodificação completa. Entregue
out/final.mp4, pôster, folhas de contato, fonte, um comando reproduzível e limitações remanescentes concisas. Incluaout/loop-check.mp4apenas para um loop solicitado. Cópia pública segue as regras de escrita do projeto e a passagem humanizadora final quando disponível.
Fluxo de ferramentas incluído
Leia execução antes de executá-lo. Substitua <skill> pelo diretório deste SKILL.md e <project> pelo diretório do filme escolhido.
python3 <skill>/scripts/init_project.py <project>
cd <project>
npm install
npx playwright install chromium
node render.mjs --width 360 --height 640 --fps 30 --out out/animatic.mp4
python3 audio.py synth --duration 15 --bpm 120 --out out/score.wav --beats beats.json
python3 audio.py sfx --duration 15 --cues cues.json --out out/sfx.wav
node render.mjs --width 1080 --height 1920 --fps 60 --sub 4 --out out/silent.mp4
python3 finish.py mix --video out/silent.mp4 --music out/score.wav --sfx out/sfx.wav --out out/final.mp4
python3 finish.py qa --video out/final.mp4 --out out/qa --expected-duration 15 --expected-width 1080 --expected-height 1920 --expected-fps 60 --require-audio
O starter é uma animação de teste abstrata completa, não a entrega criativa. Substitua suas cenas, cópia, partitura e dicas pelo brief. motion.mjs fornece molas subamortecidas, criticamente amortecidas e superamortecidas corretas, trilhas multi-alvo, opacidade de troca de texto e ruído semeado. render.mjs fornece renderização de intervalo, desfoque de sub-quadro, servidor HTTP local, verificações de prontidão e verificações de determinismo não sequencial. audio.py fornece uma partitura determinística, SFX e análise de música opcional. finish.py fornece uma mixagem de loudness de duas passagens, folhas de contato paginadas de filme completo, folhas para telefone, tiras de ação, cópias de loop e verificações técnicas.
Invariantes de qualidade
- O conteúdo deve permanecer compreensível sem som; o som deve reforçar eventos de movimento reais.
- Evite o template genérico de título centralizado/gradiente/desbotamento a menos que solicitado. Prefira uma composição concreta e transformação visível; “novo a cada 2–4 s” é uma heurística de ritmo para formato curto, não uma regra para todo filme.
- Molas expressam massa; escolha amortecimento para o material. Não faça cada rótulo quicar ou substitua movimento linear/periódico intencional por molas.
- O texto entra depois que um contêiner começa a mudar e sai antes que conteúdo incompatível chegue. Mantenha glifos nítidos na escala final e teste a 360 px de largura.
- O tempo de módulo não torna uma costura contínua. Combine posição, velocidade, visibilidade e som de perto do fim e de início; inspecione a reprodução unida.
- Mantenha o determinismo de software/quadro separado da qualidade estética. Um quadro ruim reproduzível ainda é um quadro ruim.