How to set up twitch alerts obs guide

Alert Animation example

What is a stream alert?

An animated alert, put simply, is an animated clip that appears on your stream each time one of your viewers engages. These are great for supporting you and the stream, in the form of follows, subscriptions, donations and more!

Animated Alerts are all about interaction, encouraging your audience to contribute in any way is great for you and your viewers and adds to the community feel of a stream. They also give you the chance to acknowledge the support of your audience and thank them for it!

We prepare all of our Alerts for multiple broadcasting software. In this guide we will cover the most popular - StreamLabs (OBS).




How to set up alerts in 5 easy steps

Guide suitable for those streaming on Twitch, YouTube Gaming, Facebook gaming and more.




Download OBS

If you’ve not done so already, using this link download Stream Labs from their website. Stream Labs is free and open source so won’t cost you a penny. We think that OBS is great for hosting your overlays and linking to twitch. It is particularly great for those just starting out, so we would recommend it to beginners.

image_2020-09-11_15-12-01.png

Log in

Stream labs make it super easy to link your streaming profile simply click the arrow icon on the bottom left of the page and put in your streaming platform information. There is support for YouTube, Facebook and Twitch, just log in as usual and that’s it! The integration is easy.

image_2020-09-11_15-22-55.png


Select and upload your file

  • Inside Stream Labs, click on the dashboard icon (shown below). This takes you to the OBS website and is where you need to be for uploading the files.

image_2020-09-11_15-34-30.png
  • On the menu (left), under the ‘features’ title you will see - ‘Alert Box’ - Click on this to open up the alert settings. ( 01 )

image_2020-09-11_15-35-29.png
  • For this tutorial we will be setting up an example ‘new follower’ alert, but all the principals in this guide are virtually the same for all alert boxes. First, select ‘follows’ tab underneath all the test icons. ( 02 )

  • Scroll down to the ‘image’ section where the preview box is and click ‘change media’ ( 03 ). This will bring up the media gallery and file upload section.

image_2020-09-11_16-18-40 copy.png

  • This will bring up the media gallery and file upload section. Click on the green area on the top left of this section to upload file or simply drag and drop the file into this area if you have it open in another tab.

1.png
  •  All the alerts we provide in our packages are clearly named, in this instance - ‘new follower’.

     Tip

    If your image is not loading or showing up, close the media gallery and re-upload. In our experience, the action of uploading doesn’t always work first time.

Set up browser source in OBS

Now you have the file uploaded to OBS you just have to link them up so they trigger with an engagement and appear on your screen during streaming. Almost done!


  • Now is a good time to save your changes. Simply scroll to the bottom of the page and click ‘save settings’.

  • Scroll back nearer the top of the page to the ‘widget URL’ section where you will see some blurred out information. This is the link you need to copy here and paste into the OBS software to link everything together. Click ‘Copy’.


2.jpg
  • Now navigate back to the OBS software and in the sources section click the Plus icon (+) to add a new source. In the add source menu, select ‘Browser source’ ( 04 )

  •   and then click the ‘add source’ button. After naming the source you have the settings for browser source menu.

3.png

  • In the top ‘URL’ box, remove the text and paste your text we copied earlier into this area ( 05 )

  • . Leave all the other settings  and click ‘done’.

4.png


  • Now you have a guideline box appear on the screen. This can be dragged around to place the alert where you’d like it to appear during your stream or re sized by grabbing the corner of the guideline box and stretching outwards.

  • To test the alert is working, simply go back to the OBS website (or click dashboard) and click the test icon. In this case the ‘test follow’ button. ( 06 )

5.png
  • Quickly switch back to OBS and you should see the test appear on the screen! You’re done!! All it takes now is some minor adjustments to suit your individual alert.

6.png
    • Final Adjustments With each Animated Stream Package and Packages from our Shop being unique and individual, there are some small tweaks that are needed that are equally individual!We would recommend having a play around with the duration and alert text display first. These are the most common tweaks that are needed. Each time you make an adjustment, just click the test button as before and flick back to your OBS software to check the changes working for you!

Troubleshooting

The changes I’m making are not showing up when I test the alert - You have to click ‘Save settings’ every change you make for it to reflect in OBS software. 

The words are too big - On the stream labs website, open the ‘font settings’ here you can adjust the font size. Save, click test and flick back over to OBS software to check the changes.

The animation of the targets name is not what I want - Change the text animation section on the stream labs website.

My old alert is still showing even though I uploaded the new one - We find that sometimes when making changes if you’ve saved all the changes and uploaded the new files, sometimes your old alert shows up and now the new one even if you have deleted and completely removed the old file from the media upload. Frustrating as it is, we find that closing and reopening both stream labs and OBS software solves this every time.

My alert is too big/small - Resizing the alert can be done inside OBS software by moving the guidelines of the browser source. Moving the browser source around is done by clicking in the middle. Expanding and shrinking is done by clicking the corner of the guidelines and dragging outwards or inwards.

I’ve made changes and clicked ‘test’ but when I go back to OBS software the screen is blank - Either double check the above for setting up the browser source or make sure you’re switching fast enough! Once you have clicked the ‘test’ button, you have to get back to the software fast! A good tip is minimizing both screens and having then side by side, at least for the first step in making sure that you have linked the browser source up correctly.

I’m totally stuck what do I do? - Included in the price of our custom and pre-made work is after sales support. We are always available to help just speak to us on our live chat, any of our social media DMs or through our email - designnubi@gmail.com and title the email - support and your order number.

Please note - Support is only available on work we have supplied and you must have your order number available.

Our most popular stream products will increase views on your stream today!