Skip to content

Getting Started

Firebottle edited this page May 23, 2017 · 30 revisions

Introduction

Firebot is an app that is focused on providing Beam.pro users with a large variety of interactive options. While there are apps out there that focus on a specific area, this app is a jack-of-all-trades type of app. This means that it offers a bit of everything, but does not dive too deep into any one thing. If your channel only focuses on one specific aspect of interactive, you might be better served finding an app that is dedicated to that aspect specifically.

Getting Started Steps

  1. Opening The App
  2. Logging In
  3. Interactive Studio Creation

Other Instructions and Optional Settings

Opening the App

To get started, simply visit the releases page and download the zip file for the newest version. In general, Beta versions are still in testing and may have bugs, while full releases are stable releases.

Once downloaded, you'll simply need to unzip it into whatever directory you'd like to keep Firebot in. I also recommend creating a shortcut of Firebot.exe and placing it on your desktop for easy use.

Logging In

Firebot will open on the login screen. You'll see a login button for a streamer account and a bot account. At minimum you will need to login with your streaming account, but if you have a separate bot account you'll have more interactive options available to you if you login with your bot.

Just click the login button to begin the process of logging into the app. Note, you'll be logging in as whatever account you're currently logged into Beam with at the time. So if you need to switch to your bot account do that before hitting the login button.

After hitting the login button you'll be given a 5 digit code. Simple click that code and then copy/paste it into the Beam window that opens up. Approve the app to access your account and you're done!

Please note that the app does not store or have access to your username, password, or 2factor code. None of that is stored. This app uses OAuth to safely log you into the app without revealing any type of personal information. With that said, never share your user-settings/auth.json file with other people. This will allow them to run interactive on your channel.

Beam Interactive Studio

Creating a New Interactive Board in the Studio

The first step to creating an interactive board is building it in the interactive studio. Doing this allows you to customize all of the scenes, button names, spark costs, and placement. To find this area, just log into beam and visit this link.

Once you're at the interactive studio, just hit the big plus button next to "Your Projects" to create a new board. Give your new board a name and hit save.

You'll be taken to the settings for your new board right away. You do not need to fill out anything on the "Info" tab. Just hit the build button at the top to start building.

Editing an Interactive Board in the Dev Lab

Now, time to build your board!

Scenes: On the far left you'll see a column that holds all of your scenes. "default" is the scene that everyone will see when they first join. But, you can add more scenes and show those only to certain people. For example, you could have the default scene be soundboard buttons, and then an "Images" scene that shows images in your overlay. At minimum you just need the default scene.

To add a scene just click the plus sign next to "Scenes" in the top left.

Controls: This is where you add buttons to your currently selected scene! Click the plus sign next to "Controls" to add a new button. When you do that you'll be asked to give the button a unique name, and you can choose to make it a button or a joystick. Firebot supports both types.

Once you name the button you'll see that it shows up as a horizontal bar. Click the arrow on that bar will let you edit the button text that users see and the spark cost. Fill out that information and you're done! Just repeat this process for all of the buttons you'd like to add.

Adding Buttons to the Scene: Adding a button to the currently selected scene is easy. Click on the double line next to the button you want, and then drag it over to the grid in the far right column. If you have problems positioning the button, try aiming for the top left of the grid square you'd like for the button to fall into. Now that the button is placed you can resize it by clicking the edges and dragging.

An important thing to note is the small icons on the grid. These stand for phone, tablet, and desktop. If you click one you'll get a different sized board. You'll need to place buttons on all three of these sizes so that people on all devices and resolutions can participate.

Loading Buttons into Firebot

Creating a New Board

Now, with your interactive board created in the dev lab it is time to get Firebot ready. So, navigate to the "Interactive Boards" tab of Firebot. You'll see a blank screen with a dropdown in the top right. Hit the dropdown and click the "Add Board" button.

You'll be prompted to enter a code for the board. So, go back to the interactive studio and click the "Code" tab for your board. You'll see a short 5 digit share code. Copy and paste this into Firebot.

Done! Your board should now load up. Note that you'll never need to do this again now. If you add a new button to that board you can restart Firebot, or just reselect the board in the "Select a board" dropdown to update it.

Editing Interactive in Firebot

Now the fun starts. You get to go through all of your scenes and buttons to choose how Firebot will handle everything when someone interacts with it. On the very first tab of every board you make you'll find a "Settings" tab. These settings only affect this one board. The other tabs are your scenes which have all of your buttons.

So, lets go over how to edit each...

Scene Defaults: The first row on the "Settings" tab is going to be where you set the default scenes for certain groups. This is a bit complicated, but only because it is a brand new feature in Interactive 2. This area allows you to, for example, set one of your scenes to be accessible only by your moderators.

Going along with our example, you would click the edit pencil for the scene you wanted to set as moderators only and then select moderators from the list in the popup window. Now, when moderators join your channel they'll see this scene while everyone else will see the "default" scene.

Cooldown Groups: The second row on the "Settings" page is carried over from Firebot v2. These are cooldown groups. Here you can group any buttons together and when any of those buttons are clicked they will all cool down for the same amount of time together. To add a new cooldown group, just click the add button and select the buttons you'd like to cool down. This option allows you to quickly manage the cooldowns for a large amount of buttons.

Editing Buttons: To edit buttons you will need to click on one of the scene tabs. Once you do that you'll see a list of all buttons in that scene. On each button you'll find a big edit icon. Simply click that to start editing that button behavior.

On the popup you'll find all kinds of settings. Button ID, Cooldown, Button Text, etc... You can edit the information here however you would like. To add an effect to a button, for example playing a sound, click the "Add Effect" button. This will add an effect that will occur when someone clicks the button. You can chain as many of these together as you want to create some really unique experiences.

If you'd like to know what the different effects do, please visit the "Button Effects" part of the wiki.

Launching Interactive

Starting Firebot

So, you've edited all of your buttons and have given them purpose. You've probably also checked the main "Settings" tab in Firebot to make sure everything is good there as well. (You did that didn't you?)

Good! Now it's time to launch interactive! You can start interactive in one of two ways.

  1. Click the connection button in the bottom right of the app.
  2. Press Control+Alt+F12. This is the global hotkey to start or stop interactive and it works even from within a game.

If everything is good, this should change the status indicators to green and your buttons should show up on your Beam page. If not, you should get errors that tell you what is wrong.

Global Interactive Toggle

Firebot has a global hotkey built in so that you can toggle interactive on or off as needed, even from within a game. Simply press Control+Alt+F12 toggle this on or off.

Updating Firebot

If your current version of Firebot is working fine for you, there is no need to update. However, if you want the newest features then Firebot will let you know when there is an update available to download. You can go into the Firebot menu and click the "Latest Update" option to view the changes that were made.

To update Firebot you'll first want to make a backup up your user-settings folder. This should never be overwritten in an update, but it's always a good idea to have a backup saved for a few days incase you want to move back to an older version again.

Next, download the latest update and just overwrite all of the files in your current Firebot folder with the new files.

Clone this wiki locally