Tag Archives: alerts

Firebot Mixer buttons Title

Creating Interactive Buttons For Firebot

Posted on by

 

Firebot Mixer buttons Title

 

Let the fun begin! Now that the hard part is over and you've linked your Firebot and Mixer accounts, you've got the freedom to use your creativity and create some interactive buttons that your viewers can have fun with. If you have not done this step yet, make sure to check out this guide to get you setup.

 

Head back to your Mixer Developer Lab home page. Again, make sure you are always logged in as your streaming account and not your bot.

  1. Click your avatar to the top right to open up your side menu.
  2. Click on 'Dev Lab' at the bottom of the side menu.

 

 

Your newly created project from this guide should now be listed. In our example, we named it 'test sound board'. I've got a few more boards listed as this is my live streaming account. 

Click the 'Editor' button

mixer dev lab selection

 

 

Click the 'Build' tab.

 

mixer dev lab build

 

Welcome to your interactive board build screen. This is where you will create and layout button with basic properties.

  • The 'Scenes' give you the flexability to have different layouts within the same board. I use this by creating mod and subscriber boards.
  • The 'Controls' section is where you populate your buttons.
  • The 'Grid' section is the actual layout that you will see on your Mixer channel when your board is enabled.
  • The save button to the right is also important. Make sure to save often.

 

Lets create a button by clicking the '+' sign in the controls column.

 

mixer dev lab buttons

Some additional items will open up. 

  1. Enter your button name here. In this example, this will be called 'button 1'. This is not the name that appears on your soundboard though. You get to set that name in the next step.
  2. There are multiple options in what button type you can make. This tutorial will cover a simple 'button' so click that option.
  3. Click the 'Add' button.

 

Mxer dev lab buttons

 

Your new button will appear in the control column. Click the arrow button to the right side to finish editing the properties.

 

mixer dev lab buttons

 

  1. Fill in the display name of your button in the 'Text*' box. This is the actual name that shows up on your sound board. I will just keep things simple and use the same name and the button name, 'button 1'.
  2. Fill in your sparks cost. Keep in mind that this can be overwritten in Firebot, but every time your resync your to Dev Lab, it will reset to the sparks cost set here so its best to get that number to your liking now. Or change it here rather than in Firebot.

There are a few more items here that you can customize and I will go over these in a future post, but we will stick to the basics for now.

Click the 'X'  in the button to finish up.

mixer dev lab buttons

 

After you X out. You are all set. Congrats on creating your first Mixer Developer Lab button!

Repeat these steps to create additional buttons.

mixer dev lab buttons

 

The next step is placing your buttons on your Grid layout. This layout represents the layout on your Mixer page. I went ahead and created two additional button for this example. Simply click and drag the button onto the Grid. You can then rearrange and click and drag the sides to adjust size. Click 'Save' When you are happy with your layout.

To the right side you will also notice three icons which represent phone (small grid), tablet (medium grid) and desktop (large grid). This will allow you to create separate arrangements for each specific device. I would recommend coming back and creating layouts for each to ensure all your viewers will have a good experience using your interactives, regardless of what device they are using.

 

Mixer Dev Lab buttons

adding interactive buttons to your Mixer page layout

 

 

  1. Head back to Firebot and click 'Change Board'
  2. Click 'Resync Board'.

Alternately, Firebot resync's when you open the program up. So opening it up for the first time will also work to resync.

Firebot resync

 

This should load up the Mixer Developer Lab changes and you will now see your three new buttons (or however many you created). Don't forget that the layout and quantity of buttons will be handled via your Mixer Developer Lab. Save the changes there then resync in Firebot. This will need to be done every time you make a change.

Firebot buttons

 

 

Buttons can now be individually edited within Firebot to trigger sounds, images, videos, commands, etc. Make sure that you've already linked Firebot with OBS as a browser source. This step only needs to be completed once.

 

Scorpbot Alerts Title

Scorpbot Alerts And Activity History Overlays

Posted on by

Scorpbot Alerts Title

 

After you've got your web cam, mic, capture card settings down in OBS, you will be up and running with vanilla OBS streaming. This is an important first step because it will allow you to run some tests to ensure you have the best quality steam that you can mix together.

Take the time to tweak and perfect your basic setup and take advantage of the record button to monitor what your stream output will be, every time. I do a couple quick video recordings before I hit that stream button. Having a good audio mix and synced game and cam video/sound is critical to keeping an audience around.
Once you are good with your vanilla OBS, I would jump to Streamlabs to get your alerts overlay setup. I really like the flavor these alerts add to a stream therefore this was my first customization I worked on before and soundboard sounds or graphics.

You can also use built in alerts in Scorpbot. Set these up by following these steps:

 

SCORPBOT SFX VIA ALERTS

Now that you have a SFX in Scorpbot, you can take this a step further via the built in functionality and apply this to an Alert.

  1. Head over to the 'Settings' tab.
  2. The SFX column can now be populated with your newly created sound via the drop down menu. If you create additional SFX,they will show up here as well. The same can be down with graphics. Make sure to head over to that tutorial page to get them setup first.

Scorpbot Alerts Title

Adding An Interactive Board [Scorpbot]

Posted on by

Scorpbot Alerts Title

 

SCORPBOT SFX VIA INTERACTIVE BOARD An interactive board can be a way to keep viewers occupied and give them more opportunities to interact with you as you stream. Sparks cost and cooldowns can be adjusted for each button so you can customize things to your liking. This will also help minimize the spamming of your interactive buttons. Here is a step by step to get the board up and running on Scorpbot. Make sure you've already setup some sounds and / or graphics and also added Scorpbot as a source in OBS.  

  1. Head over to the 'Interactive' tab.
  2. Input the name that you would like displayed on the button.
  3. Enter your desired cooldown time in seconds before the button can be pressed again.
  4. Enter your desired sparks cost per button press.
  5. This is your syntax to activate the command. It must be typed correct in order to work: $sfx(filename). In our example the 'Game Over' file name is entered minus the file extension, which is not needed. Change this accordingly to whatever your filename is.
  6. Ensure that the two checkboxes are ticked.
  7. I recommend clicking the 'Free for Caster' checkbox. This ensures that no sparks are deducted from your total when you press the button. This helps for testing purposes, but is also nice to keep on all the time.
  8. Once all this is set, click the 'Create' button.
  9. A new button will appear based on the size in the options. To modify the size or move the button around, uncheck 'Visible' and click 'Update. Just make sure to make it visible again and update when you are happy with the size and location.

    Rinse and repeat to add additional buttons. If you would like to create a button that displays graphics, head over to the GFX tutorials( under construction). To enable to buttons on stream, click the Connect button. To disable just click the Disconnect button. Make sure you've linked your bot and streamer accounts first otherwise this will not work.  

Scorpbot Alerts Title

Adding Scorpbot Graphics To Your Live Stream

Posted on by

Scorpbot Alerts Title

 

You can add custom graphics and gif animation (GFX) to Scorpbot. These can also linked to your SFX files. These can be triggered via custom commands, actions (follows, hosts, etc.), or they can incorporated via the interactive board buttons. Scorpbot needs to be linked to OBS via a window capture source. This will allow the graphics and animations to be displayed in OBS and output to your stream. Ensure that you follow this step first to make sure Scorpbot and OBS are linked properly. Once you finish this step, head back to this section to continue creating your graphics.

 

  If you haven't yet, head over to the official Scorpbot website, download and install the program.

scorpbot logo  

 

  1. Open Scorpbot and click the 'GFX' tab
  2. Click the 'Open Media Folder'

scorpbot gfx setup

 

  1. A Windows Explorer window will pop up. My default path is set to: C:\ScorpBot\Data\Media\. This is where you will drop all your image files via Windows Explorer. Since I access this folder quite often, I created desktop shortcut to this location.
  2. In this example I am using 'GameOverFX' gif file. Whenever you add a new graphic file to Scorpbot, add it to this folder location every time.

 

 

  1. Head back to the same Scorpbot 'GFX' tab and click  'Reload'. The clip should now be loaded into Scorpbot.
  2. Click 'Add' to create a new graphic.
  3. 'New1' will appear in the 'Animations' window.
  4. 'New1' will also appear in the 'Animation Settings' in the 'Name' box.

  scorpbot gfx new file

  We will now wrap up the graphic by linking the image and audio file (if any).

  1. Rename the animation to something relevant. In this example, we will call this 'GameOverFX'.
  2. Click the pulldown arrow and pick the appropriate file. In this example we will choose 'GameOverFX.gif'. If you do not see the file, ensure that you placed your file in the correct directory and clicked the 'Reload' button.
  3. The positioning section allows you to precisely locate the graphic on screen. You can plug coordinates directly or if you click the 'Set' button and head to your green screen stream window, you can click and drag the border to your desired position.
  4. The 'Play Sound' section allows you to play a custom sound with your graphic. All of my graphic interactives have sounds associated with them. In this example, my 'Game Over' sound effect is already setup in Scorpbot. If you have not yet completed the 'ADD SOUND FX TO SCORPBOT' tutorial, go check it out and your SFX should then populate in this pull down window.
  5. Click 'Save'
  6. You will notice the 'New1' filename will now update to the name that you set.

  scorpbot gfx setup settings   Repeat these steps to add additional graphics to Scorpbot. Make sure to 'Add' a new animation first or you can risk overwriting a previously saved animation.

You'll notice that I did not go over every setting in this window. Feel free to experiment with these settings to tweak your new animation to your liking. The 'Animation Frames'  Delay setting will change the speed of the gif and the Loop setting will determine how many times the gif is repeated.

The 'Text' setting will allow text to be displayed with the graphic. The box to the right will allow you to change the text color. There are also text variable that you can select from the pulldown menu as well as text outline and offset commands.

TESTING YOUR NEWLY CREATED GRAPHICS AND GIFS After creating your GFX, I would test these out to see if they are working in OBS. The good thing is you do not have to be live streaming to test them. Just ensure the following:

  Then simply hit the 'Test' button in the Scorpbot 'GFX' tab and it should all work out.