Hello!

I have made some streaming overlays that I also do not mind the public using (if you want to):

To configure the overlays, use the settings panel I made for the suite.

Where to find me

Bluesky @theblackparrot.me
Twitch theblackparrot
Telegram @theblackparrot
Discord @theblackparrot
GitHub TheBlackParrot
Ko-fi septilateral

Information / How To Use

Settings / Configuration Panel

All of my overlays use a single panel for settings/configuration. Most of the overlays require it in order to function.

To use the settings panel:

  1. Open OBS's browser dock menu by navigating to Docks > Custom Browser Docks in OBS's top menu bar.
  2. In the lowermost blank item in the list, in the first column, name your new browser dock whatever you like. In the second column, copy this link into that URL field.
  3. Click the Apply button, and a new OBS-linked browser window should pop up. You can drag this around wherever you want, or you can place it into a highlighted side of OBS while dragging it around.

Beat Saber Overlay

This overlay shows data on the Beat Saber map currently being played, along with general game stats.

To use the overlay:

  1. Add a browser source to your scene.
  2. Copy this link into the URL field, and set your width/height/FPS settings. Make sure you leave the Custom CSS field as the set default!
  3. Set up the settings panel. A new option should appear in the left sidebar pertaining to the system.
  4. Launch Beat Saber and play a map or watch a replay, items on the overlay should become visible. (I'll add a debug option soon, sorry)

Beat Saber VOD Audio System

This overlay reads from Beat Saber Plus's "Song Overlay" module to determine what map is currently being played, then checks the map hash against a database (set by the streamer, and optionally, me) of map hashes, sorted by whether or not the map's audio is safe for VOD content on Twitch. It also effectively functions as a VOD mute/unmute button.

To use the overlay:

  1. Open OBS's browser dock menu by navigating to Docks > Custom Browser Docks in OBS's top menu bar.
  2. In the lowermost blank item in the list, in the first column, name your new browser dock whatever you like. In the second column, copy this link into that URL field.
  3. Click the Apply button, and a new OBS-linked browser window should pop up. You can drag this around wherever you want, or you can place it into a highlighted side of OBS while dragging it around.
  4. Set up the settings panel. A new option should appear in the left sidebar pertaining to the system.

PLEASE NOTE: Always do your own research when it comes to this stuff. I provide my own list of hashes as a default database to sync from in the settings panel. I can get things wrong, none of that list is automated. If you use only that list and something gets muted, please let me know ASAP and I will try to fix it as soon as possible.

Clock

This is an overlay that can show your current system time (along with your timezone, optionally), your Twitch stream uptime, and (for affiliates and partners only) how much time remains until your next ad break.

To use the overlay:

  1. Add a browser source to your scene.
  2. Copy this link into the URL field, and set your width/height/FPS settings. Make sure you leave the Custom CSS field as the set default!
  3. Set up the settings panel. A new option should appear in the left sidebar pertaining to the clock overlay.

Spotify Now Playing

This shows what song is currently playing from the most recently active Spotify instance.

To use the overlay:

  1. In your web browser, navigate to your Spotify Developer Console.
  2. Click the Create App button in the top right of the page, and fill in the information fields (not all of them are required). Set the Redirect URI to https://theblackparrot.me/overlays/chat/settings/
  3. After creating the new app, you will be navigated to a dashboard for statistics concerning it. Click the Settings button at the top.
  4. Set up the settings panel.
  5. Copy the Client ID field into the Spotify app client ID field in the settings panel.
  6. Click the green Connect to Spotify button beside the Client ID field. You will be redirected to a dialog page asking to authorize access to a couple of things in your Spotify account.
  7. Add a browser source to your scene.
  8. Copy this link into the URL field, and set your width/height/FPS settings. Make sure you leave the Custom CSS field as the set default!

Twitch Chat

This shows live Twitch chat for any given streamer, and includes support for various third-party emote services.

To use the overlay:

  1. In your web browser, navigate to your Twitch Developer Console.
  2. Press the Register Your Application button, give it a name, set the OAuth Redirect URL to https://theblackparrot.me/overlays/chat/settings/, and set the category to Chat Bot. Then, click the Create button.
  3. Set up the settings panel.
  4. In your list of Developer Applications, click the Manage button on the application you just registered and copy the text from the Client ID field into the App client ID field on the settings panel. Click the New Secret button, and also do the same for the App client secret field in the settings panel.
  5. Manually authorizing access to the extra mentioned data scopes by pressing the Connect to Twitch button will add additional features to the chat overlay, it is not required for it to function. If you do this, make sure to check the Channel connected to is your own Twitch account setting in the Connections tab on the settings panel. You can only access this extra data from your own account.
  6. Add a browser source to your scene.
  7. Copy this link into the URL field, and set your width/height/FPS settings. Make sure you leave the Custom CSS field as the set default!

Twitch Clips/Shoutouts

This shows clips from a streamer chosen via a moderator-level command, or directly from a clip URL.

To use the overlay:

  1. In your web browser, navigate to your Twitch Developer Console.
  2. Press the Register Your Application button, give it a name, set the OAuth Redirect URL to https://theblackparrot.me/overlays/chat/settings/, and set the category to Chat Bot. Then, click the Create button.
  3. Set up the settings panel.
  4. In your list of Developer Applications, click the Manage button on the application you just registered and copy the text from the Client ID field into the App client ID field on the settings panel. Click the New Secret button, and also do the same for the App client secret field in the settings panel.
  5. Add a browser source to your scene.
  6. Copy this link into the URL field, and set your width/height/FPS settings. Make sure you leave the Custom CSS field as the set default!

To trigger the overlay, moderators will use a chat command (by default: !clip). By default, only featured clips are selected.