Can I pair participants with other random participants? (More inside)

I'm looking to build an application which requires a user to grant access to their webcam in order to listen to a song. The catch? Users will be able to randomly view other individuals listening in real time. Unlike a chat roulette experience, it is not important that two individuals see each other but rather that each user see a random individual (and are seen by a random individual.)

My first thought was to place users in 50 participant video chats and build a UI which randomly showed one of those participants to the user. And just spin up as many of these 50 participant chats necessary to meet demand.

Is there another way I can meet the core goal of my concept? Allowing users to randomly see other individual users and be seen by other users?

Best Answer

  • dtoomey
    dtoomey admin
    Answer ✓

    If you are ok with just matching each participant with someone else in the same Room, then you can have 50 participants in the same Room and each participant can just turn on a video track corresponding to another participant in that Room. By default each participant subscribes to the published tracks of all other participants, however by using the track switch off control feature of the 2.14+ version of the JavaScript SDK you can switch off the video tracks you are not interested in. You simply attach the video track you are interested in to a video element and that is the one that will be sent by the media server. More details are available here.


  • leemartin
    leemartin ✭✭✭

    Cheers @dtoomey. Thanks for the insight. I'll build out a demo of this and see how it performs. 🙏🏻

  • @leemartin we would love to see what you've been when your finished. Feel free to reach out to me and I can highlight it on forums if you wish to do so. ✨

  • leemartin
    leemartin ✭✭✭

    LOVING the track switching functionality. Tell me, is there a way to have all remote tracks switched off by default? Or should I be handling this at the subscription level? Thank you so much for the insight.

  • Thanks to the tip from @dtoomey I was able to develop and launch our unique Twilio Video experience here:

    It is a web app that allows you to hear a new song from Underoath, if you allow others to watch you, while you watch others.

    All participant tracks are switched off by default using the switchOff() method. I then manage my own local variable called currentParticipant which is the remote participant I wish to see. When a currentParticipant is set, I simply use the switchOn() method to make their video visible.

    That's the short version. 😅 The long version is a bit more complicated. We're actually mixing together the user's local video, all participant remote videos, and some pre-recorded videos, as options for currentParticipant. In addition, instead of serving the <video> tags directly, the currently active video is being visualized through a THREE.JS <canvas> so we can give it a fisheye and distortion effect. If you look closely, all of the videos are actually 1 pixel dots in the top left corner of the screen. 🤫 I had a few more bells and whistles to add but that will have to wait for the next project.

    It was truly a joy building with Twilio Video again. The way the product has evolved since the last time I used it, is inspiring. Thanks for the help!

If this is an emergency, please contact Twilio Support. This is not an official Support channel.
Have an urgent question?
Please contact Twilio Support. This is not an official Support channel.
Contact Support