General Information

Thanks for checking out the Gooey stream widgets. This guide will cover items downloaded from NerdOrDie.com and TwitchTemple.com and will take you through the setup process. If you have any questions that aren’t answered in this setup guide, please feel free to contact us.

Photoshop is not required for any portions of this product.

The alerts, overlays, and widgets have been designed for use with OBS Studio, XSplit Broadcaster, BEBO, Streamlabs OBS, and most other streaming softwares. Please make sure your streaming software is up to date before using this product. If you are not familiar with how to set up and use streaming software, we strongly suggest checking out the below tutorial before moving on:

OBS Studios Tutorials by NerdOrDie

Before You Install

Fonts Used

If you’d like to match the style of the overlay and alerts, use the fonts listed below.

  • Dosis- This is the primary font used

Colors Used

  • Blue: #008cff
  • White: #FFFFFF

Installation Guide

Installing the Alerts

In your downloaded files, open up the standard alert folder. We’ve included the alert video files that already have sounded with them, muted version of the alerts, and then the sound files themselves.

  1. Click the Alerts Quick Setup link to begin installing these alerts.
  2. If you’d like, choose “Create Widget Theme” and name it something appropriate such as “Gooey Alerts”. The import link will only override your alert package. This means you combine these alerts with any other scene collection you’ve made in Streamlabs. If you want to save your old alerts, it’s highly recommended to do this in a new profile.
  3. Select “Use” for the profile you want to import into.
  4. Navigate to “Alert Box” and copy your unique URL.
  5. Paste this URL as a “Browser Source” in your streaming software. We recommend setting the size to at least 1260 wide and 800 tall. If you need to scale down, you can do so directly inside of OBS Studio. If you’re using the Streamlabs OBS .overlay file, you may not need to complete this step if your alert box is already added in.

Once you’ve added this into your streaming software test the alerts to make sure they’re working properly.

Custom Alert Options

These options are found in the Custom Fields tab.

  • Animation Speed – The percentage speed that widget animations plays at. Default: 100.
  • Gooeyness – increase or decrease the goo effect. Default: 6.
  • Goo Opacity – opacity of the goo area. Higher is more solid. Default: 100.
  • Pause time – amount of time the alert pauses for before it animates out. Default: 6.
  • Font family used for the top and bottom text box. Default: Dosis.
  • Top font color. Default: #FFFFFF
  • Top font size. Default: 30.
  • Bottom font color. Default: #172741
  • Bottom font size. Default: 20.
  • Alert distance from the top. Default: 50.
  • Top line – text template. Default: Differs per alerts. You can use dynamic tags like {name}, {amount}, {count}, and {product} here.
  • Top goo area offset – moves the top goo area up or down. Default: 0.
  • Top goo roundness – increase or decrease the roundness of the goo corners. Default: 30.
  • Bottom line – text template. Default: Differs per alerts. You can use dynamic tags like {name}, {amount}, {count}, and {product} here.
  • Bottom goo area offset – moves the top goo area up or down. Default: 0.
  • Bottom goo roundness – increase or decrease the roundness of the goo corners. Default: 10.
  • Bottom from – the distance the bottom goo comes from. For example, -40 will mean the goo comes from 40 pixels above
  • Top goo fill color. Default: #008cff
  • Intro blog colors – the color of the blobs that first appear and smash together. Default: #1897ff
  • Bottom goo fill color. Default: #00b2ff
  • Message Offset – the amount of pixels to offset the usermessage by. For example -100 will move the use message 100 pixels upward. Default: 0.

Once you’ve downloaded and unzipped the files from Nerd or Die, open up the files included. You’ll see a folder for the event list and standard alerts.

Event List

  1. Click the Widget Quick Setup link in your downloaded files to begin installing these alerts (found in the Event List folder).
  2. If you’d like, choose “Create Profile” and name it something appropriate such as “Gooey”. The import link will only override your event list, as this design is an extended version of an event list. This means you can combine this event list with any other scene collections you’ve made in StreamLabs. If you want to save your old event list, it’s highly recommended to do this in a new profile.
  3. Select “Use” for the profile you want to import into.
  4. Navigate to “Widget URL” and copy your unique URL.
  5. Paste this URL as a “Browser Source” in your streaming software. We recommend using a size of at least 1000 by 1000. Typically, though, I put this option at the size I’m streaming in. This size may change depending on your customization options.
  6. If you need to scale down, you can do so directly inside of OBS Studio. If you’re using the StreamLabs OBS .overlay file, you may not need to complete this step if your event list box is already added in.

Fire off a few test events to make sure that things are working properly. Before I forget, if you’ve hit the launch button at the top and you’re using Google Chrome, you will have to click inside the browser in order for the video files to autoplay. This will not be necessary if you’re doing your tests in OBS Studio or Streamlabs OBS, which we recommend.

Streamlabs Base Options

  • Theme and Theme Color — will have no effect on this widget
  • Enable Events — allows you to decide which events you want to display inside the widget
  • Min Options — let you set how many viewers for hosts, bits, or raiders for raids will trigger an event
  • Max Events — let’s you change how many events are displayed at once
  • Background Color — is only for preview purposes
  • Text Color — will have no effect on this widget
  • Font — allows you to pick the font family user in this package, the default is Orbitron, which will match the rest of the designs
  • Animation and Animation Speed — will have no effect on this widget
  • Fade Time — will hide the widget after X seconds, 0 always displays the widget. This option must be more than 8 seconds if you’re using the alert list, otherwise it will not function properly.
  • Other Options — will allow you to flip the widget. For example, enabling the Flip Y will make the events come from the bottom. Flip X will enable the animations coming from the right side (to edit where the text is, please see Custom Fields).
  • DO NOT — change the custom HTML/CSS options unless you know HTML/CSS/JS – we do not support custom changes.

Custom Options

These options are found in the Custom Fields tab.

  • Name – Font Weight. The thickness of the font for the names. Default: 600.
  • Name – Font Size. The font size of the names. Default: 30.
  • Tag – Font Weight. The thickness of the font for the names. Default: 800.
  • Tag – Font Size. The font size of the names. Default: 30.
  • Name – Font Color. Default: #FFFFFF
  • Tag – Font Color. Default: #303C68″
  • Icon – Fill Color. The color of the icon. Default: #0587CA
  • Circle – Fill Color. The color of the circle behind the icon. Default: #FFFFFF
  • Main Goo – Color of the main goo/name box. Default: #008cff
  • Intro Goo – Color of the intro goo. This is the goo that pops out during the initial animation. Default: #1897ff
  • Text Offset – Offset the text vertically to properly align if needed. Default: 0.
  • Fade Out Position – Where do you want to start events fading out at? Default: 4.
  • Fade Out Opacity– The opacity of faded out elements? Default: 50.

Changing the Icon Colors for the Alerts, Event List, and Alert List

If you’d like to edit the color of the alert icons or event list animations, you can do so with a color correction filter. Right click your sources and add a color correction filter, you can adjust the hue, brightness, and saturation of this source. Please note: this will change all the colors in this source. We recommend leaving the custom options at their default in order to get the best results.

Usage Terms

The user may use these alerts for personal and commercial use. It is intended for one (1) user and one (1) device only. These usage permissions do not expire. Re-distribution is strictly prohibited. The alert graphics and code remain the property of Twitch Temple and Nerd Or Die unless written permission is granted.

Please refer to our Terms and Conditions for more information.

Future Reiterations, Errors and Updates

This version of the alert is provided as is. If there are missing elements or you think something critical needs addressing, please contact us outlining the issue and provide the email used to purchase the product. You are allowed up to 5 downloads per product.

Please follow @NerdOrDieCom on Twitter for update information.


Changelog

To receive these updates simply re-download the product via the email link, or on your account page when logged in.

  • No major updates yet!