// SCREEN + FACE CAM OVERLAY · ONE FILE · NO INSTALL
The most effective tutorial and presentation videos combine screen content with the presenter's face. Seeing a person explain something while showing their screen creates a connection that pure screen recordings lack. This tool captures both simultaneously: your screen fills the frame, and your webcam feed appears as a rounded overlay in the bottom-right corner. Both video sources are composited in real time using a canvas element, producing a single WebM file with everything baked in.
The audio side works the same way. Your microphone captures your narration, and if the screen source includes audio (like a browser tab playing a video), both are mixed via the Web Audio API. The result is a complete, self-contained video file with screen content, your face, and your voice, all synchronized. No editing, no post-production, no server upload. Record, stop, download.
Step 1: Click "Start Screen + Webcam." Your browser first asks you to select what to share (screen, window, or tab), then requests webcam and microphone access. Both streams start simultaneously.
Step 2: A hidden canvas element composites the two video feeds in real time. Your screen capture fills the full canvas, and the webcam feed is drawn as a smaller overlay in the bottom-right corner with rounded edges. The canvas renders at 30 frames per second.
Step 3: The composited canvas stream is combined with the mixed audio track and fed into a MediaRecorder. This produces a single output stream that contains everything: screen video, webcam overlay, mic audio, and optionally tab audio.
Step 4: When you stop, the recorded chunks are assembled into a WebM file. The preview player shows the combined result. Download it and you have a ready-to-share tutorial or presentation video with your face embedded.
Software tutorials gain credibility when viewers can see the instructor. A face in the corner creates trust and makes the content feel more personal than a disembodied voiceover. This is especially important for educational content, where engagement directly affects comprehension.
Product demos shown to clients or investors benefit from the presenter being visible. Facial expressions, eye contact, and gestures add a persuasive dimension that slides and screen recordings alone cannot deliver.
Asynchronous stand-up updates for remote teams. Instead of typing a long status update in Slack, record your screen showing your progress while your face adds the human context that text messages lack.
Loom offers screen + webcam recording but requires an account, uploads your video to their servers, and limits free plans. OBS is free but requires installation, configuration, and a learning curve. This tool sits in between: zero setup, zero upload, zero account, with the specific feature (screen + webcam composite) that you need.
The webcam overlay is composited directly on the canvas, so the output is a single video file. There is no separate webcam track to align in a video editor. What you record is what you get, ready to share immediately.