The Panel Builder is a desktop application that allows you to control Viz Flowics in a simple way when integrated with vMix.
From the Panel Builder, you will have the possibility to choose if you want to activate the keying overlay in preview or program and to trigger the Flowics overlays.
Installing the Panel Builder
To install this application you must download it from Panel Builder 4.0.29 and then follow the instructions below:
Windows:
Open the .zip file >> double click vMix Panel Builder 4.0.29 folder >> extract VMPB 4.0.29 Winxx folder to the location of your choice.
Create a shortcut from the vMix Panel Builder.exe file and drag it to the desktop
Run the App.
Mac OS
Copy only the "vMix Panel Builder.app" file into the Applications folder. The app is notarized and code signed with Apple and should load properly on Mac OS.
To create a shortcut, you can drag the vMix Panel Builder icon from the Applications folder to the Desktop or Dock
Run the App.
Now you should see the empty Canvas ready to Create a new Panel.
Getting the Flowics outputs to work with the Control Panel
To take advantage of your control panel you will need to divide your different Regions using Profiles. By doing this you will be generating a different output URL for each Region, this will allow you to control the graphics independently when loading them in vMix. To do so, follow the steps below:
Select the Region and Create the Tags you want to use. Do this on each region you want to control.
Go to All Scenes and Add a Profile for each Region that has been tagged.
Grab the URLs for each profile and paste them in a notepad.
Getting the vMix configuration ready to work with the Panel
Once in vMix, add each of the profiles as a Web Browser Input. As a best practice go to the input settings and rename it.
For more information on how to add Viz Flowics to Vmix see: Integrating Graphics with VMIX.
Configuring the Control Panel
The connection of the panel to vMix is done automatically if vMix is open and running in the same computer.
If you open the panel first and then vMix, you will need to click on the Connect to vMix button in the panel. Once the button switches the color from red to green the connection is ready.
When vMix and the Panel Control are in different locations
Creating input buttons
These buttons will allow us to activate the graphics in Preview or Program. To create them follow the steps below:
(1) Click on EDIT. An Infobox menu in a pop-up screen will be shown.
(2) Right-click on the canvas Panel to add an object.
(3) Add a New Clear Button.
(4) Click on the question mark.
(5) Select Overlay.
From all the options available we are going to use two:
OverlayInput1: To send the selected Input to the Program.
PreviewOverlayInput1: To send the selected Input to Preview.
Let's pick the OverlayInput1 to create the button that will control the keying of the LOGO in Program.
(6) Use the Input field to assign the Input in vMix, for this example we choose LOGO from the dropdown
Name the button
Then repeat all the steps to create the button for the Preview. Just remember to select in the overlay PreviewOverlayInput1.
This is how it looks when you have the 2 buttons created:
Controlling the input and output of the Overlay
In addition to the output URLs, other information that we need is the Graphics Token and the number assigned to each Overlay that we want to control.
Generate the Graphics Token
(1) To obtain the Graphics Token we have to click on All Scenes.
(2) Generate the Token.
Once you have it generated, copy and save it:
Node ID
Get the node ID of each of the elements that you want to control. To do this, click on the desired Overlay and the node ID will appear at the end of the URL in the browser.
For example, in the case of this Lower third, the node ID is n26 as shown in the URL below.
Using the Viz Flowics API
Use a specific command to do the Trigger. If you want to learn more about it please visit Graphics Control API.
The command that we are going to use is:
curl -H "Content-Type:application/json" -X PUT -d "[{\"id\":\"node ID\",\"transition\":\"toggle\"}]" https://api.flowics.com/graphics/YOUR-GRAPHICS-TOKEN/control/overlays/transition
(7) Back in the Panel, add a new Clear Button, click on the question mark and select the last option Launch External App and when the Pop Up window appears we push cancel.
(8) In the Value field paste the API command that defines the node ID and token.
(9) Assign a name to the button.
Once you have the panel ready to control if the Overlay goes to Preview or Program and to do the Trigger, you can test it directly in vMix.
You could have a Panel to control different regions and overlays.
