To overview
Sporting events are full of fun and interesting interactions. You're there, of course, to see and support your favorite club or athlete, whether it's a soccer match, a motorsport race, or a basketball game. In addition, there are often enjoyable side events that enrich the experience. One of these is the well-known fancam, where visitors are shown on a large screen via cameras around the field. We have come up with a new variation on this. Read about our FanCam tooling and how it works in this blog.
What Does the FanCam Do?
The FanCam puts the biggest fans of an event in the spotlight. Imagine a soccer match during halftime. You're waiting for the second half. This quarter-hour offers extra interaction with other visitors in the stadium. The FanCam then displays a QR code on a large LED screen in the stadium. People who scan this code share their camera and wait to see if they appear on the big screen. In the stadium's control room, a number of people are selected to appear live on the screen. Confirmation follows and the chosen videos play for everyone on the big screen. Some see their own video live!
The Technical Challenge
The FanCam faces challenges during development. For instance, how do you manage 10,000 video streams and select a few for the stadium screens, especially when the internet connection is suboptimal due to the crowd?
The FanCam environment consists of three parts:
SFU Mediaserver - This server distributes media files to the front-end applications. Using a Mediasoup module in Node.js, we distribute media feeds quickly and efficiently. Mediasoup, based on WebRTC, enables real-time communication through browsers and apps without extra plugins. Users can video chat, call, share files, and live stream with a WebRTC-compatible browser like Chrome, Firefox, or Safari. This setup ensures communication with all connected phones. To prevent issues with too many connections, people are first put in a queue, from which 16 are selected to connect to the server. Their video feeds go to the admin panel and then to the stadium screens.
Administrator front-end - This front-end allows the administrator to control which videos appear on the big screen. The admin sees 16 streams and selects one or several to show. This way, the administrator filters and places interesting feeds in the queue.
Screen publication front-end - This is the final step - publishing video feeds from stadium visitors. There's a special front-end environment for connecting to various media outputs. Here, visitors enjoy the interaction that the FanCam offers.
Good Combination with Event
Unlike the traditional fixed-camera setup of the kiss-cam, which selects from attendees nearby, the FanCam technology allows individual participants to submit their own media. This approach increases the scale of interaction and the chance for a personal experience. The result is increased audience engagement and a dynamic element during natural breaks in the program.
The technical challenges, such as managing thousands of potential video streams in a limited bandwidth environment, are non-trivial. The success of the FanCam rests on robust technical solutions that ensure smooth and continuous operation, even under the demanding conditions of live events.
Conclusion
FanCam expands the traditional interactive experiences known from the kiss-cam with a more inclusive and technologically advanced approach. It represents an innovative step in the evolution of public engagement at live events, where the use of real-time media exchange adds a new dimension to the visitor experience. The integration of FanCam at events promises to enrich both the participant and the organizer, embodying the next generation of public interaction in the digital age.
So, the next time you're at an event and see the FanCam, join in! You might just become the star of the show, even if only for a moment.
