Resource icon

WebRTC-Telestrator 1.0

Go to download
Overview History Discussion
B

BlankSourceCode

Member
BlankSourceCode submitted a new resource:

WebRTC-Telestrator - Draw on an OBS source from a remote device with a live preview

A remote telestrator app using WebRTC. Use a remote device (such as a phone or tablet) to draw on your screen while recording/streaming via OBS. Rather than just having a blank 'greenscreen' to draw on, this app streams a specified display so that you can see exactly where you are drawing on your device.

Remember the days when sport commentators would draw arrows on the screen to help explain the plays? Well the term for the program that let them do that is called a 'telestrator'. This tool...
Click to expand...

Read more about this resource...
 
chi11estpanda

chi11estpanda

New Member
I've yet to to try this out but just wanted to say thank you for sharing this, it sounds like it will be totally awesome! It's everything I could ever hope for without having to buy a real telestrator for my explainer live streams! Although, I do need to buy a more powerful tablet, but hey, still better than a telestrator or using my drawing tablet that doesn't have a screen on it xD

Thank you!
 
M

Martyats

New Member
This is just what I was looking for! If only I could get it to fully work for me. (Windows 10 22H2, OBS 30.0.0, Firefox 120.0.1)
I can join and markup the hosted image from a second (wired) PC on my network (Yeah!)
I cannot join from a tablet or phone via WiFi (Address Not Found). They are all on the same network and port 8888 is not blocked in the router.

However, my OBS PC has a Wacom drawing tablet on one of the four video outputs on the NVidia Quadro graphics card, which I would like to use. Once Joined using a different browser I can see the toolbar but not the hosted window and I can't draw on it.
Can you not join from the same PC?
Also, What are the two buttons on the left of the toolbar with numbers?
 
B

BlankSourceCode

Member
My guess is that your phone/tablet is not able to connect to your OBS machine because there is some sort of partitioning between your wifi and your wired networks. Can you access anything else from that PC via Wi-Fi (file share/other local server/etc)? Are the phone/tablet on the same subnet as the pc?Perhaps you need to configure your router to use a virtual network. You could make sure that port 8888 is allowed through your OBS machines Windows firewall. Also you could try using the IP address instead of the hostname when connecting from the phone/tablet.

You should be able to connect on the same machine (I'm doing that in the example demo gif - but I also tested with an iPad and my android phone). You could try opening the browser devtools on the client browser and see if there are any errors logged to the console. Though if you are wanting to just use the same machine there are easier solutions that don't require you to use a browser to stream. You could try searching the forum for whiteboard scripts. Most work by allowing you to draw on an obs projected window rather than the browser.

Those number inputs are the offset and inset values for where you can draw on the video background. Some browsers and/or some setups mean that size and position of the video displayed on the browser don't line up with where the browser canvas element renders. These numbers allow you to move it around so that you are able to draw on the correct place. You should see a border appear around the video if you change them, you need to get it to line up correctly to have the drawing match the position on your OBS browser source. The buttons next to those are clear and undo.

Thanks for trying it, sorry it's not working for you. All the moving pieces does make it fairly complicated to setup.
 
maxfaction

maxfaction

New Member
I can't seem to follow the steps that are laid out, especially the 1st step to "run". Can someone please make a walk-through video of how to set this up from step #1 (and any needed pre-requisites)? Thank you.
 
You must log in or register to reply here.
Top