Anleitung zum KI-Overlay-Builder – Social Stream Ninja

Was es ist

Der KI-Overlay-Builder erstellt HTML-Overlays anhand einer Beschreibung. Er selbst ist nicht die Seite für OBS. Verwende aiprompt.html zum Erstellen und Prüfen und anschließend aioverlay.html für die Ausgabeseite.

KI-Overlay-Builder mit Eingabefeld, Vorschausteuerung, Event-Simulation, Speicherfunktionen und HTML-Quelltext-Tab — Prüfe die Vorschau und simuliere Events, bevor du das Overlay in OBS einsetzt.

1. Auf der Prompt-Seite erstellen

Öffnen aiprompt.html?session=YOUR_SESSION.
Beschreibe, was das Overlay tun und wie es aussehen soll.
Formuliere die Beschreibung gezielt: Layout, Nachrichtenverhalten, Farben, Animationszeiten und wichtige Eventtypen.
Nutze die Vorschausteuerung und simuliere Chat-, Follow-, Abo-, Geschenk-, Raid-, Spenden- und eigene JSON-Events.
Speichere das Overlay unter einem eindeutigen Seitennamen.

2. Die Ausgabeseite zu OBS hinzufügen

Füge die Ausgabeseite nach dem Speichern als OBS-Browserquelle hinzu. Verwende dieselbe Sitzung und denselben gespeicherten Seitennamen.

https://socialstream.ninja/aioverlay.html?session=YOUR_SESSION&overlay=chat-overlay

Wenn das Overlay transparent ist oder nur bei Events erscheint, verwende zuerst die Simulationsschaltflächen des Builders, um seine Anzeige zu prüfen.

3. Vorlagen für eine schnellere Einrichtung nutzen

Wenn du schnell etwas Zuverlässiges brauchst, beginne mit einer Vorlage und passe sie an. Nutze den KI-Builder für speziellere Ideen.

Beispielvorschau eines Social Stream Ninja-Overlays mit gestalteter Chatnachricht — Vorlagen eignen sich besser für bekannte Layouts; KI-Generierung für eigene Experimente.

Häufige Lösungen

Leere Vorschau: klicke auf eine Simulationsschaltfläche und prüfe den Konsolenbereich.
OBS bleibt leer: prüfe, ob gespeicherter Seitenname und Sitzung mit dem Builder übereinstimmen.
Falsches Verhalten bei Events: teste mit genau dem erwarteten Eventtyp, nicht nur mit normalem Chat.
Generierter Code funktioniert nicht: verwende Prüfen und verbessern (Review & polish) oder vereinfache die Beschreibung.
Overlay funktioniert im Builder, aber nicht in OBS: öffne dieselbe aioverlay.html URL zuerst in einem normalen Browser.