fan face-off

Two fanbases, one building — who's louder?
A live sentiment duel: every fan taps to back their team, and the two meters swell and shrink against each other in real time. An automated commentary feed calls the game — goals, fights, big saves — and the whole crowd reacts. Chat runs right down the middle.
Bruins gold Leafs blue ~18,000 fans simulated
BOS2 LIVE 2nd · 11:04 1TOR
presented by
BOS
TOR
BOS cheer tug-of-war TOR
Tap (or mash) your team's Cheer button to push your meter up — the leader fills to the top and the other shrinks to its share. Tap the speaker for crowd sound.
📊

Dual cheer meters

Two-axis tug-of-war — the leading side grows taller and wider, the other shrinks.

📢

Automated commentary

A match engine calls goals, penalties, big saves and fights into the chat feed.

💬

Live section chat

Seat-tagged banter down the middle, with the crowd reacting to every event.

⚡

Sponsored moments

Banner space and brandable beats — e.g. a power play "presented by."

Build it yourself

Face-Off with the SportsTalk SDK

Joining the game’s chat room and subscribing to its live event stream is just a few lines — one handler delivers every fan message and automated match call. Cheers are simply telemetry increments that drive the meters.

import { ChatClient, Services } from 'sportstalk-sdk';

const config = { appId: 'YOUR_APP_ID', apiToken: 'YOUR_API_KEY' };
const game   = 'game:bruins-leafs';   // chat room + telemetry context

// Join the room and subscribe — one handler gets every message and match call
const chat = ChatClient.init(config, {
  onChatEvent: (event) => addToFeed(event)
});
await chat.joinRoom(game);
chat.startListeningToEventUpdates();

// Each Cheer tap is just one telemetry increment that feeds the meters
const telemetry = new Services.TelemetryService(config);
cheerBtn.onclick = () => telemetry.increment(game, 'cheer:home', { userid: 'fan-8417' });

npm sportstalk-sdk · ChatClient.joinRoom + startListeningToEventUpdates · same idea on web, mobile, or server.