Hello World Branding

Prerequisites

Before we begin, the following prerequisites are required:

Access to Chameleon (flow login)
Chameleon Designer installed
Chameleon Web Server (player) installed
Chameleon Branding Player installed

The installers for the above are available here:

https://bannisterlake.com/dl/installs/Chameleon

Create a simple project

Launch the Designer.

We’ll use a directory something like d:\chameleon\ticker by the designer and player to store your graphics.

In the designer, open menu item Settings->Editor Settings…

Set the size of our ticker’s canvas using menu item Settings->Project Settings…

Enter flow credentials in menu item Settings->Flow Settings…

Duplicate something similar to this:

It's required to mark the graphic/scene as an asset.

To do this click on the gear icon of the graphic in the Graphic list. This will open the Edit Graphic dialogue box which contains the Asset checkbox.

Create an explicit dynamic tag by prefixing the text object with a ^. To do this click on the text item in the Object List. The first click will select the text object in the list and a second click will open the text object name for editing. We've also made the font black so it'll show up on white background browsers.

Implicit vs Explicit Tags

An explicit dynamic tag is one that must be defined when creating an asset as opposed to an implicit which is defined based on other data such as program schedule. Implicit tags have a strict naming rule while explicit tags only need a prefix of a ^.

Normally a timeline would be defined for the scene by clicking on the edit/pencil icon in the Graphic List but it can be skipped for our purposes.

Save the project.

Publish the project using the File→Publish... menu item:

Enter a Published name and then press the Publish button at the bottom of the dialogue.

Note: we are forced to give the project a publish name. I'm not convinced it's needed.

Flow

Log into flow.

Create a channel in flow using the Channel module in the Shared group

and then define players for the channels:

The IP Address and Port are for the Branding Player (and are not the same port as the Chameleon Web Server that ultimately displays the branding assets.)

Go back to the dashboard and click on Assets:

Click Add New:

Add an asset something like this:

Add a name
choose the Hello World project template from the template list
Check the Is Bug box
Provide a value for the Text box in the Explicit fields section

Chameleon Web Server (not Branding Player)

Open the web server. It’s a service so might be hidden in your tray. Create or update a player instance. Set the Flow to match your credentials:

Set the Server like this:

Note: since a server instance can play double duty with ticker support, we can define the show, project and rundown here. However, the show/project/rundown can be cleared by clicking the delete button when the show combo is focused.

And then set the project folder and API Endpoint Port in the Settings tab:

The Endpoint Port will be used by the Branding Player to connect to this web server to play it's assets. We are using port 8108 for this.

Note: make sure your project folder matches up to the project folder defined in the designer (in the case where they actually are supposed to match up). We're also enabling the api settings with a port of your choosing. This is the way the Branding Player communicates with the Web Server. Finally, the Endpoint under the Advanced sub-category is essential provides us the url we use in a browser. For localhost, if the Endpoint defined is "branding" then the url becomes localhost/branding.

Press the Start Server button:

Once started, the player shows us what the url is for our browser:

Web Browser

Open up any web browser in anticipation of the final product and go to the end point we defined in the Web Server which was localhost/branding:

Branding Player

Launch the branding player and choose yes to this dialog:

Login using your credentials to flow here:

Choose your channel here

This takes us to the main Branding Player window:

Define the chameleon port to allow the Branding Player to communicate with the Chameleon Web Server. This is done from the menu item File->Channel Preferences:

Press OK and we have our connection.

Now for the final step. Trigger the Hello World asset by pressing send after entering the command using the branding command format <#>. So the command should be <Hello World>:
Note that the name used in the command is case sensitive and so <hello world> would not work.

We're done!