Blog · How-to

How to Make a Scroll Video of Your Website (for Portfolios and Clients)

A static screenshot shows what a site looks like. A scroll video shows how it feels: the animations, the pacing, the way sections reveal themselves. Here's how to make one that looks smooth and professional.

Why scroll videos work so well

  • Portfolios and case studies: they show motion and interaction that screenshots miss.
  • Social posts: a short video of a site stops the scroll on Instagram, LinkedIn and Dribbble far better than a still image.
  • Client updates: send a quick video of the new homepage instead of asking them to click around a staging link.

Option 1: record it yourself with a screen recorder

Any screen recorder works: QuickTime on Mac (File → New Screen Recording), the Xbox Game Bar on Windows (Win+G), or the free OBS Studio.

  1. Resize your browser to the size you want the video to be.
  2. Start recording, then scroll the page slowly with your trackpad or the arrow keys.
  3. Trim the start and end in a video editor.

The problem: hand scrolling is almost never smooth. Mouse wheels jump in steps, trackpads speed up and slow down, and you'll see your cursor and probably a notification or two. It's fine for a quick share, but it rarely looks polished.

Option 2: let an extension scroll and record for you

Pretty Sites has a Scroll capture mode that does the scrolling for you at a perfectly steady speed and saves an MP4.

  1. Add Pretty Sites to Chrome and open the site you want to record.
  2. Click the camera in your toolbar and pick a speed (slow, normal or fast) and a size: 16:9 for a normal desktop video, tablet, phone, or your window as it is.
  3. Click Scroll capture. After a 3-2-1 countdown it glides from the top of the page to the bottom while it records.
  4. Your MP4 opens in a new tab, ready to download.

Hands off while it records, and press Esc if you want to cancel. Scroll videos use credits: 1 credit per video at any size, and your first one is free when you make an account. If a recording fails or you cancel it, the credit comes back automatically. See pricing.

Tips for a great scroll video

  • Close the cookie banner and pop-ups first. Accept or dismiss them before recording so they're not floating over every frame.
  • Let the page fully load. Wait for fonts, images and the hero animation to finish before you start.
  • Pick the speed for the platform. Slow suits portfolios and case studies where people want to look closely. Fast suits social posts where attention is short.
  • Record the phone layout too. A side-by-side of desktop and phone shows off responsive work. See how to show a site on every screen size.
  • Use your best-looking page. A homepage with a strong hero and a few distinct sections makes a better video than a long text page.

FAQ

What format are the videos?

MP4, which plays everywhere: Instagram, LinkedIn, Dribbble, Behance, Keynote, Google Slides and email.

Can I record a site that's not mine?

Technically yes, it works on any normal web page. If you're publishing the video, make sure you have the right to show that site, for example because you designed it.

Does it work on pages that need a login?

Yes. It records whatever is showing in your tab, so you can sign in first and then record. The video is made in your browser and never uploaded.

Why not just use a GIF?

GIFs are huge files with limited colors, so gradients and photos look blotchy. An MP4 is smaller and much sharper.

Keep reading