Skip to main content

OBS Studio Integration

Integrate StreamSlate into your OBS Studio scenes as a browser source for dynamic, real-time PDF annotations.

1. Launch StreamSlate

First, ensure StreamSlate is running on your computer and you have a PDF loaded. StreamSlate will generate a unique local URL for the presenter view.

http://localhost:8080/presenter/your-unique-id

Copy this URL. This is what OBS will use to display your annotations.

2. Add Browser Source in OBS

In OBS Studio, navigate to the "Sources" dock and click the + icon. Select "Browser" from the list of available sources.

Add Browser Source in OBS

Name your new source (e.g., "StreamSlate Annotations") and click "OK".

3. Configure Browser Source

In the Browser Source properties window:

  • Paste the StreamSlate presenter URL into the "URL" field.
  • Set the "Width" and "Height" to match your OBS canvas resolution (e.g., 1920x1080).
  • Crucially, check the box for "Shutdown source when not active" and "Refresh browser when scene becomes active". This ensures optimal performance and prevents issues.
  • For transparent backgrounds, ensure the "Refresh browser when scene becomes active" is checked. StreamSlate's presenter view is designed to be transparent.
OBS Browser Source Properties

Click "OK" to save your settings.

4. Position and Scale

Your StreamSlate browser source will now appear in your OBS scene. You can position, resize, and crop it like any other source to fit your desired layout.

Ensure the source is placed above any game capture or webcam sources if you want the annotations to appear on top.

Troubleshooting & Tips

  • Blank Screen: Double-check the URL. Ensure StreamSlate is running and the PDF is loaded.
  • Performance Issues: If you experience lag, try increasing the "FPS" setting in OBS for the browser source, or ensure your StreamSlate application isn't consuming too many resources.
  • Transparency: StreamSlate's presenter view is designed to be transparent. If you see a black background, ensure the "Shutdown source when not active" and "Refresh browser when scene becomes active" options are checked, and try refreshing the browser source.
  • Interactions: To interact with the PDF (e.g., change pages, draw), you must do so directly within the StreamSlate application. The OBS browser source is a view-only output.