Quick Start Guide for Developers

Prerequisites

Before you begin, make sure you have:

A Flowics account with Editor access to a Graphics Package.
A Graphics Package that has been published.
At least one overlay with a Control API ID assigned.

Step 1 — Get Your Graphics Token

The Graphics Token acts as your API credential and is unique to each Graphics Package.

To generate a Graphics Token:

Open your Graphics Package in the Graphics Editor.
Publish the Graphics Package.
Open Workspace Settings from the top-right corner of the Remote Control interface.
Under API Token, click Generate Token.
Copy and save the generated token, as it will be required for all API requests.

Alternatively, see the article: Getting the Graphics Token.

Step 2 — List Your Overlays

Before controlling any graphics, you need to retrieve the IDs of the available overlays.

Request

GET https://api.flowics.com/graphics/{graphicsToken}/control/overlays

Replace {graphicsToken} with your Graphics Token.

Response

The response contains an array of overlays, including:

id – The overlay identifier.
integrationId – The integration identifier used for API control.

You will use these values in subsequent API calls.

Step 3 — Take an Overlay On Air

Request

PATCH https://api.flowics.com/graphics/{graphicsToken}/control/overlays

Request Body

[   {     "id": "YOUR_OVERLAY_ID",     "state": "in"   } ]

Notes

"state": "in" takes the overlay on air.
"state": "out" removes the overlay from air.

Step 4 — Update a Text Field

You can update the content of a text element before or during playout.

Request

PATCH https://api.flowics.com/graphics/{graphicsToken}/control/overlays

Request Body

[   {     "id": "YOUR_OVERLAY_ID",     "state": "in",     "controls": {       "YOUR_CONTROL_ID": {         "value": "John Smith"       }     }   } ]

Notes

YOUR_CONTROL_ID refers to the Control API ID assigned to the element in the Graphics Editor.

To find or assign a Control API ID:

Select the element in the Graphics Editor.
Open the Inspector panel.
Enable Show on Remote Control.
Assign a Control API ID.
Republish the Graphics Package.

Step 5 — Take an Overlay Off Air

Request

PATCH https://api.flowics.com/graphics/{graphicsToken}/control/overlays

Request Body

[   {     "id": "YOUR_OVERLAY_ID",     "state": "out"   } ]

Timing Recommendations

When updating content and triggering an overlay in quick succession, always add a short delay between the two actions.

Recommended Sequence

1. PATCH overlay with updated content (controls: {...}) 2. Wait 200–300 ms 3. PATCH overlay with state: "in"

Why?

Sending both requests simultaneously can create a race condition where the overlay briefly displays old content before the updated values are applied.

This is one of the most common issues in high-frequency API workflows.

Authentication

The Graphics Control API uses the Graphics Token embedded in the request URL.

No additional authentication headers are required.

If you are using a JSON Get Connector with header-based authentication for a data source, refer to:

JSON Get Connector – Header-Based Authentication

Common Errors

Error	Cause	Resolution
404 Not Found	Invalid Graphics Token or deleted Graphics Package	Verify the token in Workspace Settings and ensure the package still exists.
200 OK but nothing changes	Overlay is not active or the package was not published after recent changes	Publish the Graphics Package and verify the overlay state.
Old content briefly appears	Race condition between content update and trigger	Add a 200–300 ms delay between updating content and taking the overlay on air.
Integration ID not found	No Control API ID assigned to the element	Assign a Control API ID in the Graphics Editor and republish the package.