Templates overview

Lumora's content model has two layers: templates and graphics. Understanding the distinction is the most important concept in the product, because almost every other piece of the UI references one or the other.

What is a template?

A template is a reusable design. The artwork, animation, and layout that defines how a graphic looks. Templates are built once (or bought from the Template Library, or commissioned from a designer) and stored in your workspace's template list. They have placeholders for the bits that change at show time: a name, a score, a logo, a row of stats.

A template by itself never goes on-air. It's a blueprint.

Lumora supports three template formats, each suited to different needs:

• OGraf. The EBU's open standard for broadcast graphics. Best for designers who want a structured, declarative format with clean separation between design and runtime data.
• Lottie. JSON-based animation files exported from After Effects via Bodymovin. Best when the design is animation-heavy and was authored in After Effects.
• CG-SDK. Lumora's own HTML/CSS/JS template format. Best for fully custom logic, like graphics that need to fetch data, react to inputs, or do anything beyond what a declarative format allows.

See Uploading a template for the import process for each.

What is a graphic?

A graphic is an instance of a template, configured for a specific use. The same lower-third template might back twenty different graphics, one per guest you'll introduce during the show. Each graphic has its own:

• Title. A short label for the operator to find it in the rundown.
• Field values. The actual content (host name, role, sponsor logo URL).
• Channel and z-index. Where on-air it goes, and how it stacks against other live graphics.
• Per-graphic settings. Auto-out timers, channel locks, named actions.

A graphic is what you actually take on-air with the Take button or the HTTP API.

The relationship in one line

Templates are the design. Graphics are the things you take on-air.

If you change a template, every graphic built from it inherits the change the next time it's loaded.

Why the distinction matters

• Build once, reuse many times. Design a single sponsor lower-third template, instantiate it as a graphic for each of the six sponsors in the show.
• Operator workflow stays simple. The operator works with named graphics ("Sponsor: Acme", "Lower-third: Host"), not raw templates. The mental model is "pick a graphic, fire it" rather than "configure a template every time."
• Templates can be versioned and re-used across workspaces. Buying a template from the Template Library gives you the design; you'll instantiate your own graphics from it.

Where each lives in the UI

• Templates are managed in Settings → Assets → User Templates.
• Graphics are managed in the main rundown, on the left sidebar of the control panel. Click Add Graphic to instantiate a new one from any template you have access to.