A versão curta
- Em posts e stories, um loop de vídeo de 5 a 15 segundos costuma ser longo o bastante para se ler e curto o bastante para se repetir.
- Os loops de fundo de sites funcionam bem entre 10 e 30 segundos, com um tamanho que carregue depressa.
- Os ecrãs em lojas, espaços e receções pedem loops mais longos, de 20 a 30 segundos, porque as pessoas veem-nos muitas vezes.
- Os GIFs animados para emails devem ficar nos 2 a 5 segundos, porque os ficheiros GIF crescem depressa com a duração.
- O movimento lento faz qualquer duração de loop parecer mais calma e esconde o momento em que o loop recomeça.
Nesta página
Que duração deve ter um loop de vídeo? Na maioria dos posts e stories, 5 a 15 segundos. Num fundo de site, 10 a 30 segundos. Num ecrã de loja ou espaço onde as pessoas passam todos os dias, 20 a 30 segundos, e num GIF de email, apenas 2 a 5 segundos. A duração certa é um equilíbrio entre três coisas: o tempo para ler as palavras, a frequência com que as pessoas vão ver o recomeço e o tamanho do ficheiro. Um loop perfeito com movimento lento pode ser mais curto do que esperas.
Duração do loop de vídeo por local de exibição
Duração do loop
Porquê
Duração do loop
Porquê
Duração do loop
Porquê
Duração do loop
Porquê
Duração do loop
Porquê
Duração do loop
Porquê
Três fatores que decidem a duração
O tempo para ler as palavras
Se o loop leva uma mensagem, tem de ficar no ecrã o tempo suficiente para alguém a ler com conforto, idealmente duas vezes. Um título de três palavras precisa de poucos segundos; um título, uma data e um local precisam de mais. Se as palavras entram animadas, conta a partir do momento em que assentam, não desde o início.
A frequência com que se vê o recomeço
Todos os loops têm uma emenda, o momento em que o último fotograma encontra o primeiro. Mesmo um loop perfeito repete o seu padrão, e quantas mais vezes alguém o vê, mais o nota. É por isso que os loops vistos durante muito tempo, como os ecrãs de um café ou o cabeçalho de um site, merecem mais segundos do que um post por onde se passa em dois.
Tamanho do ficheiro
A duração é o que mais pesa no tamanho do ficheiro. Se dobras os segundos, com a mesma qualidade, dobras mais ou menos o ficheiro. Num site isso atrasa a página; num email pode levar um GIF além do que as caixas de entrada carregam de bom grado. Loops curtos com movimento lento dão a melhor relação entre sensação e quilobytes.
Curto de mais
- As palavras desaparecem antes de serem lidas
- O recomeço vê-se de dois em dois segundos
- O movimento tem de ser rápido para caber, o que parece nervoso
- Parece um GIF de meme
Longo de mais
- Ficheiro pesado, lento a carregar
- Ninguém vê a segunda metade num feed
- Nada de novo acontece, só mais do mesmo
Ajusta a velocidade do movimento ao loop
A duração e o ritmo trabalham juntos. Uma deriva lenta ao longo de 10 segundos parece calma e cara; a mesma deriva espremida em 3 segundos vira um tremor. Como regra, escolhe primeiro o ritmo e depois a duração mais curta em que um ciclo completo desse movimento pareça sem pressa. Movimentos suaves, como a cor a respirar devagar ou a luz a passar por um gradiente, podem repetir-se em qualquer duração porque nunca chamam a atenção para onde começam.
Um loop de story de 8 segundos: uma linha de texto, uma deriva lenta, a desaparecer antes de se repetir demasiadas vezes.
Um loop de ecrã de balcão de 30 segundos: o fundo respira tão devagar que quem está na fila nunca vê o recomeço.
Duração do vídeo de fundo de um site
Um vídeo de fundo num site deve ter 10 a 30 segundos, sem som e o mais pequeno que consigas sem perder limpeza: aponta para uns poucos megabytes, não dezenas. Dá-lhe uma imagem de capa para haver algo à vista enquanto carrega e pára-o para os visitantes que pediram ao dispositivo menos movimento. O guia vídeo de fundo para site explica a compressão e os formatos em pormenor.
<video class="hero-loop" autoplay muted loop playsinline
poster="/hero-poster.jpg" preload="metadata">
<source src="/hero-loop.webm" type="video/webm">
<source src="/hero-loop.mp4" type="video/mp4">
</video>
<script>
// Pause the loop for visitors who prefer less motion
if (matchMedia('(prefers-reduced-motion: reduce)').matches) {
document.querySelector('.hero-loop').pause();
}
</script>Escolher a duração do loop, passo a passo
- 1
Parte do local de exibição
Toma o intervalo inicial da tabela acima para o sítio onde o loop vai ser reproduzido.
- 2
Cronometra as palavras
Lê o texto em voz alta duas vezes, a um ritmo descontraído. O loop deve durar pelo menos isso depois de as palavras assentarem.
- 3
Define o ritmo
Escolhe movimento lento para loops de marca e ecrãs; guarda o movimento vivo para posts curtos e enérgicos.
- 4
Vê-o cinco vezes
Reproduz o loop em repetição. Se o recomeço começar a incomodar à quinta vez, acrescenta segundos ou abranda o movimento.
- 5
Confirma o ficheiro
Se for pesado de mais para a página ou para o email, encurta-o antes de baixares a qualidade.
Para formatos específicos, vê o tamanho do Spotify Canvas, os cabeçalhos de email animados e o vídeo ambiente para ecrãs que passam o dia inteiro.
Durações de loop no Gradiently
Com o Pro, o Gradiently exporta qualquer design como loop perfeito de 5 a 30 segundos, em MP4 ou WebM até 1080p, ou como GIF. Escolhes os segundos e um ritmo lento, regular ou vivo, e o movimento do Mark está feito para se unir sem emenda visível seja qual for a duração. A gravação corre em tempo real, por isso um loop de 30 segundos demora 30 segundos a fazer; mantém o separador aberto até acabar.
Perguntas frequentes
Que duração deve ter um vídeo em loop para o Instagram?
De 5 a 10 segundos para um post de feed e de 5 a 15 segundos para um fundo de story ou Reel, o suficiente para ler as palavras duas vezes.
Que duração deve ter um vídeo de fundo para um site?
De 10 a 30 segundos, sem som e comprimido para uns poucos megabytes, com imagem de capa e pausa para visitantes que preferem movimento reduzido.
Que duração deve ter um loop de GIF?
Cerca de 2 a 5 segundos. Os ficheiros GIF crescem depressa com a duração, o que pesa sobretudo nos emails.
Um loop mais longo fica melhor?
Só onde as pessoas veem durante muito tempo, como ecrãs e cabeçalhos de sites. Num feed, os segundos extra só somam tamanho de ficheiro que ninguém vê.
Como escondo o sítio onde um loop de vídeo recomeça?
Faz o último fotograma fluir para o primeiro, usa movimento lento e dá aos ecrãs que passam o dia todo um loop mais longo, de 20 a 30 segundos.
Escrito pela Gradiently
A equipa por trás da Gradiently, uma ferramenta de design construída em torno dos Marks: gradientes vivos que fazem tudo o que crias parecer teu.
Ver o nosso perfil