Webcam Avatars

[robertlong]

You can now share your webcam to your avatar! On supported avatars, a "Avatar Camera" button will appear in the Share menu. Click it to use your webcam with your avatar.

Avatar creators can add this functionality to their own avatars by adding the webcam-texture-target component to the material they want to set the webcam to. This will swap out the base color map with a video texture. The other maps and base color factor will still be applied, making it possible to better integrate the webcam into your avatar.

To Do:

• Finish featured webcam avatars
• Add webcam-texture-target instructions to docs
• Add screenshot to PR and tag with whats-new
• Investigate additional bandwidth requirements from increased webcam usage

[netpro2k]

Mostly lgtm. Main thing I think we need to resolve is it looks like we are not using the actual material the component is on to decide what material to render the video on. We should either take that into account or just make this a component you add to a mesh instead of a material.

[johnshaughnessy]

lgtm - I couldn't tell just by eyeballing it whether it was resilient to having people change their avatars. (I'm guessing that if you change to an avatar that has a webcam-texture-target, your client should either keep streaming or re-stream your video and if it does not have a webcam-texture-target, streaming should end.)

[robertlong]

(I'm guessing that if you change to an avatar that has a webcam-texture-target, your client should either keep streaming or re-stream your video and if it does not have a webcam-texture-target, streaming should end.)

It ends the stream and you need to restart the stream if you change from one avatar to another with the webcam-texture-target component. I think this is acceptable UX and it simplifies the code a little bit.

[robertlong]

I've gone over most of the PR feedback. Thank you both for the reviews! @netpro2k and I discussed revisiting material components as a concept when we move to @takahirox's GLTFLoader plugin system. Right now it doesn't make too much sense to inflate a component that is attached to an entity for every usage of a material. Especially if that material is used more than once. We'll probably want a system to handle the single material instance in that case.

Also this component is pretty close to what is needed for streaming to multiple screens in a scene or this Spoke issue Hubs-Foundation/Spoke#1099

I fixed all of the issues

[robertlong]

Pushing this out so we can test a little easier. Look out for the featured webcam avatars soon 👀

[yajo]

How can this feature be tested? 😻

[astrojuanlu]

I'd love to give this a spin as well :) Too bad there are no screenshots here!

[johnshaughnessy]

@astrojuanlu @yajo This feature is already live. Here are some example avatars using webcams surfaces:
https://hubs.mozilla.com/avatars/RATQPDA
https://hubs.mozilla.com/avatars/2BtycVC

[yajo]

[TheBricktop]

@astrojuanlu @yajo This feature is already live. Here are some example avatars using webcams surfaces:
https://hubs.mozilla.com/avatars/RATQPDA
https://hubs.mozilla.com/avatars/2BtycVC
Can You share a source of this avatars? (blend maybe?)

[hbaileylxd]

@robertlong etc...

Hello! This is so great and we want to use it for our Christmas party, but when i try this my webcam "on" light lights up, but I get a red dot above my camera share button and my friends cannot see my video, even though i have chosen Webcam astronaut or Webcam Hologram. Have checked, and my browser, Chrome, is set to allow the site access to my camera ok. Also we can share video using the "camera" option but the whole reason to use this is to have the video in your avatar. Any ideas?

Many thanks!
Helen