How to record a web tool demo for a knowledge base

A useful knowledge base demo shows the steps a reader needs, without making them sit through setup, pauses, or unrelated windows. A little preparation makes the recording easier to follow and easier to update later.

You can use TooLab's Screen Recorder to capture a browser tab, a window, or your screen, with sound, microphone audio, or camera video. It runs in a desktop browser and does not work on phones.

Record the demo

1. Open the Screen Recorder on the computer you will use for the demo. Prepare the web tool and the example you want to show before you start recording.
2. Choose what to share. Select a browser tab for a focused walkthrough, a window to keep other tabs out of view, or the entire screen if you need to show steps in more than one app.
3. Allow screen sharing in the browser. If you want to narrate, enable microphone audio and allow microphone access when asked. If you want to include the page's sound, select its audio option if the sharing dialog offers one.
4. Start recording, then follow the steps in the same order a reader will use them. Move the pointer deliberately, pause briefly after important actions, and explain what should appear on screen.
5. Stop the recording when you reach the end. Play it back and check that the image, narration, and important steps are clear before using the clip in your knowledge base.

For a short demo, keep the recording focused on one task. If you make a mistake, pause, return to the start of that step, and repeat it. You can decide during review whether a stumble is distracting enough to record again.

Choose what the reader needs to see

Share a browser tab for one web page

A tab is a good choice when the complete process happens in one page. It keeps other tabs and most desktop activity out of the recording. If the browser offers a choice to share tab audio, use it only when the page's sound helps explain the task.

Share a window for a cleaner view

Choose a browser window when you want to demonstrate a page but do not need to show other open tabs. This can make a tutorial easier to follow and reduce the chance that a private tab appears on screen.

Share the entire screen for steps across apps

Share the screen if the demo moves between a browser and another program, such as opening a file before importing it. Close private windows and turn off notifications first. Everything visible on the shared screen may be included in the recording.

Use narration when an action needs context

Microphone narration can explain why you choose an option or what result to look for. Keep it direct: say what you are doing, then describe the expected outcome. If the process is self-explanatory, a recording without narration may be easier to maintain when the interface changes.

Fix common recording problems

1. Choose the correct share target. If the video shows the wrong page or leaves out an app, stop and start again with the right tab, window, or screen selected. Check the preview or first few seconds before recording the full walkthrough.
2. Allow screen sharing in the browser. When the browser opens its sharing dialog, select the item you intend to record and confirm sharing. If you previously blocked access, check the site permissions from the icon beside the address bar, then reload the page.
3. Allow microphone access. On Windows 11, open Settings › Privacy & security › Microphone and turn on microphone access and access for desktop apps. On macOS, open System Settings › Privacy & Security › Microphone and allow your browser. Then check that the recorder is using the microphone you expect.
4. Allow screen recording on a Mac. Open System Settings › Privacy & Security › Screen & System Audio Recording, or Screen Recording on some macOS versions, and allow the browser. Quit and reopen the browser if macOS asks you to do so.
5. Check the microphone before retaking the demo. Speak at a normal volume and listen to a short test. Move closer to the microphone or select another input if your voice is too quiet. Close other calling or recording apps if they are using the microphone.
6. Reduce interruptions and slow down. Turn on Do Not Disturb, close unrelated tabs, and avoid moving the pointer quickly. If the page is slow, wait for it to finish loading before continuing instead of narrating over a long pause.

Make the clip useful as documentation

Start with the reader's goal, not a tour of every feature. For example, say, “This shows how to export a report,” then demonstrate only the steps needed to do that. Keep example names and data generic, and do not show passwords, customer details, private messages, or account information.

Use a consistent pace. Leave a short pause after clicking a control so readers can see the result. If a label or result is important, move the pointer near it without covering it. Avoid relying on color alone to explain what changed, since viewers may watch on screens with different color settings.

Before adding the clip to a knowledge base, watch it once at normal speed. Confirm that the first and last moments are intentional, the narration is audible, and no notification or private information slipped into view. Give the file a descriptive name that matches the task, so readers and editors can find it later.

The Screen Recorder runs in your browser, and recordings stay on your device. Nothing you record is uploaded.