Open Broadcaster Studio (OBS) is a tool used by streamers (and lecturers) to provide custom layouts and scenes for live streams. It lets you mix multiple sources (e.g. webcam, desktop capture, microphone, external computers, websites, video files), and lay them out however you like.

OBS is a great way of having different "contexts" in your streams or recordings, moving from say a title card, to a full-screen view of yourself, to a picture-in-picture overlay of your content plus your webcam, and to a ending card -- effectively editing your recording during the broadcast. You can add in more advanced techniques like green screen or colour correction too!

Download Open Broadcaster Studio

Here is a great guide to setting up a basic OBS scene made by UTAS Medicine Senior Lecturer Dr Jamie Chapman.

Once you have a set up in OBS, it is simple to share it on Zoom using the OBS Virtual Camera. Check out this guide to OBS for Zoom by Markus Presents.

OBS lets you include web pages in your scene, and this is the basis of many interesting on-screen elements. In the example image above are:

• #lecture-chat channel overlay
• Online member count
• Post leaderboard (also switches to achievement leaderboard)
• Lecture start-time countdown
• (not pictured) Popup-messages with emojis

Discord Chat Overlay

You can overlay the chat from any of your Discord channels (usually #lecture-chat using a tool called Stream Kit Overlay.

Stream Kit Overlay

Choose Install for OBS, and choose the Chat Widget. Configure your widget here, and then on this page you will be given a URL to copy to your clipboard. Do that, and then in OBS create a new Browser Source:

In the popup, paste in the URL. You can apply any CSS styling you want to the overlay, and also set a width and a height for the box to appear on screen. To allow for a custom width and height, I recommend using the following CSS:

body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; } .chat-container { width:auto; } .chat-container .messages { height: auto; position: relative; z-index:-1; height: calc(100vh - 55px); } .chat-container .messages .message { font-size:larger; }

Drag and resize the overlay to anywhere you like on the screen.

Lecture Start Countdown

Streamers tend to start their stream earlier than the specified start time, and a show a countdown until when the actual stream is supposed to start (this it to allow people to join the room early, so they don't miss the start of the stream.

You can show a countdown in OBS using a plugin like the Stream Countdown:

Stream Countdown

Configure the countdown at the link above, and click Create. This will take you to a page for your countdown. Copy the URL from your browser, and use the steps above to create a new Browser Source using this URL. Here is a sample countdown that I use for my lectures which start at 1pm.

On-screen Polls

If you enable OBS Integration on the Features Tab, you will be able to use some widgets specific to the bot. With this feature enabled, you will be able to see the OBS Links Tab

Copy the URLs on the OBS Links tab and use the instructions above to create a new Browser Source using those URLs.

The Poll Widget looks for the most recently posted poll in your lecture channel, and will show the current results.

If you would like the right-align or bottom-align the polls within the browser source, you can try a variation of this custom CSS for the source:

body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; } #results { position:absolute; bottom:1em; right:1em; }

Lecture Popup Text

Lecture popups are full-screen text messages (with optional emoji) that can be triggered on the Lecture Popups Tab. Streamers usually display these kinds of messages when something interesting happens (like getting a new subscriber, or when a VIP enters the chat). You could use these to flag in-lecture events like "Great Question!", "Discussion Time!", or "Live-Coding Fail!".

Popups can be from a range of select styles and animations, and a giant list of all supported emoji a provided to make it easy to search for and copy. Previously-used popup messages are saved, so that you can re-use them with a single click.

You can even trigger popup message directly via a URL, which you could hook up to a hot-key on your keyboard or Stream deck. The URL is in the format: https://utasbot.dev/guild/[YOUR_SERVER_ID_HERE]/text/input/?text=[YOUR_TEXT_HERE]

Top Posters and Leaderboard Widget

If you have achievements and analytics features enabled, you can also get a list of the students with the most acheivements and the most posts which can be displayed on a title card, for example.