RiftBroadcast
Broadcast-Tools für Esports-Übertragungen
RiftBroadcast ist eine Sammlung von Werkzeugen für Live-Übertragungen von League of Legends und anderen Esports-Events: Overlays, Timer, Team- und Match-Verwaltung, Champion Select und mehr, eingebunden in OBS Studio.
Technologien
- React
- Next.js
- TypeScript
- WebSocket
- OBS-Integration
- Echtzeit-APIs
- OCR
- Stream Deck API
Überblick
RiftBroadcast bündelt die Werkzeuge, die für eine Esports-Übertragung gebraucht werden, an einem Ort. Die einzelnen Tools lassen sich in bestehende Produktionsabläufe einbinden und werden als Browser-Quellen in OBS Studio angezeigt.
Der Funktionsumfang reicht von einfachen Text-Overlays bis zu einer vollständigen Champion-Select-Ansicht und ist auf League-of-Legends-Übertragungen ausgerichtet.
Overlays und Anzeigen
Badge-Overlays: Text-Overlays mit frei wählbarer Position, um während der Übertragung Informationen einzublenden.
Broadcast-Timer: Countdowns für Pausen, Segmente und Events, mit Start, Pause und Reset.
Fearless Champions: Champion-Lineups als rotierende Gruppen oder in einer Gesamtansicht.
Team- und Match-Verwaltung
Team-Verwaltung: Teams anlegen, Spieler zuordnen und den Spielstand live pflegen.
Champion Select: Live-Ansicht der Champion-Auswahl mit Picks, Bans und Timern.
Objective-Videos: Video-Overlays für OBS, sobald ein Objective erscheint, für alle Drachenarten sowie Baron, Herald und Grubs.
Content- und Medien-Tools
Clip-Verwaltung: Clips von Twitch und YouTube mit einstellbarem Start und Dauer, etwa für Highlights und Replays.
Image Creator: Eigene Grafiken für Overlays, Thumbnails und Ankündigungen gestalten.
OCR: Texterkennung in YouTube-Livestreams, um Informationen in Echtzeit aus dem Bild auszulesen.
Bracket-Manager: Turnierbäume anlegen, verwalten und direkt in der Übertragung anzeigen.
Video-Assets für Objectives
Für das Objective-Tool gibt es eigene Videos zu allen wichtigen Ereignissen auf der Karte:
Drachen: Infernal, Mountain, Ocean, Cloud, Chemtech, Hextech und Elder Dragon
Weitere Objectives: Baron Nashor, Herald, Grubs sowie Atakan-Spawn oben und unten
Die Videos sind für Streaming-Plattformen aufbereitet und lassen sich über das Objective-Tool direkt in der Übertragung abspielen.
Zusammenarbeit im Team
Mehrere Benutzer: Weitere Personen lassen sich in die eigene Organisation einladen, etwa das gesamte Produktionsteam.
Rollen und Rechte: Admin- und Benutzerrollen mit gesicherter Anmeldung.
Show-Tokens: Tokens für die Einbindung in OBS; mehrere Anzeigen können dasselbe Token verwenden.
Synchronisation in Echtzeit: Änderungen an Timern, Teams oder Overlays sind sofort bei allen Teammitgliedern sichtbar.
OBS-Integration
Die Tools werden über Browser-Quellen mit Token-Authentifizierung in OBS Studio eingebunden:
- Live-Aktualisierung: Änderungen erscheinen ohne Neuladen in allen Overlays
- Token-basierte Absicherung: Jede Anzeige authentifiziert sich über ein Token
- Stream Deck API: Steuerung über ein Elgato Stream Deck mit eigenen Tasten
Technische Umsetzung
- WebSockets für die Kommunikation in Echtzeit
- OCR zum automatischen Auslesen von Daten aus Streams
- Anbindung an Twitch, YouTube und OBS Studio
- Responsives Layout für unterschiedliche Bildschirmgrößen
- Token-Authentifizierung für die Zusammenarbeit im Team
Ziel war, dass die Tools im Produktionsalltag zuverlässig laufen und gleichzeitig ohne lange Einarbeitung bedienbar sind.