Quick link to it: http://calibermengsk.com/streamtool...om/streamtools/oddwebcam/heroesofthestorm.png
Hello all. I have been slightly tired of just having a square webcam. And while it's kind of spiffy to just use an overlay, the webcam itself is still square, so you have to have something covering the corners and such. Quite the pain. So, I made a little thing using just a basic webpage (html5 and javascript) to make a chroma key capable webcam feed.
It's pretty simple, just a lime green background of a webpage (#00ff00) a webcam feed, and an overlay image that covers the webcam. Using a PNG or GIF, you make an image that uses the same lime green to block out the parts you don't want to see, and add it to the url instead of the default one.
Here is an example (and the one linked later here):
The white bit is actually just alpha transparent, and the green blocks out stuff. Just do a window capture of the webpage, and keep it on top of stuff, and you have a spiffy webcam that's got cut edges, so you can fit it much more nicely into your overlays.
You can also just use the lime green to make a full mask, and add an image overlay in obs. Because it's keying out the green, you can't have spiffies like drop shadows just from the mask, but you can do a full mask without images and use an alpha png to do the extra effects.
Anyway, onto the meat of the meal, here's an example url to use it.
http://calibermengsk.com/streamtool...om/streamtools/oddwebcam/heroesofthestorm.png
There are 3 modifiers at this point, Width, Height and Image. Just replace the width/height to what you want the image and webcam to be at, and the image is a url to the image you'd like to use. I'll keep the one there up for anyone to use, but you'll have to host custom ones on your own site. I'll probably make a simplified webpage rather then force you to edit the url manually, but for now, this works.
Let me know what you think about it, and if you have any suggestions, please let me know.
**NOTE: After you make the version you want to use, I suggest making a bookmark of it, so you don't have to keep it in memory and such. ALSO, some quick numbers for if you are using chrome. Selecting a sub region, simply enter 5 for the x position, 101 for the y position, and whatever you have the width and height set for in the url for the width and height.
**NOTE 2: Yes, this would be much more useful if CLRBrowser worked with it, but as I can't figure out a way to enable the webcam in CLRBrowser, you'll have to put up with just a webpage screen capture.
Hello all. I have been slightly tired of just having a square webcam. And while it's kind of spiffy to just use an overlay, the webcam itself is still square, so you have to have something covering the corners and such. Quite the pain. So, I made a little thing using just a basic webpage (html5 and javascript) to make a chroma key capable webcam feed.
It's pretty simple, just a lime green background of a webpage (#00ff00) a webcam feed, and an overlay image that covers the webcam. Using a PNG or GIF, you make an image that uses the same lime green to block out the parts you don't want to see, and add it to the url instead of the default one.
Here is an example (and the one linked later here):
The white bit is actually just alpha transparent, and the green blocks out stuff. Just do a window capture of the webpage, and keep it on top of stuff, and you have a spiffy webcam that's got cut edges, so you can fit it much more nicely into your overlays.
You can also just use the lime green to make a full mask, and add an image overlay in obs. Because it's keying out the green, you can't have spiffies like drop shadows just from the mask, but you can do a full mask without images and use an alpha png to do the extra effects.
Anyway, onto the meat of the meal, here's an example url to use it.
http://calibermengsk.com/streamtool...om/streamtools/oddwebcam/heroesofthestorm.png
There are 3 modifiers at this point, Width, Height and Image. Just replace the width/height to what you want the image and webcam to be at, and the image is a url to the image you'd like to use. I'll keep the one there up for anyone to use, but you'll have to host custom ones on your own site. I'll probably make a simplified webpage rather then force you to edit the url manually, but for now, this works.
Let me know what you think about it, and if you have any suggestions, please let me know.
**NOTE: After you make the version you want to use, I suggest making a bookmark of it, so you don't have to keep it in memory and such. ALSO, some quick numbers for if you are using chrome. Selecting a sub region, simply enter 5 for the x position, 101 for the y position, and whatever you have the width and height set for in the url for the width and height.
**NOTE 2: Yes, this would be much more useful if CLRBrowser worked with it, but as I can't figure out a way to enable the webcam in CLRBrowser, you'll have to put up with just a webpage screen capture.