Stream Deck App
It’s been few years I’m streaming PC Games on YouTube & watched others using stream deck but I never thought I’ll need one or didn’t see any big use of stream deck but recently after I created so many OBS scenes I realized that I need some shortcut keys to manage my stream overlays which I can’t do with the same PC while playing games unless you’re using dual PC.
Note: I’ll be using Windows 10 & Android Phone for this setup. If you’re using any other operating system then this method might still work for you. Just continue reading how this setup works & later you can do your own research to find alternatives.
So after some research, I found the App called StreamControl. Before this App I tried a few other Apps but I love how smoothly StreamControl manages OBS overlays wirelessly.
In this blog article, I’ll teach you step by step how to use StreamControl to manage your OBS overlays wirelessly.
This blog article divides into 3 parts.
- Downloading & Installing OBS
- Downloading & Setting up Websocket for OBS
- Downloading & Installing StreamControl App
If you already have OBS installed then you can go ahead & skip this step & jump to installing WebSocket section.
It’s very easy to download & install OBS like any other program. Visit the OBS website from this link & download the latest version as shown below.
I’m using windows so I’ll be downloading windows version.
Run the setup when downloading is complete.
Click ‘next’ as shown below.
Read the license agreement & click next.
Choose your installation directory, I’ll leave it to default location & click install.
Once the setup is complete tick the ‘launch the OBS studio‘ option & click finish as shown below.
After installing OBS we have to create some overlays so we can control them via StreamControl App.
If your OBS software is not running then open it as an administrator as shown below.
On scenes section click on plus icon to create a new scene as shown below.
You can give any name to this scene. I’ll call it ‘Stream Starting’ as shown below.
Now we can add a text source in sources area to show our viewers that our stream will be starting soon.
Click on plus icon in sources area as shown below.
From the source menu choose text as shown below.
Give your text source a name, I’ll call it ‘Starting Soon Text’ as shown below & click ok.
Text source properties window opens up as shown below.
In a text box give your text source a name. I’ll call it “Stream Starting Soon” as shown below.
You can make the font big or small & can change font type by clicking on “Select Font” as shown below.
For this example I’ll use the “Impact” font type & font size will be the largest because I can downscale it later on OBS canvas. Click OK once done.
Click OK again to get out of text properties.
Now you can place your text anywhere on OBS canvas. You can scale the text to big or small with the help of a red rectangle as shown below.
Let’s create another text source. We can just copy the current text source & paste it as duplicate. Right-click on your text & click copy as shown below.
Now in your sources area, right-click & paste (Duplicate) as shown below.
Now you have two text sources.
Rename the bottom text source by right clicking on it & rename.
I’ll name this text source “Be Right Back” as shown below.
Now we have to change the text for the “Be Right Back” source. Double click on “Be Right Back” source & rename its text to “Be Right Back” as well as shown below.
Click “OK” to get out of the text properties.
Now on OBS canvas, change the position of “Be Right Back” text source as shown below.
Now we have two text sources to work with. You can switch on the visibility or off of any source by clicking on the eye icon as shown below.
When the visibility is off you can see the eye icon gray out with a cross on it.
Leave the visibility switched off for the “Be Right Back” text source as you’ll turn on this text source using StreamControl on your Android phone.
If you’re streaming games or your desktop screen, OBS makes it very easy for you to pick one according to your need. Check other sources of OBS as shown below.
Now it’s time to install WebSocket for OBS so we can control OBS through the App.
If you’re on windows, download the Windows-Installer.exe file as shown below.
Once downloading is complete, run the program as an administrator as shown below.
Read the license information & click “Next”
Now click “Install” as shown below.
If your OBS currently running while installing OBS, the WebSocket will ask you weather it can close your OBS software automatically. Tick automatically close the applications as shown below.
Once the installation process is completed, click “Finish”
Now you have to check if WebSocket is installed properly. Launch your OBS software, click on Tools menu & look for Websocket server settings as shown below.
If you find “WebSocket Server Settings” in the tool menu then you’re ready to proceed with the next step. If you’re facing any issues then uninstall OBS restart your computer & install OBS back again & then install WebSocket. If you still face any issues then let me know in the comment form below.
I hope all is going well on your side by this point. Now it’s time to set up the OBS WebSocket so we can control OBS by using StreamControl App.
Launch your OBS software if it’s not running & click on tools menu & click again on the WebSockets Server Settings as shown below.
WebSocket server settings appears as shown below.
Tick “Enable WebSockets Server” checkbox & 4444 for Server Port as shown below.
If you want more security, you can also tick the “Enable authentication” box & set a password so other people in your network can’t access your OBS screen.
If you like to have system tray alerts then you can tick the checkbox for “Enable System Tray Alerts” & click “OK” as shown below.
By this point you’re ready for the third step which is installing & setting up StreamControl App.
Installing StreamControl App
In your Android App store, type Stream Control as shown below.
Click on “StreamControl – Remote for OBS & Streamlabs OBS” as shown below.
Install & open the App.
Make sure you’re connected with the same WiFi or network across both devices otherwise this method won’t work.
Click on Plus Icon to add a connection as shown below.
Now we need to give our connection a name & we need to type the computer IP address so we can access the computer through the App.
You can give any name to the connection. For this example, I’ll choose Labrush.
Click “Submit” once done.
Now we need to type the computer IP address. If you don’t know your computer IP address you can find it using command prompt.
Here are the steps to find your computer IP address by using Command Prompt.
Find Command Prompt in your windows machine. If you’re using Windows 10 or 8 then you can search for it as shown below. If you’re using any other Windows then you can find Command Prompt in the start menu.
Launch Command Prompt & type “ipconfig” as shown below.
Press enter to get your computer IP address. Look for “IPv4 Address” under “Ethernet adaptor Ethernet” as shown below.
Now type the IP address in your Stream Control App as shown below.
Click “Submit” once done.
Default Port is 4444 so leave it as it is.
If you set a password in your OBS software then you must type the same password in Stream Control password option. For this example, I won’t be using any password so I’ll leave the password as not set.
Before we establish the connection make sure that your mobile & computer are on same network.
Now click on the tick mark icon to establish a connection with OBS as shown below.
If the connection successfully established your connection name & IP address will appear on a screen as shown below.
if you get an error message just make sure your mobile & PC are connected on the same network or router. Also, try to change the Port with a different one if nothing works.
If your connection established then click on the connection name to see your OBS sources & scenes.
You can see all the settings to control your OBS software as shown below.
For scenes you have to click on scenes tab.
For sources you’ve to click on sources tab as shown below.
We can see now our text sources as shown below.
If you remember earlier we made the “Be Right Back” text source invisible. Let’s make that source visible & “Starting Soon” text source invisible by clicking on the eye icon. While you doing this pay attention to your OBS software on your computer.
Now you can see in your OBS software that “Starting Soon” text source becomes visible & the “Be Right Back” text source becomes invisible.
This was just a simple example, you can create more scenes, sources & can control all of them via StreamControl App.
If you find this article helpful then please share it with your loved ones. Thank you for reading.
You’ll also like: