Vídeo em loop perfeito: como fazer um que nunca dá salto

Um loop perfeito é um vídeo cujo último quadro leva direto ao primeiro, para que possa se repetir para sempre sem que ninguém veja onde ele começa. O segredo é que tudo no quadro precisa voltar para casa no momento exato: cada posição, cor, nível de luz e partícula termina um passo antes de onde começou. Acerte isso e um clipe de dez segundos pode tocar o dia inteiro.

Este guia explica por que os loops dão salto, como criar movimento que volta sozinho, como salvar uma filmagem que não foi feita para loop e como conferir a emenda antes de publicar. Para o visual do loop em si, veja fundos gradientes animados.

Por que a maioria dos loops dá salto

Um salto na emenda sempre tem uma causa específica, e cada uma tem uma solução específica. Ajuda dar nome àquela que você está vendo.

A terceira causa é traiçoeira. Se você anima de A até B e volta com suavização nas duas pontas, o movimento desacelera até parar na emenda e o loop parece hesitar. A suavização pertence ao começo e ao fim de um movimento único, não à emenda de um loop. O guia de easing explica a diferença.

Como criar movimento que forma loop sozinho

Os loops mais limpos são feitos de movimento periódico: movimento que se repete por natureza, como um ponto dando a volta num círculo ou uma luz que cresce e diminui. Se tudo o que se move completa um número inteiro de ciclos dentro da duração do vídeo, o último quadro se alinha com o primeiro automaticamente. Círculos, ondas senoidais e voltas completas de matiz são todos periódicos.

const fps = 30
const seconds = 10
const frames = fps * seconds            // 300 frames, numbered 0 to 299

for (let i = 0; i < frames; i++) {
  const phase = i / frames              // 0 up to, but never reaching, 1
  const turn = phase * Math.PI * 2      // one full turn per loop

  const x = Math.cos(turn) * 40         // drift in a circle, 40 px across
  const y = Math.sin(turn) * 40
  const hue = 280 + Math.sin(turn * 2) * 20   // two gentle hue swings per loop
  const glow = 0.5 + 0.5 * Math.sin(turn)     // light breathes once per loop

  drawFrame(i, { x, y, hue, glow })     // your renderer
}

Esse último detalhe é o que evita o tropeço. Se o seu último quadro é idêntico ao primeiro, o player mostra essa imagem duas vezes seguidas a cada repetição. O último quadro deve ser o imediatamente anterior ao primeiro.

Ruído, grão e partículas em loop

Texturas orgânicas costumam ser feitas de ruído, que por padrão não se repete. O truque padrão é percorrer o ruído em círculo, e não em linha reta, para que depois de um loop você volte ao mesmo ponto dele. Sistemas de partículas são diferentes: a posição de cada partícula depende das anteriores. Rodar a simulação por um loop inteiro antes de gravar deixa as partículas entrarem no ritmo, para que o fim gravado fique perto do começo.

Como fazer loop com uma filmagem que não foi feita para isso

Clipes filmados, como ondas, fumaça ou nuvens, raramente terminam onde começam. A solução clássica funciona em qualquer editor de vídeo: leve a emenda para o meio do clipe, onde a filmagem já é contínua, e esconda o novo corte com uma transição cruzada.

1. 1

   Divida o clipe no meio

   Corte o clipe em duas metades, A e B, num momento de movimento constante.

2. 2

   Troque as metades

   Coloque B primeiro e A depois. O fim de A agora flui para o começo de B, porque aquele era um momento contínuo no original, então o ponto do loop fica perfeito.

3. 3

   Faça a transição cruzada no novo meio

   Onde B encontra A, sobreponha os dois por meio segundo a dois segundos e funda um no outro. Filmagens suaves e cheias de textura escondem melhor uma transição cruzada.

4. 4

   Corte numa duração redonda

   Mire num número inteiro de segundos, o que torna o loop fácil de cronometrar e de reutilizar.

Como escolher a duração do loop

Loops mais longos parecem menos repetitivos, mas geram arquivos maiores e precisam de mais movimento periódico para continuar interessantes. Loops curtos se repetem com frequência, então o movimento deve ser sutil o bastante para não ficar hipnótico. A 30 quadros por segundo, um loop de 10 segundos tem 300 quadros, que se dividem direitinho em metades, terços e quartos para os seus ciclos.

Como conferir a emenda

Não avalie um loop assistindo uma vez num editor. Assista do jeito que as pessoas vão encontrá-lo: repetindo, em tamanho real, por mais tempo do que parece necessário. Emendas que se escondem numa prévia pequena muitas vezes aparecem numa tela grande.

# Play the loop four times in a row as one file, to watch the joins
ffmpeg -stream_loop 3 -i loop.mp4 -c copy loop-x4.mp4

# Save the first and last frames as images to compare side by side
ffmpeg -i loop.mp4 -vf "select=eq(n\,0)" -frames:v 1 first.png
ffmpeg -sseof -0.5 -i loop.mp4 -update 1 last.png

• Assista ao arquivo repetido quatro vezes em tela cheia e olhe só para a emenda.
• Olhe as bordas e os cantos, onde a deriva é mais visível.
• Observe o grão e as partículas separadamente da cor.
• Se você vir um leve pulso na emenda, é compressão: exporte com qualidade maior.

Se você faz loops no Gradiently, isso já é resolvido para você: todo loop exportado é construído para que o campo em movimento complete ciclos inteiros dentro da duração que você escolhe, de 5 a 30 segundos, e o fim encontre o começo. É a mesma abordagem que você usaria em código, aplicada ao seu Mark. Loops também dão ótimos papéis de parede animados e vídeos de fundo para sites.