Communitygithub.com

Motion Edits

Crie vídeos de motion graphics de alto nível, vídeos explicativos e edições curtas (Reels/Shorts/TikTok/YouTube) renderizados como MP4 em qualquer proporção, usando um motor Remotion construído a partir da análise quadro a quadro de 82 edições profissionais. Use quando solicitado a criar, projetar, animar, roteirizar, storyboard ou editar um motion graphic, vídeo explicativo, peça de tipografia cinética, promo/anúncio, demonstração de produto ou UI, edição de letra/música, ou uma série desses vídeos para um canal, ou para adicionar motion graphics, legendas, close-ups e transições ao próprio material do usuário.

O que é Motion Edits?

Esta skill transforma ideias ou roteiros em vídeos premium de motion graphics e edição de curtas, usando um motor Remotion e regras extraídas de 82 referências profissionais. Ela suporta dois modos combináveis: motion graphics autônomos (sem necessidade de material bruto) e edição de material do usuário (com cortes, legendas e efeitos). A skill gera especificações em JSON, renderiza MP4s otimizados com acabamento cinematográfico (grão, vinheta) e oferece ferramentas para transcrição de voz, detecção de batidas, análise de material, remoção de fundo e revisão de contato. Ideal para criadores que precisam de vídeos explicativos, Reels/Shorts, demonstrações ou séries para canais, com suporte a diversas proporções (9:16, 16:9, 1:1, etc.).

Funciona com~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/highontrading/motion-edits-skill/tree/HEAD

Perguntar na sua IA favorita

Abre um novo chat com esta habilidade de agente já pré-carregada.

Documentação

O que Motion Edits faz?

Esta skill produz vídeos premium finalizados. Ela funciona a partir de quatro pilares:

  • regras e números medidos quadro a quadro de 82 edições de referência (references/)
  • 12 famílias de estilo para escolher e combinar (references/styles/)
  • um motor Remotion (remotion/) que renderiza uma VideoSpec em JSON: uma cena por cláusula, cortes com easing medido, cortes de momentum, tipo sincronizado com palavras, texturas processuais e acabamento cinematográfico
  • ferramentas para narração, batidas, análise de material, recortes, máscaras, renderização e QA (tools/)

Dois modos, que podem ser combinados em um mesmo vídeo:

  • Motion graphics autônomos: sem necessidade de material bruto. Texto, recortes, maquetes de UI, gráficos, contadores, partículas e texturas sustentam o vídeo.
  • Edição de material: os clipes do usuário são a espinha dorsal. Aperte cortes, faça close-ups, legendas, adicione slams de palavras-chave e cartões de B-roll, coloque texto atrás do sujeito, corrija cor, adicione transições.

Qualquer proporção: defina width/height na especificação (9:16 1080×1920 por padrão; 16:9, 1:1, 4:5 e outras funcionam).

Leia primeiro

  1. references/playbook.md: as regras. Leia toda vez.
  2. references/engine-spec.md: todos os campos da especificação, camadas, transições e comandos de renderização. Leia antes de escrever uma especificação.
  3. references/styles/README.md: escolha uma família de estilo, depois leia o arquivo daquela família (o exemplo de especificação é um bom ponto de partida).

Aprofundamentos, quando uma decisão precisar deles:

  • script-structure.md: modelos de gênero, ganchos, regras cláusula → cena → objetos, exemplos trabalhados
  • motion-language.md: easing, taxas de quadros, ritmo, números de sincronia
  • transitions.md: 63 transições com contagens de quadros e como construir cada uma
  • typography-color.md: classes de tipo, pares, tamanhos, zonas seguras, paletas, quantidades de acabamento
  • sound-design.md: base, ducking, posicionamento de SFX, sincronia com batida, edições só com música
  • footage-editing.md: modos de integração, close-ups, montagem, legendas, duas especificações de material trabalhadas
  • engine-gaps.md: o que o motor ainda não consegue fazer, e soluções alternativas
  • breakdowns/vNN.md + breakdowns/_TAXONOMY.md: evidências quadro a quadro. Pesquise por tag para um precedente (grep -l "text-behind-subject" references/breakdowns/*.md).

Um exemplo completo trabalhado (roteiro → rascunho de VO → especificação) está em remotion/src/specs/examples/zeigarnik.json (roteiro: work/zeigarnik.script.txt).

Fluxo de trabalho

0. Configuração (uma vez por ambiente)

cd remotion && npm install
pip install faster-whisper librosa opencv-python-headless "rembg[cpu]" piper-tts pillow numpy

ffmpeg é necessário. Se o librosa travar com um segfault, defina NUMBA_CACHE_DIR=/tmp/numba_cache.

1. Briefing

Obtenha estes itens, ou escolha padrões sensatos sem travar:

  • tópico ou mensagem
  • plataforma e proporção
  • duração (shorts: 20–45 s)
  • voz: o arquivo de VO do usuário, um roteiro para narração, ou nenhum
  • material bruto ou fotos
  • marca (paleta, fontes, logotipo)
  • tom
  • quantas versões

Se o usuário fornecer apenas um tópico, escreva o roteiro você mesmo.

2. Roteiro → planilha de cláusulas

Use script-structure.md. Gancho na primeira frase (8–15 palavras, choque nas primeiras 3 palavras) → setup → virada → princípio nomeado em 16–40% → prova → moral da antítese → CTA (últimos 10–14%, ≥2.5 s). Divida em cláusulas: uma cláusula = uma cena ≈ 6 palavras ≈ 2–2.8 s. Para cada cláusula, anote:

  • o objeto ou imagem literal para o substantivo
  • a palavra-chave: 1–3 palavras que se tornam texto
  • um dispositivo: badge, contador, UI, gráfico, doodle, troca, partículas
  • o corte para entrar nela

3. Voz e tempo

  • VO do usuário: python3 tools/transcribe.py vo.mp3 remotion/public/<proj>/vo.words.json
  • Ainda sem VO: python3 tools/tts.py script.txt remotion/public/<proj>/vo.wav --speed 1.15 --words remotion/public/<proj>/vo.words.json fornece uma voz de rascunho offline. Avise ao usuário que é um placeholder; a própria VO deles pode substituí-la depois, já que as referências de palavras se reajustam automaticamente quando é re-transcrita.
  • Liderado por música ou sem VO: python3 tools/beats.py music.mp3 remotion/public/<proj>/beats.json, depois defina "beats" e use referências {beat|downbeat|onset: n} e snap.
  • Inícios de cena: {"word": "...", "offset": -0.06} na primeira palavra de cada cláusula. As referências de palavra de cena são resolvidas em ordem, mas use uma referência multi-palavra ("por que escrever") quando a palavra também aparecer logo antes. Palavras-chave usam sync ou at: {word}.

4. Visual

Escolha uma família de estilo (styles README). Depois, fixe:

  • paleta: cores de campo que rotacionam por cena, mais 1–2 acentos com significados fixos
  • par de tipos: uma voz de exibição pesada mais uma voz sussurrada leve
  • animFps: 15 para colagem/editorial, 12 para impressão rústica, 0 para UI/3D/cinematográfico
  • acabamento: grão + vinheta, mais meio-tom para looks de impressão
  • uma transição assinatura, repetida, mais 1–3 tipos de suporte

5. Ativos

  • Material bruto:
    • python3 tools/analyze_footage.py clips/*.mp4 --out work/footage.json --sheets work/sheets, depois olhe as folhas de contato
    • tools/tighten.py remove ar morto
    • tools/matte.py cria uma máscara do sujeito para texto atrás do sujeito
  • Fotos: python3 tools/cutout.py photos/* --out remotion/public/<proj>/cutouts --trim, depois use-as como image com cutout: true. Coloque o tipo em um z menor que o recorte para colocá-lo atrás.
  • Sem ativos: texto, fundos processuais, maquetes de UI, gráficos, contadores, formas, partículas e embed. Escreva um componente personalizado em remotion/src/custom/ apenas quando um objeto literal for essencial.
  • Use apenas logotipos, semelhanças, músicas e SFX que o usuário forneça ou tenha direitos. Aprenda técnicas; nunca copie a marca, personagens, cartões finais ou roteiros de um criador.

6. Escreva a especificação

Escreva work/<proj>.spec.json como {"spec": {...}}, começando a partir do exemplo da família escolhida. Ativos vão em remotion/public/<proj>/. Aplique a checklist do playbook enquanto escreve.

7. Pré-visualização, renderização, revisão, correção

  1. Stills primeiro:
    cd remotion && npx remotion still src/index.ts MotionVideo /tmp/f.jpg --frame=N --props=../work/<proj>.spec.json --scale=0.4
    
    Faça um por cena (quadro no meio da cena), monte em grade, olhe e corrija overflow, contraste, poluição visual e quadros vazios.
  2. Renderização:
    python3 tools/render.py work/<proj>.spec.json out/<proj>.mp4
    
    Adicione --draft para uma prévia em meia resolução. Ele aplica o acabamento de grão e meio-tom no ffmpeg, que é muito mais rápido.
  3. Revisão:
    python3 tools/review_render.py out/<proj>.mp4 out/review/
    
    Leia as folhas de contato e tiras de corte. Verifique se os cortes coincidem com os inícios das cláusulas, nada fica ilegível por menos de 0.5 s, nenhum trecho morto dura mais que 1.5 s, e nada quebrou (camadas em branco, lacunas pretas, revelações de borda).
  4. Corrija e re-renderize. Entregue o MP4 com uma breve lista de planos e qualquer coisa que o usuário deva substituir (VO de rascunho, ativos placeholder, música).

8. Versões e séries

  • Variações: mantenha o roteiro e varie a família de estilo, paleta, par de tipos, transição assinatura, texturas e dispositivo de gancho. Renderize cada uma.
  • Séries de canal: fixe um kit (paleta, par de tipos, acabamento, badge de sobreposição, cartão CTA, 2–3 transições assinatura). Salve em remotion/src/specs/kits/<canal>.json e comece cada episódio a partir dele (veja kits/README.md).

Padrões quando estiver em dúvida

  • Formato: 1080×1920, 30 fps.
  • Estilo: halftone-poster-collage para explicadores, native-ui-explainer para negócios/tecnologia, dark-product-promo para ferramentas.
  • Movimento: animFps 15, settle 1.10 (o padrão), cenas 1.2–2.8 s.
  • Tipo: palavras-chave em impact/bebas no tamanho 18–30, com uma palavra sussurrada em serif-italic ou script. Badges stitched em um acento profundo.
  • Cortes: zoom como assinatura, cut simples para impacto, flash ou invert para revelações, circle para o CTA.
  • Acabamento e áudio: grain 0.07, vignette 0.35. Base musical em musicVolume 0.3 com duckTo 0.12.

Habilidades Relacionadas