How to record a website for Instagram Reels
The mistake is recording 16:9 and cropping. Frame vertical first and the site lays itself out for you.
To record a website for Instagram Reels, capture it at 1080 x 1920 pixels (9:16, vertical) rather than recording a desktop browser and cropping afterwards. On a Mac, Viewport sets that frame before recording, so the site lays itself out at vertical width and fills the Reel edge to edge instead of sitting in a letterboxed strip.
The frame to record at
1080 x 1920
9:16 · vertical
Recording at vertical width makes the site render its own mobile layout, so you are capturing the design as it was actually built for that width rather than a slice cut out of the desktop one.
Why Instagram Reels is different
Reels are watched full-screen on a phone, held vertically, usually with the sound off. That does three things to a website recording: any horizontal letterboxing wastes most of the screen, small type becomes unreadable, and the first half-second has to carry the whole hook because there is no title card and no audio to lean on. A cropped desktop capture fails all three at once.
How to record it, step by step
Open the site in Viewport
Paste the URL into Viewport and let the page load completely. Waiting for fonts, images and entry animations to settle before you record is what stops the first second of the take looking half-built.
Frame it at 1080 x 1920
Set the recording size to 1080 x 1920 (9:16, vertical) before you record. Recording at vertical width makes the site render its own mobile layout, so you are capturing the design as it was actually built for that width rather than a slice cut out of the desktop one.
Place the interactions on the timeline
Add the scrolls, clicks and hovers you want as points on the timeline rather than performing them live. Each one is a position and a moment, not a gesture you have to land.
Adjust the timing until it reads
Drag the points to change pacing. Viewport interpolates the motion between them, so a scroll that felt rushed becomes a scroll that reads - without reshooting anything.
Play it back and export
Play the sequence back at phone size before you commit. Export as MP4 at 1080 x 1920 and check that nothing important sits in the lower band where Instagram overlays the caption.
Instagram Reels video specifications
| Recommended resolution | 1080 x 1920 px |
|---|---|
| Aspect ratio | 9:16 |
| Maximum length | Up to 3 minutes |
| Format | MP4 (H.264) or MOV |
| Frame rate | 30 fps |
Source: Instagram Help Center. Checked . Third-party pricing and limits change; confirm at the source before relying on them.
Three things that make the difference
Start on motion, not on a static frame
Place your first scroll point within the opening half second. A Reel that begins on a still screenshot reads as an image and gets scrolled past before the motion arrives.
Keep the bottom 250px clear
Instagram overlays the caption, handle and audio credit across the lower portion of the frame. Anything you need read - a price, a CTA, a logo - belongs above it.
Slow the scroll down more than feels right
A scroll that reads comfortably on a 27-inch display is roughly twice as fast as it should be on a phone. Drag the timeline points further apart and watch it back at phone size before exporting.
Recording for Instagram Reels, answered
Frame it at 1080 x 1920 before you record.
Viewport sets the recording size first, so the site lays itself out at that width instead of being cropped afterwards. Then you build the scroll on a timeline and it plays back the same way every take.
Usual price $19.99 founder discount · macOS 13.1 or later
Related guides
Dribbble shots are displayed at a 4:3 aspect ratio with a recommended width of at least 1600 pixels, so record the site at 1600 x 1200 rather than at 16:9. Shot videos are short - around 24 seconds - and autoplay muted in a grid of competing thumbnails, which makes the first two seconds of motion the entire decision.
For LinkedIn, record websites at 1080 x 1080 (1:1) or 1080 x 1350 (4:5) rather than 16:9. The feed is a narrow column on mobile, and a square or portrait video occupies substantially more vertical space than a landscape one - which is the single largest lever on how long the post stays on screen.
Record websites for X at 1920 x 1080 (16:9), which is the frame the timeline renders inline without cropping. The constraint that matters more than size is compression: X re-encodes aggressively, so fine type and low-contrast UI degrade visibly. Record tighter than feels necessary and the loss is far less obvious.