How to Record a Website Walkthrough Video for Clients

A good website walkthrough video for a client is really a set of short videos, one per task ("edit a page", "add a blog post"). Each one records a clean browser window, shows your face in a corner and never shows a password or API key. To make one, log in before you record, record only the browser window, blur anything private in the editor, and export each task as its own MP4.

Below is that workflow on a Mac. It uses the built-in tools where they are enough and Screen Bolt (the recorder we make) where you need a webcam overlay, blur or auto zoom.

Why agencies send walkthrough videos

A handoff call happens once. The client's new marketing hire joins six months later and has never seen the CMS. A folder of short videos answers "how do I change the homepage banner" without a support ticket or another call.

Videos also show things a written guide struggles with: where a button is, what the editor looks like after you click it, and which fields to leave alone. A written guide still helps. The two work best together, as a short index document that links to each video.

What a good website walkthrough video looks like

• One task per video, ideally 1 to 3 minutes. The client can find the right one and rewatch it.
• Readable text at the size the client will watch it, often a small browser window or a laptop screen.
• Your face for the first few seconds so it feels like a handoff from a person, then a small webcam bubble in a corner.
• No secrets on screen: no passwords, API keys, other clients' sites or your own inbox.
• Plain files the client keeps: MP4s with clear names, not a link that expires when your subscription does.

What to cover in a client handoff video

Plan the list before you record. A typical CMS handoff splits into these videos:

1. Logging in and the dashboard: where the admin URL is, what each main menu item is for.
2. Editing an existing page: text, images, saving and previewing.
3. Adding a new page or blog post, including SEO title and description fields if the site has them.
4. Replacing images: sizes that fit the layout, where uploaded files go.
5. Menus and navigation.
6. Forms: where submissions go and how to change the recipient.
7. Things not to touch: theme settings, plugins or integrations that would break the site.
8. Users and access: adding a team member with the right role.
9. Who to contact, and which changes you'd rather make for them.

Write two or three bullet points per video. If you like reading from notes, Screen Bolt's teleprompter (the Script button on the recording bar) floats on screen but is not captured in the recording. A [PAUSE] cue marker in the script is a handy reminder to stop talking while a page loads. See how to read a script while recording for that setup.

Prepare the site and browser before you record

Most of what can leak sits in the browser, not the recorder.

• Use a staging site or a demo admin account if you can. Change or delete its password after recording.
• Log in before you press record. The browser masks password fields, but the username, autofill dropdowns and password manager pop-ups are visible.
• Use a clean browser profile with no other tabs, no bookmarks bar full of other clients, and no extensions showing badges. Address bar suggestions can reveal your history the moment you type.
• Turn on a Focus such as Do Not Disturb from Control Center so notifications don't appear.
• Zoom the browser in one or two steps with ⌘+ (Command-Plus). CMS admin screens use small type, and a slightly larger page stays readable after export. More tips are in how to make text readable in screen recordings.
• Resize the browser window to roughly the shape of your final video (close to 16:9 for a normal landscape video) so it fills the frame without large empty bands.

Built-in recorder or Screen Bolt

macOS can already record your screen. Press ⇧⌘5 (Shift-Command-5) to open the Screenshot toolbar and choose Record Entire Screen or Record Selected Portion. QuickTime Player gives you the same recorder. For a quick screen-only walkthrough with nothing private on screen, that is enough.

The built-in recorder has no blur, no webcam overlay of its own and no way to zoom in on what you clicked. For client handoffs, that is usually where it falls short.

Short task videos fit inside the free version's 3-minute export cap. For client work, the catch is the "Made with Screen Bolt" watermark in the bottom-right corner and the 720p ceiling.

Record the browser window cleanly

These steps use Screen Bolt's Window mode, which records the browser window on its own. Other windows that cover it don't end up in the recording.

1. Open Screen Bolt. The floating recording bar appears.
2. Click Window. In Select Window to Record, click your browser window, then click Record Window (or press Return) to confirm the selection.
3. Click Camera and choose your webcam or iPhone. A round preview bubble appears on screen; it is not recorded. Choose Hide camera preview if it distracts you (the camera still records).
4. Click Mic and choose your microphone. A level meter shows on the button so you can check your voice registers.
5. Click Audio and choose Don't record system audio, unless the site plays sound you need to demonstrate.
6. Click the red record button.
7. Use Pause between steps if you need to check your notes, and Discard and restart to throw away a bad take without creating a project.
8. Click Stop. The editor opens, with zoom regions already created from your clicks if automatic zooms are on (the default).

The first time, macOS asks for Screen Recording, Camera and Microphone access. On macOS 14, quit and reopen Screen Bolt after granting Screen Recording. The getting started guide covers permissions.

You can also press ⌥⌘4 (Option-Command-4) to open the window picker and start recording in one go. It only works while Screen Bolt is the active app. More detail on sources is on the recording help page and in how to record a single window on Mac. Window vs Area: Window mode gives the cleanest result, but it ignores live blur zones (see below). If you want to cover something while recording, use Area and drag a rectangle around the browser instead.

Scroll and click so the video stays watchable

Auto zoom is driven by mouse clicks only. Clicks close together (within 1 second and 200 px) become one zoom, each zoom holds for at least 1.8 seconds, and while zoomed the view follows your cursor. Scrolling and typing don't create zooms. In practice:

• Click with purpose. Every nervous click on empty space becomes a zoom. Move the pointer to the next button, pause, then click.
• Scroll in short, slow moves, then stop before you talk. A fast flick through a long page is unreadable at any resolution.
• Don't click right before a long scroll unless you want to stay zoomed in while the page moves under the zoom.
• Lower the zoom level for browser work. In the editor's Zoom panel, Default Level is 2.0×, which can crop out too much of an admin screen. Try 1.5× and click Apply to All Regions.
• Delete or add zooms on the zoom track. Right-click a region and choose Delete This Region, or press ⌘K to add a zoom at the playhead. Don't switch off Auto Zoom on Click to remove a few zooms: that toggle disables every zoom region, including manual ones.

How to zoom in on a screen recording covers the zoom track in more depth.

Open with your face, then shrink to a corner

In the editor's Webcam panel, Fullscreen Moments lets the camera take over the whole canvas for a range. Press I at the start and O after your greeting, then click Add from Marked Range. For the rest of the video, set Position to a corner the CMS doesn't use (often bottom-right, away from the admin menu) and keep Size small.

Blur logins, emails and API keys

Not showing secrets beats blurring them. Log in before recording, use a demo account, and skip settings screens that display API keys. When something private does appear, Screen Bolt has three tools.

Blur regions in the editor (any recording mode)

1. Move the playhead to where the private field appears.
2. Press B (or click Add Blur Region in the Effects panel). A 5-second blur appears at the playhead.
3. Under Edit Blur Region, pick a Style: Gaussian, Pixelate or Solid Color. Use Solid Color for keys and tokens so nothing is left to guess.
4. Set Region X / Y / W / H to cover the field, and set Duration (0.5 to 60 seconds) to cover the whole time it is on screen.

A manual blur region stays where you put it. If you scroll while the field is visible, the field can move out from under the blur, so step through that stretch with the ← and → keys (one frame at a time) before exporting.

Auto-Detect Sensitive Text

In Effects ▸ Blur / Privacy, Auto-Detect Sensitive Text scans the recording on your Mac and blurs every email address it finds. Turn on Also detect phone numbers and add Custom keywords (for example the client's admin username or domain) to catch more. These blurs follow the text through zooms and scrolling, which suits long admin pages.

It does not look for passwords or API keys, so use manual blur regions for those. Finish your cuts, clip reordering and speed changes before you scan, because detections don't move with later edits. Then review every result on the Blur track before exporting.

Live blur zones while recording (Display and Area only)

Click Blur on the recording bar and draw rectangles. Each one becomes a frosted window that appears in the recording, and you see it on your own screen too. Limits that matter for browser work:

• Zones stay at fixed screen positions, so they don't follow scrolling.
• They are drawn on the main display only.
• They do nothing in Window mode, because Window mode records the window itself.
• You can't click through a zone to the page underneath.

They fit a static spot, like a sidebar with a client list you can't hide. Treat them as a convenience and check the export; they are not secure redaction. For more on blurring, see hiding sensitive information in screen recordings.

Only send the exported file

The toolbar's Share button sends the raw recording.mov, not your edited export, so any blur you added is missing. The .screenbolt project folder also holds that raw recording, and auto-detected text is saved as each blur's label in project.json. Send clients the exported MP4 and nothing else.

Split the handoff into short videos

The simplest way is to record each task as its own recording.

1. After exporting one video, click New Recording in the editor toolbar. The editor saves and closes, and the recording bar comes back.
2. Record the next task.
3. Click the recording title in the editor toolbar to rename the project, for example "03 Add a blog post". Projects are saved in ~/Screen Bolt Projects by default.

Separate recordings matter more on the free version. The export sheet checks the 3-minute cap against the full recording length, so a 10-minute recording trimmed down to 2 minutes is still refused.

If you already recorded one long walkthrough (this needs Pro), export it once in full with your zooms and blurs, then:

1. Choose File ▸ Create project from video... and pick the exported file.
2. Press I at the start of a section you don't need and O at its end, then click Cut I-O. Repeat until only one task is left.
3. Export, then repeat from step 1 for the next task.

Edits to a video opened this way are not saved, so export before you close it. The zooms and blurs from the full export are already baked in, so the cuts can't shift them. Because the video is encoded twice, set Compression to Studio in Settings ▸ Quick export for the full export. For other trimming options, see how to trim a screen recording on Mac.

Export and deliver the files

1. Click Export in the editor toolbar.
2. Choose MP4 under Format ("Plays everywhere").
3. Choose 1080p under Quality (Pro), or 720p on the free version.
4. Under Save to, click Change… and pick a folder for this client. The default is your Desktop.
5. Click Export. Finder shows the file when it is done.

Frame rate and file size come from Settings ▸ Quick export. Frame rate (30 or 60 FPS) also sets the recording frame rate, so choose it before you record. Setting Compression to Web gives smaller files than the default Social Media. The export sheet shows an estimated size (±30%), and the video file size calculator helps if the client's portal has an upload limit.

Exports are named Screen Bolt <date> at <time>.mp4. Rename them to match your list, such as 01-log-in.mp4 and 02-edit-a-page.mp4.

Screen Bolt has no share links or cloud upload; recordings are processed locally and never uploaded. Deliver the MP4s through whatever you already use with the client (a shared folder, their project portal or a private video host), plus a one-page index listing each video, what it covers and the admin URL. Never put the password in that document.

Brand colors behind the recording

Use the Image background with a brand-colored image, or a built-in wallpaper. Custom gradient colors export as the selected wallpaper's gradient, and a solid color exports as a dark gradient. Device frames show in the preview but don't appear in exports.

Common mistakes

• Typing a password on camera. Log in first, or blur the username and autofill pop-up.
• Sending the raw recording. Share and the project folder contain the unblurred recording.mov.
• Drawing live blur zones in Window mode. They don't apply there; use editor blur regions.
• One 40-minute video. Nobody finds the 2-minute section on menus. Split by task.
• Leaving other clients visible in tabs, bookmarks or address bar suggestions.
• Forgetting the free-version limits. Exports are watermarked, 720p and capped at 3 minutes. Pro removes them for a one-time $79 (as of November 2026). See Screen Bolt pricing.

If the handoff turns into an ongoing help library, how to make how-to videos for your help center covers naming, updates and hosting. For design-stage handoffs, see how to record a Figma prototype walkthrough.