Aethera Overlay Studio Docs

Design, publish, and operate secure browser-source overlays.

All tools

Broadcast overlays

Aethera Overlay Studio

Build versioned layouts from Replay, VTT, Voice, chat, and live-control state, then run them as transparent, OBS-friendly browser sources.

Open Overlay Studio Changelog

Overview

Overlay Studio is Aethera’s visual broadcast layer. You design a layout in the authenticated editor, publish a version, and give OBS a scoped browser-source URL. The source can render public-safe data from a linked Replay session, VTT, Voice, chat, or the Studio’s live controls.

  • The project stores the draft layout, canvas, linkage, and published version history.
  • The published layouts form a version history. Each browser-source token stays pinned to the published version it was issued for.
  • The live state carries operator updates such as scene, goal, lower third, and break.
  • The browser-source token grants one scoped runtime access path without your login cookie.

OBS WebSocket and an Aethera account inside OBS are not required. The browser source uses its own scoped bearer token and receives only the overlay’s sanitized runtime projection.

Quick start

  1. Open Overlay Studio and sign in if prompted.
  2. Enter a project name and choose Live tabletop, Intermission, or Vertical as the starter template.
  3. Optionally enter a Replay session ID. Linking enables Replay-driven widgets and the live Mark Moment control.
  4. Create the overlay, add or select widgets, and arrange them on the designer canvas.
  5. Choose Save draft, then Publish.
  6. Select Create browser-source URL and copy the complete URL into an OBS Browser source.
  7. Use Open live preview before going live, then send a test alert and try the live controls.

Projects and publishing

Choose a starter

  • Live tabletop starts with a landscape layout for active session information.
  • Intermission starts with a layout suited to a break or holding screen.
  • Vertical starts with a portrait canvas for vertical video workflows.

A template is only a starting point. Once the project exists, its draft can be changed without affecting the last published version.

Draft versus published

  • Save draft persists the current widget layout for later editing.
  • Publish saves the draft and creates a new versioned layout. Existing browser-source tokens stay on their assigned version instead of changing during a broadcast.
  • Open live preview shows the runtime result. If no source URL exists in the current editor session, Studio creates one first.
  • Duplicate creates a separate copy of the project for a variant or rehearsal.

To promote a new design to OBS, save and publish it, then rotate the existing browser-source token or create a new URL and update the OBS source. Publishing alone does not retarget an existing URL.

Designer and widgets

Select a widget on the canvas or in the layer list. Drag it for fast placement, or use the inspector for exact X, Y, width, height, text, type, and visibility values. Duplicate makes an offset copy; Delete removes the selected widget from the draft.

The Safe area toggle shows or hides the framing guide in the editor. It does not add a visible border to the published browser source.

Session and VTT widgets

  • session title, current scene or chapter, session goal, and moment marked,
  • party roster, character card, initiative order, current turn, and safe scene preview,
  • recent rolls, critical-roll alert, now playing or ambience, and active speaker.

Broadcast and layout widgets

  • lower third, break screen, countdown, progress bar, custom text, and media panel,
  • stream chat, QR or link panel, membership alert, and follow or platform-event alert.

Legacy cash-tip alerts are retired. Membership and follow widgets can be designed and tested, but real live alerts require the corresponding platform event stream; Studio does not invent those events.

Browser source and OBS

  1. Publish the project.
  2. Select Create browser-source URL. Studio displays the URL and attempts to copy it.
  3. In OBS, add a new Browser source.
  4. Paste the complete URL, including its #token=... fragment.
  5. Set the Browser source width and height to the project’s canvas dimensions shown in Studio.
  6. Open the live preview and compare it with OBS before starting the broadcast.

The runtime page has a transparent background and no editor chrome. It loads the published layout version pinned to its token, gets a no-store snapshot, and listens for authorized live-state updates. No OBS plugin or WebSocket connection is required.

Treat the complete browser-source URL like a stream key. Anyone who has an active copy can load that project’s sanitized overlay output until the token expires, rotates, or is revoked.

Browser-source token security

Browser-source URLs use a token in the URL fragment rather than the query string. The fragment is not sent as part of the initial page request; the runtime reads it locally and sends it in an Authorization: Bearer header for its snapshot and event stream. The raw token is shown only when it is created or rotated and is not stored in recoverable form.

  • Rotate replaces a token, pins the replacement to the project’s current published version, copies a new URL, and stops already-connected sources from continuing with the old token. Update the OBS source with the new URL.
  • Revoke permanently disables that token. Use it for an unused source or any URL that may have leaked.
  • The token list shows status, creation time, and last use without revealing old raw token values.

Rotating or revoking is intentionally disruptive: old previews and OBS sources lose access. Confirm that the replacement URL is saved in OBS before a production that needs it.

Live control

Live controls update runtime state without reopening the designer. Fill only the fields you want to change, then choose Push live state.

  • Active scene changes the overlay’s current scene identifier.
  • Session goal updates goal or objective widgets.
  • Lower third pushes visible lower-third text.
  • Break state starts or ends the intermission state.
  • Send test alert sends a safe test event to exercise alert presentation.

If the project is linked to Replay, Mark Moment creates a participant-visible Replay marker at the current session offset, tags it as an Overlay Studio moment, and marks it as a clip candidate. Choose a descriptive label and marker type before sending it.

Project lifecycle

  • Duplicate creates an independent project with its own draft, publication, and future source tokens.
  • Archive preserves the project but blocks new runtime loads and stops connected browser sources until the project is restored through an authorized workflow.
  • Delete soft-deletes the project, stops connected sources, and revokes its active tokens. Restoring the project does not revive old OBS URLs.

Archive and Delete affect the overlay project, not its linked Replay session, VTT campaign, or media.

Privacy and current limits

  • The editor requires normal Aethera authentication and project-control permission.
  • The browser source does not use or receive your normal Aethera sign-in cookie.
  • Runtime snapshots contain a sanitized public projection, not raw Replay events, hidden VTT state, private Voice events, stream credentials, or browser-source token records.
  • URL-like widget fields accept public HTTPS resources or narrow same-origin static asset paths; unsafe, local, private-network, script, and data-HTML URLs are discarded.
  • A linked Replay session supplies only data the overlay is allowed to expose. Linking an ID does not override session, VTT, or Voice permissions.
  • Project edits, publishing, token actions, live controls, and test alerts are audited.

Troubleshooting

The OBS source is blank or reports that access ended

Confirm the project is published and active, then check the token status. Paste the complete URL with its fragment into OBS. If the token was rotated or revoked, replace the old OBS URL with the newly created one.

A designer change does not appear in OBS

Choose Save draft and then Publish. Designer changes are intentionally isolated from the last published layout. After publishing, rotate the existing token or create a new browser-source URL and replace the old URL in OBS; existing tokens remain pinned to their earlier version.

The overlay is cropped or scaled incorrectly

Match the OBS Browser source width and height to the project canvas dimensions shown in the project list. Check the preview before adjusting widget positions to compensate for an OBS size mismatch.

Mark Moment is unavailable or fails

The project must be linked to a Replay session, and your account must be allowed to create markers for that session. Create a linked project or correct the Replay session ID.

A real membership or follow alert never arrives

Test events prove the visual path only. Real alerts require a corresponding configured platform event stream. Cash-tip events are retired and are not a live Overlay Studio source.

Resources