OBS Studio Integration
Information
Dieser Leitfaden zeigt dir Schritt für Schritt, wie du gettickr.app Countdown-Timer zu deinem OBS Studio Setup hinzufügst – von der Grundkonfiguration bis zu fortgeschrittenen Streaming-Workflows.
Voraussetzungen
Bevor du startest, stelle sicher, dass du Folgendes hast:
| Voraussetzung | Details |
|---|---|
| OBS Studio | Version 28.0 oder höher empfohlen (Download) |
| gettickr.app Timer | Auf gettickr.app erstellt und angepasst |
| Timer-URL | Die Anzeige-/Renderer-URL deines Timers |
| Internetverbindung | Erforderlich, damit die Browserquelle den Timer laden kann |
Schritt-für-Schritt-Anleitung
Schritt 1: Timer erstellen und URL kopieren
Zuerst musst du deinen Timer erstellen und die Anzeige-URL erhalten:
- Gehe zum Editor
- Erstelle und gestalte deinen Timer (Design, Dauer, Farben)
- Im Renderer-Bereich findest du die Anzeige-URL deines Timers
- Kopiere die vollständige URL, z.B.:
https://gettickr.app/r/#DEIN-TIMER-ID
Tip
Schritt 2: Browserquelle in OBS hinzufügen
Jetzt fügst du den Timer zu deiner OBS-Szene hinzu:
- Öffne OBS Studio und wähle die Szene, in der der Timer erscheinen soll
- Im Quellen-Panel auf das „+“ klicken
- „Browser“ aus der Quellenauswahl wählen
- Der Quelle einen aussagekräftigen Namen geben (z.B. „Countdown Timer“ oder „Pausen-Timer“)
- OK klicken
Information
Schritt 3: Browserquelle konfigurieren
In den Eigenschaften der Browserquelle folgende Einstellungen vornehmen:
| Einstellung | Wert | Hinweise |
|---|---|---|
| URL | https://gettickr.app/r/#DEIN-TIMER-ID | Mit deiner tatsächlichen Timer-URL ersetzen |
| Breite | 1920 | Entspricht der Designbreite deines Timers |
| Höhe | 1080 | Entspricht der Designhöhe deines Timers |
| FPS | 30 | Für flüssige Countdown-Animation ausreichend |
| CSS | Leer lassen | Nicht nötig für gettickr.app Timer |
| Quelle bei Nichtanzeige herunterfahren | ✅ Empfohlen | Spart Ressourcen |
| Browser aktualisieren, wenn Szene aktiv | ✅ Empfohlen | Stellt sicher, dass der Timer aktuell ist |
| Audio über OBS steuern | ⬜ Deaktiviert | Timer geben keinen Ton aus |
Tip
Mit OK die Browserquelle erstellen.
Schritt 4: Timer positionieren und skalieren
Der Timer erscheint nun in der OBS-Vorschau. So positionierst und skalierst du ihn:
- Verschieben: Timer anklicken und an die gewünschte Position ziehen
- Größe ändern: Ecken ziehen, um die Größe anzupassen
- Proportional skalieren: Beim Ziehen Shift gedrückt halten
- Ausrichten: Rechtsklick → Transformieren für weitere Optionen
- Sperren: Rechtsklick → Sperren, um versehentliches Verschieben zu verhindern
| Transform-Option | Shortcut | Anwendungsfall |
|---|---|---|
| Transformieren | Strg+E | Präzise Positionierung |
| Transform zurücksetzen | – | Ursprungsgröße wiederherstellen |
| Zentrieren | – | Schnelles Zentrieren |
| Auf Bildschirm strecken | – | Timer im Vollbild anzeigen |
Warning
Szenen-Setup-Ideen für OBS
| Szenentyp | Timer-Position | Typische Größe | Anwendungsfall |
|---|---|---|---|
| Starting Soon | Mitte, Vollbild | 1920×1080 | Pre-Stream-Countdown |
| BRB / Pause | Mitte oder oben | 800×400 | Stream-Pausen |
| Gaming Overlay | Oben rechts | 300×150 | Event-Countdown im Gameplay |
| Subathon | Obere Leiste | 1920×100 | Spenden-/Abo-Timer |
| Turnier | Unteres Drittel | 1920×200 | Match-/Runden-Timer |
| Giveaway | Seitenleiste | 400×600 | Gewinnspiel-Zeitraum |
Tip
Premium-Funktionen in OBS
Fernsteuerung während des Streams
Mit einem Premium-Account kannst du deinen Timer während des Streams steuern, ohne OBS zu berühren:
Setup:
- Öffne den Editor in einem separaten Browser-Tab oder auf einem zweiten Monitor
- Lade deinen gespeicherten Premium-Timer
- Lasse den Editor während des Streams geöffnet
Steuerung:
- Starten des Timers zu Beginn des Streams
- Pausieren, falls du eine Pause verlängern möchtest
- Zurücksetzen für einen neuen Countdown
- Dauer spontan anpassen
- Design live ändern, ohne den Stream zu verlassen
Premium Feature
| Funktion | Free Timer | Premium Timer |
|---|---|---|
| In OBS einbinden | ✅ Ja | ✅ Ja |
| Fernsteuerung während des Streams | ❌ Nein | ✅ Ja |
| Stabile URL nach Bearbeitung | ❌ URL ändert | ✅ URL bleibt |
| State-Persistenz | ❌ Reset | ✅ Speichert Stand |
| Mehrere gespeicherte Timer | ❌ Nein | ✅ Ja |
Häufige Probleme & Lösungen
Timer wird nicht angezeigt
| Problem | Lösung |
|---|---|
| Schwarzer Bildschirm in OBS | Prüfe, ob die URL korrekt ist und mit https://gettickr.app/r/# beginnt |
| „Lokale Datei“ aktiviert | Deaktiviere „Lokale Datei“ – es wird eine Web-URL benötigt |
| Keine Internetverbindung | Netzwerkverbindung prüfen |
| Browserquelle zu klein | Breite/Höhe in den Eigenschaften erhöhen |
| Timer hinter anderen Quellen | Rechtsklick → Reihenfolge → Nach oben |
Timer aktualisiert sich nicht / synchronisiert nicht
| Problem | Ursache | Lösung |
|---|---|---|
| Free Timer: Änderungen erscheinen nicht | URL hat sich geändert | Neue URL kopieren und in OBS aktualisieren |
| Premium Timer: Fernsteuerung funktioniert nicht | Editor-Tab geschlossen | Editor-Tab während des Streams geöffnet lassen |
| Timer eingefroren | Browserquelle pausiert | Rechtsklick → Aktualisieren |
| Alter Timer wird angezeigt | Cache | „Browser aktualisieren, wenn Szene aktiv“ aktivieren |
Warning
Performance-Probleme
| Symptom | Ursache | Lösung |
|---|---|---|
| OBS ruckelt mit Timer | Zu hohe Auflösung | Angemessene Maße verwenden (max. 1920×1080) |
| Hohe CPU-Auslastung | Viele Browserquellen | „Quelle bei Nichtanzeige herunterfahren“ aktivieren |
| Ruckelige Animation | FPS zu niedrig | FPS der Browserquelle auf 30 setzen |
| Stream-Encoding-Lag | Zu viele Quellen | Nicht benötigte Timerquellen deaktivieren |
Tip
Nächste Schritte
- Design anpassen – Passe deinen Timer optisch an deinen Stream an
- Fernsteuerung – Mehr zu Premium-Features
- Streamlabs Integration – Alternative Streaming-Software