Motion Skills
← Skills
GrátisRedes sociais

Antes / depois

Uma comparação com um divisor que varre a imagem.

Cole no Claude Code, no Codex, no Cursor ou em qualquer agente que suporte skills.

Requer: Node.js 22+, FFmpeg, Chrome. Sem chaves de API.

Outros temas e formatos

Antes / depois · Papel · 9:16
Tema: Papel · 9:16
Antes / depois · Elétrico · 1:1
Tema: Elétrico · 1:1

Quadros finais do mesmo template, renderizados com outro tema e formato.

5 temas

  • Tinta · padrão
    ink
  • Papel
    paper
  • Elétrico
    electric
  • Noir
  • Areia
    sand

Cite um tema no seu prompt ou defina suas próprias cores de destaque, fundo e texto.

Prompt de instalação
Leia https://claude-motion.com/skills/before-after/install.md, siga os passos para instalar a skill "before-after" e depois faça um primeiro vídeo com ela.

Cole no Claude Code, no Codex, no Cursor ou em qualquer agente que suporte skills.

Prompt de exemplo
Use the before-after skill with assets/old.png and assets/new.png, title "Checkout, rebuilt", labels "v1" and "v2". 16:9.
Prompt de estilo (Claude Motion ou Opus 5.5)
Make an 8-second 16:9 before-and-after comparison for [who will watch, e.g. customers], playing [where, e.g. the redesign announcement]. Use only the two screenshots and the title I give. Dark background.

The title fades in above a large rounded frame showing the before screenshot in grayscale, labeled "BEFORE". A white vertical divider with a round handle sweeps from right to left, revealing the after screenshot in full color with an orange "AFTER" tag. End frame: the divider swings back to about three quarters and settles in the middle.

Title: [e.g. "The redesign"]
Attach: [a before screenshot and an after screenshot, same size]

Nada para instalar: cole no Claude Motion (Team ou Enterprise) ou dê ao Opus 5.5 para um visual parecido. O resultado muda a cada execução; a skill dá sempre o mesmo.