How to Write on Your Video Feed Live Using Free Software and Devices
Learn to annotate live on your video feed using free software like OBS and Microsoft Whiteboard. Perfect for Zoom, Google Meet, and more. No extra hardware needed!
File
Write over LIVE video with (iPadtabletPCMacLinux) on (ZoomTeamsMeet) for Online Teaching
Added on 10/02/2024
Speakers
add Add new speaker

Speaker 1: I'm gonna show you how you can write on top of your video feed live wirelessly, just like this using a tablet or iPad, a Mac or PC using free software. So you can do this in Zoom meetings or any other web conferencing app. And when I say free software, I mean 100% free. It's not like a free trial that you can only use for like seven days. This is gonna be a permanent workflow that you can use without having to buy any software. So the way this works is I'm using a free streaming program called OBS, and this takes my microphone and video input from my camera, as well as a screen capture of a cloud-based app called Microsoft Whiteboard. So that's live synced with my iPad, and OBS makes the background of the whiteboard transparent, allowing it to display only the ink on top of my video. And OBS takes all of that and outputs it as a virtual webcam, which I can then select as an input for Zoom, Google Meet, Microsoft Teams, or any other online meeting software. Or I can record a video file directly to the computer and edit it and upload later. So I think this is the easiest way to do this because you don't need to use any screen mirroring or special hardware to connect the iPad or tablet to the computer, and you don't even need to be on the same wifi network. The only drawback to this specific method is there is a slight lag in the brush strokes appearing on the screen. So they sort of appear one letter at a time instead of seeing the brush stroke in real time. So if that's a deal breaker for you, and you really want a low latency solution like this, you'll need to use a more complicated workflow, and it likely won't be free, but I'll share some additional options at the end of the video. So let's walk through step-by-step how to set this up. So first, you'll wanna add your video feed from your camera as a source in OBS. So click the plus sign here and click on Video Capture Device. Click OK and find your webcam. Now to draw on the screen, we're gonna use a whiteboard app called Microsoft Whiteboard. So you can find Microsoft Whiteboard on the Apple Store, Google Play Store, and on Windows. It's in the Microsoft Store. So once you install it and log in to each device, open up the same whiteboard on both devices and write something on the screen, and you'll notice that it shows up on both devices. So there's just a slight lag and each brush stroke only appears after it's drawn. Now, if you do have a grid visible on the background, make sure you have that disabled. So just go up to the gear icon right here, go to Format Background, and make sure this says Solid. And we can use a white background for the whiteboard. That works just fine. So to add the whiteboard to OBS, click on the plus sign and we're gonna click on Window Capture. So we'll call this the whiteboard. And we wanna find the whiteboard program in the window dropdown menu. And you might have to experiment with the different capture methods. I noticed I had to go to the Windows 10 capture method in order for it to show up properly. I'm gonna disable Capture Cursor on the PC just because that's not necessary and click OK. Now, one thing you wanna make sure is the order of your sources is accurate. So if you have the whiteboard behind the video, you're not gonna be able to see it. You actually want the whiteboard on top of the video. And the nice thing about using Window Capture is it'll work even if the window is in the background, which is really nice if you only have one monitor. So next we need to make the background transparent. So with the whiteboard source selected, we're gonna go ahead and click on Filters and click the plus sign and add a color key. Click OK. And in the Key Color Type dropdown menu, we'll select Custom Color, click Select Color, and we're gonna choose white since the background of the whiteboard is white. Now, you can play around with the similarity and smoothness sliders in order to fine tune the edges of the markers. Next, you'll need to crop out the edges of the whiteboard program window. And to make it easier to do this and to help you know where to draw on the whiteboard app, what we're gonna do is create a reference rectangle inside Microsoft Whiteboard. So open up Whiteboard, click the plus sign. We're gonna go to Shapes and click on a rectangle. We're gonna start this rectangle. The bottom right side doesn't matter at this point. We just need to make sure the top left side of this rectangle is going to clear any UI elements. And then we can go back to OBS. With the whiteboard source selected, we can drag the boundaries of that up so the top left corner is just outside of the frame. And then we can drag the red boundary of the whiteboard down. We just need to make sure that this is cleared out of frame. So we'll bring this down until that's out of frame. And then you might have to go back and forth a little bit just to kind of play around and get it exactly how you need it. And then you're just gonna jump back into Whiteboard and expand this out so it's just outside of the frame of OBS. So it takes a little bit of getting used to and adjusting it. So this is just gonna give us a reference so we know what to draw on or within in the whiteboard. And once you have that sized correctly, you can go ahead and change the background to transparent. And then if we go back to OBS, we now have eliminated all of the UI elements and we're left with just whatever we draw on the whiteboard. And that's it. So now you can use your iPad or tablet and draw on the screen and it'll synchronize with the whiteboard on the computer which gets picked up by OBS. All right, so here are a few additional tips for you. So if you wanna use this in a Zoom meeting, just click start virtual camera in OBS. Then in Zoom, click on the camera and choose OBS virtual camera. So it'll work the same way for other web conferencing software. You just need to make sure it shows like the full aspect ratio and it doesn't crop it because sometimes that can happen. Now, if you'd rather just record a video in OBS instead of streaming it live, you can just click the start recording button instead. Now, another thing you can do is have two scenes in OBS, one that shows the whiteboard and one without. Now, this is great if you wanna flip back and forth between showing your annotations or just your camera and it can give you the opportunity to write on your whiteboard privately and then reveal it all at once. Now, you'll also notice I added a semi-transparent color on top of the video source in order to make the annotations pop a little more. So to set this up, click on the default scene in the scenes panel and we're going to duplicate it. So right click duplicate. So we'll call this one camera and with the camera scene selected, we're gonna disable the whiteboard. So this is just going to show the camera and then this scene is going to show the camera and the whiteboard. And if you have a fade transition set over here, just by clicking the scenes, it'll fade in and out between those two scenes. And then to add a color overlay on the whiteboard scene, we're gonna click the plus button in the sources, select color source, click okay, and we'll select black and adjust the alpha up to 200. And now just toggling between these two scenes, we'll kind of dim the video and show your annotation. So now another option is to provide a dedicated space for your whiteboard. So in the whiteboard scene, so we'll rename this to whiteboard. And so I'll select my video capture and maybe move it over like this. And then if you hold down the alt key, you can crop a video. And then we can select the whiteboard and drag that over here maybe. And so now we have a dedicated space and then we just wanna actually bring the video on top to cover up the UI that was kind of out of frame. And so now let's say you go and change this to a slide transition from the right like this. And so now you have this situation. Now, finally, if you really want a real-time brushstroke output, you don't necessarily have to use Microsoft Whiteboard, but the setup is gonna depend on the specific devices you're using. But some ideas to help you out with this would be to either use a capture card like something from Elgato that would allow you to feed an HDMI output into your computer. And then you would just need to pick up a USB-C to HDMI cable to connect your iPad to your computer. Another option is to use a screen mirroring software like a Power Mirror to mirror your screen either wirelessly through Wi-Fi or by connecting via USB. Now, if you're not streaming live, you can also just record the screen directly on your iPad while recording your camera separately and then just overlay the two afterwards in your editing software. All right, I hope you found this video helpful. I'll have links below to everything I mentioned in this video. And if this is your first time on my channel, my name is Matt Donnelly and I create videos about the technology that I use in my online businesses to help you make money in your online business. So if that sounds good to you, make sure you like and subscribe. Thanks for watching and I'll see you in the next video.

ai AI Insights
Summary

Generate a brief summary highlighting the main points of the transcript.

Generate
Title

Generate a concise and relevant title for the transcript based on the main themes and content discussed.

Generate
Keywords

Identify and highlight the key words or phrases most relevant to the content of the transcript.

Generate
Enter your query
Sentiments

Analyze the emotional tone of the transcript to determine whether the sentiment is positive, negative, or neutral.

Generate
Quizzes

Create interactive quizzes based on the content of the transcript to test comprehension or engage users.

Generate
{{ secondsToHumanTime(time) }}
Back
Forward
{{ Math.round(speed * 100) / 100 }}x
{{ secondsToHumanTime(duration) }}
close
New speaker
Add speaker
close
Edit speaker
Save changes
close
Share Transcript