Pular para o conteúdo

Como fazer um vídeo de rolagem de um site

Transforme qualquer site em um vídeo com rolagem suave: cole o link, defina a duração, o formato e o movimento e exporte um MP4, WebM ou GIF sem marca d’água.

Aviral LakhanpaulAtualizado em 4 min de leitura

A resposta curta

Cole o endereço da página em uma ferramenta de URL para vídeo, como o Website Scroll Video, escolha quanto tempo a rolagem dura e a proporção de que você precisa, veja a prévia e exporte. A página abre em um navegador de verdade em um servidor, os avisos de cookies são removidos e cada quadro da rolagem é calculado, então você recebe um MP4, WebM ou GIF uniforme sem gravar a sua tela.

Antes de começar

Você precisa de três coisas: um endereço público, uma conta para exportar e uns cinco minutos.

  • Uma URL pública. Qualquer coisa que abra numa janela anônima do navegador sem senha. Um link de staging funciona se for público, como um endereço .framer.website do Framer ou um .webflow.io do Webflow. localhost e páginas atrás de login não funcionam.
  • Uma conta. Ler a página e ver a prévia é grátis. Exportar custa créditos, e toda conta nova recebe 51 deles uma única vez, sem cartão.
  • Uma noção de onde o vídeo vai parar. Um Reel, um portfólio, um e-mail para um cliente. Isso decide o formato e a duração, as duas únicas configurações que você não consegue corrigir depois sem exportar de novo.

O vídeo em seis passos

  1. Cole o link

    Cole o endereço no campo da página inicial e aperte Enter. Abrimos a página em um navegador de verdade, esperamos as fontes e as imagens com carregamento lento e lemos tudo de cima a baixo. Nada é gravado da sua tela.

  2. Escolha o dispositivo e o formato

    Desktop lê a página na largura de desktop e oferece 16:9, 4:3 ou 1:1. Tablet e Celular leem nessas larguras, para o site servir o seu layout responsivo de verdade, e oferecem 9:16, 4:5 ou 1:1. Precisa seguir uma especificação? Digite um tamanho exato.

  3. Defina a duração

    A duração vai de 2 a 90 segundos e também define a velocidade da rolagem: a mesma página em seis segundos é um teaser; em trinta, é um tour.

  4. Escolha o movimento

    Suave acelera e desacelera com calma, Deslizante começa rápido e vai parando aos poucos, Linear mantém uma velocidade só, e Pulso desce a página uma seção por vez. Ponha a Reprodução em Descer e voltar se o vídeo precisar repetir em loop sem emenda.

  5. Adicione esperas, pausas e hovers

    Opcional, e é onde está a maior parte do acabamento. Segure a imagem parada por até 10 segundos no início ou no fim, pare em até 6 seções e aponte um cursor para botões e cards para os efeitos de hover aparecerem.

  6. Veja a prévia e exporte

    A prévia roda no seu navegador e não custa nada, por mais que você a repita. Quando estiver do jeito certo, exporte um MP4, WebM ou GIF. O custo exato em créditos aparece no botão Exportar antes de você clicar.

As configurações que importam

Quase tudo no editor tem um padrão sensato. Estas são as que merecem uma segunda olhada.

Configurações recomendadas para um vídeo de rolagem de site
ConfiguraçãoComece comMude quando
DuraçãoUns dois segundos para cada tela roladaFor um teaser (encurte) ou as pessoas precisarem ler o texto (alongue, ou adicione pausas)
Quadros por segundo60 fpsO tamanho do arquivo importar mais que a fluidez. 30 fps corta os quadros pela metade. O GIF vai até 24
Resolução1080pFor exibido numa tela grande ou recortado depois (1440p ou 4K), ou for um rascunho rápido (720p)
MovimentoSuaveFor um loop de fundo (Linear) ou um tour de produto que deve parar em cada seção (Pulso)
FormatoMP4Você precisar de transparência ou arquivos menores (WebM) ou ele tiver que tocar dentro de um e-mail (GIF)
MotorDeslocamento estáticoA página tiver revelações ao rolar ou parallax que você quer manter (Captura ao vivo)

Se a página for longa e só a metade de cima vender, arraste as alças abaixo da prévia para definir onde a rolagem começa e termina. Uma rolagem mais curta com a mesma duração é mais lenta e mais fácil de ler.

Quanto custa

A duração custa um crédito a cada 2 segundos de vídeo pronto, e algumas configurações somam um valor fixo: resoluções maiores, taxas de quadros maiores, Captura ao vivo, largura de tablet ou celular, pausas e hovers. Uma exportação de 10 segundos em 1080p e 60 fps, lida na largura de desktop, custa 21 créditos, então os 51 que você ganha ao criar a conta cobrem isso duas vezes.

Depois disso, os créditos vêm em pacotes (US$ 5 por 100, US$ 12 por 400 e US$ 19 por 900) e nunca expiram. Não há assinatura nem marca d’água em nenhum deles. Como funcionam os créditos tem a tabela completa.

Se algo parecer errado

  • Uma animação de revelação sumiu ou uma seção aparece em branco. O motor rápido percorre uma imagem parada da página, então os efeitos acionados pela rolagem não tocam. Mude o motor para Captura ao vivo ou ative «Assentar animações» para levá-las até o estado final. Veja como capturar animações de rolagem.
  • Um aviso de cookies ou uma bolha de chat passou. Deixe «Dispensar avisos de cookies e pop-ups» ativado e adicione o que escapou em «Ocultar elementos» como um seletor CSS. Mais em como remover pop-ups de uma gravação.
  • A página mostra uma tela de login ou um erro. Ela precisa ser pública. Não conseguimos entrar por você, e alguns sites recusam navegadores automatizados de cara.
  • O vídeo para celular parece uma página de desktop espremida. Escolha Celular como dispositivo em vez de uma proporção alta no Desktop, para o site servir o layout de celular. Veja como gravar a versão mobile.

Teste no seu próprio site

Cole um link e veja a prévia da rolagem de graça. 51 créditos grátis ao criar a conta, sem cartão e sem marca d’água em nada que você exportar.

Buscas recentes

    Perguntas e respostas

    A versão curta do que as pessoas perguntam em seguida.

    Contato
    Dá para fazer um vídeo de rolagem de site de graça?

    Dá. Toda conta nova recebe 51 créditos grátis uma única vez, sem cartão, o que basta para algumas exportações curtas em 1080p. A prévia nunca custa nada, e nenhum vídeo tem marca d’água, sejam quais forem os créditos que pagaram por ele.

    Preciso instalar alguma coisa?

    Não. Não há app nem extensão de navegador. A página é aberta e capturada nos nossos servidores, então funciona do mesmo jeito em um notebook, um tablet ou um celular.

    Dá para fazer um vídeo de rolagem de um site que ainda não está no ar?

    Só se ele tiver um endereço público. Publique em uma URL de prévia ou de staging que abra sem senha e cole essa. Endereços locais e redes privadas ficam fora do alcance.

    Quanto tempo deve ter um vídeo de rolagem de site?

    É possível qualquer duração entre 2 e 90 segundos. Para a maioria das landing pages, de oito a quinze segundos funcionam bem; para teasers em redes sociais, de seis a dez, e um tour completo de portfólio pode chegar a trinta com algumas pausas.

    Logotipo do Website Scroll Video, um botão de reprodução sobre uma página web em uma janela do navegador.

    Menos tempo gravando. Mais tempo criando.

    Automatize gravações de sites com movimento personalizável, controles inteligentes e opções de exportação pensadas para criadores de hoje.