Build a Presenter Interface for Operators

Last updated 28 July 2026

How to build a Presenter interface for operators

The Presenter is a designated area in the Node Editor that provides a simplified, operator-friendly control surface. Place UI nodes (buttons, lists, sliders) inside it, and operators can interact with your show logic without ever seeing the full node graph.

Before you start

  • A Backstage project with at least one graph in the Node Editor
  • At least one Sequence configured (so the Presenter has something to control)
  • Familiarity with adding nodes in the Node Editor (right-click to open the node menu)

Steps

1. Create the Presenter area

Open the Node Editor and navigate to the graph where your show logic lives. In the Node top bar select Presenter > Create. A semi-transparent rectangular area appears in the center of the view. This is your Presenter.

Drag the bottom right edge of the Presenter rectangle to resize it. Drag the interior to reposition it. All nodes whose top-left corner falls inside this area will be shown in the Presenter view.

2. Add UI nodes

Right-click outside the Presenter area and add one or more UI nodes from the UI category, they usually come in most handy in presenters. Backstage provides five UI node types:

  • UI:Button — clickable icon buttons for triggering actions (play, stop, next step)

  • UI:List — a selectable list or radio button group for choosing from a set of options

  • UI:Slider — a horizontal or vertical slider for adjusting numeric values (brightness, volume, speed)

  • UI:AssetViewer — a live preview of a video or image asset, with a click output for interaction

  • UI:WebPresenter — an embedded HTML page with interactive elements (sliders, color pickers, buttons) and dynamic input/output pins

Position the nodes inside the Presenter rectangle. Any node that falls within the Presenter boundaries is included in real time.

3. Configure each UI node

Click the expand button in the top right corner of a UI node to expand it and reveal its settings. In expanded mode, you can configure labels, colors, entries, and behavior. Collapse the node again by double-clicking the header. The collapsed view is what operators will see in the Presenter.

Design for the collapsed view. Operators see nodes in their compact form. Set clear labels, use distinct colors, and choose meaningful icons so the interface is self-explanatory.

4. Connect UI nodes to show logic

Wire the outputs of your UI nodes to the nodes that control playback. For example:

  • Connect a UI:Button's Index output to a Sequence:SequenceCommander to trigger play, stop, or jump commands.

  • Connect a UI:List's Entry Idx output to a Sequence:Stepper's step input to let operators select which show segment to play.

  • Connect a UI:Slider's Value output to a Sequence:Properties node to control volume or opacity in real time.

The control nodes (SequenceCommander, Stepper, Properties, etc.) can live outside the Presenter area. Only the UI nodes that operators need to interact with should be inside it.

5. Customize the Presenter appearance

Open the Presenter context from the top bar to access appearance options. Use the Background color picker to set a solid background.

6. Open the Presenter window

Go to View > Presenter in the menu bar. A submenu lists every graph that has a Presenter area. Click a graph name to open its Presenter as a standalone, dockable window. This window shows only the nodes inside the Presenter rectangle — no wires, no grid, no node headers.

The Presenter window can be docked alongside other Backstage panels, or undocked and moved to a separate monitor for the operator.

7. Access from Backstage Viewer

Backstage Viewer is a separate client application that connects to a running Backstage instance over the network. When connected, it shows the Backstage interface. The integrator can build a custom interface for the Operator, to get as much or little information as they need, you can close all but the created Presenter Window. This lets operators interact with the show from a dedicated workstation without access to the full Backstage UI.

When a user profile is done for the operator, you can press 0815 after clicking anywhere in the client interface, and the topbar will be hidden, press the combination again to show it again. This prevents users from changing the layout after you are done to avoid accidental interactions.

Common Mistakes

  • Nodes not appearing in the Presenter — The node’s top-left corner must be inside the Presenter rectangle. If a node is only partially overlapping, it may not be included. Move it fully inside the area.

  • Presenter is empty in the View menu — The Presenter must be created first via right-click > Presenter > Create in the Node Editor. The View > Presenter submenu only lists graphs that already have a Presenter area.

  • Operator sees node wiring and headers — Set a solid background color on the Presenter (right-click > Presenter > Background) to hide the graph canvas behind the UI nodes.

  • Button does nothing when clicked — The UI:Button must have its outputs connected to downstream nodes. Check that the Index, Label, or Activated output is wired to a control node.

Tips

  • A Button node can hold multiple entries (icon states). Each click advances to the next entry and emits its index. Use this for play/pause toggle buttons instead of two separate buttons.

  • The List node’s entries can be populated dynamically via the Set Entries Pack input. Send a Pack of strings to create entries on the fly, or a Pack of sub-Packs (label, index, tooltip, bgColor, textColor) for full control.

  • Use the Slider’s Store input (Int or Float) to update the slider position without triggering its output. This is useful for feedback loops where the slider reflects external state.

  • Keep control logic nodes (SequenceCommander, Stepper, etc.) outside the Presenter area. Only place the nodes that operators need to see and touch inside it.

  • Each graph can have its own Presenter. Use separate graphs for different operator roles (e.g., one for the lighting operator, another for the video operator) and open them as independent Presenter windows.

Your First Graph — Learn the basics of working with the Node Editor.

Build a Multi-Step Show — Use Steppers to create multi-step show sequences controlled from a Presenter.

Trigger Playback via UDP — Combine Presenter UI with external UDP triggers for hybrid control.

Node Editor — Full reference for the Node Editor window.

[USER-ACTION-REQUIRED: Attach a screenshot of the Node Editor with a Presenter area containing UI nodes here]