Glider documentation
Design broadcast graphics in the browser, or have an AI agent build them, wire them to live data and play them to air. Every panel, component and API, explained.
Build with an AI agent Connect Claude Code, Cursor Agent or Codex to Glider’s MCP server, then describe the graphic you want. The agent asks, builds, wires and rehearses it.Getting Started
- What is Glider A browser-based broadcast graphics system: design scenes, wire them to live data, play them to air.
- Installation & Setup Get Glider running locally, with the database, ports and optional hardware in place.
- Your First Page Build a lower-third that reads live data and plays to air, end to end.
The Editor
- Workspace Layout Panes, tabs and docks — how the editor screen is put together and how to rearrange it.
- Menu Bar The application menu: page lifecycle, logic sections and units, binder and the logger.
- Scene Panel The left column: what is on air, the scene list, control panels, and the component tree.
- Canvas The design surface: navigation, selection, transform, snapping and ordering.
- Inspector The property editor for the current selection, section by section.
- Editor Tabs Reference Every kind of tab that can open in the centre workspace.
- Theme & Design Tokens The editor's visual system and how to restyle it.
- Settings Every adjustable option, where it is stored, and who it affects.
Building Graphics
- Components The nine graphic component types and the six control widget types.
- Media Images, video, Lottie and audio: sourcing, playback and transport.
- Groups & Repeaters Nesting components, and stamping a group once per item in an array.
- Anchors & Colliders Pin edges to other items or to the canvas with arrows, and keep items from overlapping with colliders.
- PSD Import Bring a layered Photoshop design in as components — and send it back out.
- Fonts & Assets The page file store: uploads, folders, fonts and the limits that apply.
Data
- Page Data The JSON the page owns, and the store it becomes at runtime.
- Variables Typed values, lists and key–value maps the operator edits live — with sorting and reordering that animates on air.
- Binder The pick surface that connects component inputs to page data, live feeds and sheets.
- Data Feeds Bring live data in over an HTTP poll, a WebSocket or a webhook push — JSON, XML or text — and fold it into the store.
- Sheets Spreadsheets as a data source: import, edit, calculate, format and bind.
- Secrets Server-only credentials for pollers and data feeds.
Logic
- Units Declarative behaviours — clocks, counters, tickers, formatters, watch rules and data feeds — that write to the store.
- Reactions & Triggers When this happens, do that — the page's only rule primitive, plus the per-clip triggers in the timeline.
- Control Panels Operator surfaces built from widgets, bound to page data, never sent to air.
Animation
- Animation Timeline The bottom-dock timeline: workflows, clips, targets, channels and keyframes.
- Clips & Phases In, Run and Out — the broadcast clip model, and how clips are scheduled.
- Animation Presets Reusing motion instead of re-keyframing it.
- Playback & Triggering Getting animations to run — by hand, by button, by rule, or from the rundown.
Playout & On Air
- Rundown Playlists, preview and program — the operator's running order.
- Multiview Every graphic scene as a card, vMix-style: route scenes to Program or an overlay, play their animations, and set colour, keying and position per scene.
- Output & Live View The clean render at /view/<pageId>, and the in-editor Output tab.
- Audio Mixer A master bus and one strip per audio plate in the scene.
- Inputs · NDI · OMT · SRT · RTMP · SDI · Capture Bring live video into Glider — NDI with alpha, OMT, SRT, RTMP pushed from an encoder or pulled from a server, DeckLink SDI, and this computer's screens and app windows — like vMix inputs, and show it with a Feed component.
- Outputs · NDI · SRT · RTMP · External Send a page out of Glider itself — NDI with alpha, SRT, RTMP streaming, DeckLink SDI fill and key, or full screen on a display — like vMix's Outputs, Stream and External Output.
- Remote Control Drive Glider from Bitfocus Companion, a vision mixer or a show controller over a vMix-style TCP API, OSC or HTTP.
- Stream Deck An Elgato Stream Deck as a hardware control surface for any page.
- Pre-flight Checks The deterministic validators that stand between a page and the air.
Glider Agentic
Automation & API
- HTTP API Everything the editor can do, Glider can do over HTTP.
- OpenAPI & Swagger The generated spec and the interactive explorer at /api-docs.
- MCP Server Glider Agentic: the tools Cursor, Claude Code and Codex use to build graphics.
- Sessions & Sharing Live state for a page that is not saved, and handing a page to someone else.