The All Overlay

This is a new separate overlay system that seeks to minimize the reliance upon OBS and automate the entire overlay's moment-to-moment state in an orchestrated fashion. Including instant replays that "just work". Additionally, it seeks to be as modular and composable as possible to make it easier to customize with little more than CSS and URL parameters.

What exists today is just the beginning. The first available theme is "scifi" and was designed for KQ45, though with the exception of a couple of unique brand elements is scene and event agnostic. It was loosely inspired by Star Treks LCARRS design system present on the computers and other interfaces.


Requirements & Setup

  1. Requires OBS Version 31 or later - Nonnegotiable
  2. Open OBS with special flags

Its not yet known whether this is required for all operating systems. For mac users you must open OBS from a terminal with the following command open -a "OBS" --args --enable-media-stream --use-fake-ui-for-media-stream

WINDOWS: From CommandPrompt:

cd /d "C:\Program Files\obs-studio\bin\64bit" && obs64.exe --enable-media-stream Or create a shortcut and add the flags after the exe in the target field. If that doesn't work try adding additionally flags --use-fake-ui-for-media-stream and --enable-gpu

This enables browser APIs for handling video devices.

  1. Create a new browser source with the following
  • URL. Replace with your cabs overlay ID > https://kqhivemind.com/alloverlay/<ID>?theme=scifi
  • Size 2200 x 2000 (this is flexible but it must be bigger than 1920x1080 + extra width/height for control panels)
  • Custom CSS (more on this later)
  1. Place the browser source in the top left. Do NOT scale it. Lock it in place and never move it again.

  2. Press the "Interact" button to bring up the overlay + control panels.

  3. Select the gold cam, blue cam, and game feed devices. You will see these work immediately. These will be saved and remembered upon next open**.

NOTE: USB cameras of the same make and model often have exact same device IDs. This makes them difficult to distinguish. This overlay will still work even if two devices are assigned to the same location. The computer will also remember which device goes where between disconnections IF (and only if) the exact same device is plugged into the same usb port. This is actually great and means you can color code/label your ports and devices accordingly.

NOTE on the NOTE: This is an area for further testing and exploration. If you discover something new please report back to the hivemind channel on discord.

That is pretty much it. Have fun.

ALTERNATIVE:

  • Open overlay in dedicated browser window or electron app frame
  • Ensure that the site has permission to use the camera and audio devices
  • In OBS use a window capture instead of Browser Source.
  • Everything else is the same as above.

This should not be necessary or even preferable unless there is some browser feature you require that OBS's embedded version does not support.


Parameter control:

Add query string parameters to the browser source URL to enable/disable options, change themes, etc. Query string parameters must follow standard URL query param syntax. The first one always starts with ?name= subsequent options follow with &name=

Themes available:

  • scifi

SCIFI Theme Options

  • &disable-replay=true - Disables the replay system
  • &hideLoader=true - Hides hivemind intro animation
  • &override-scene=SCENENAME - Mainly for Debugging but could get creative. Forces and locks to the specified scene: options are ingame, postgame, match_preview, match_summary
  • More to come

SCIFI Custom CSS variables in the body tag you can override the following variables:

--scifi-main-color:
--scifi-blue:
--scifi-blue-secondary:
--scifi-blue-highlight:
--scifi-gold:
--scifi-gold-secondary:
--scifi-gold-highlight: