A television graphic has two jobs: communicate clearly and appear at the right time with the right information. A beautifully animated lower third fails if it hides captions, truncates a name or displays yesterday's score. Build the workflow around readable output, validated data and an operator who can remove a mistake immediately.
Start with the delivery specification and the message
Confirm the program's canvas size, frame rate, scan format, color space and SDR/HDR requirements. Identify whether graphics will be rendered inside the production software, delivered as files with transparency, or sent to a switcher as separate signals. A PNG, a browser overlay and a broadcast graphics output are not interchangeable handoff formats.
Decide what the viewer needs to know at that moment. A lower third might identify one speaker and role. A score graphic needs teams, score, period and a reliable relationship to the event. A full-screen explanation can hold more information, but should still have a clear reading order.
Define field limits and fallback behavior before animation. Use realistic long names, punctuation, accented characters and translated roles in testing. A character count does not guarantee fit: wide letters, font substitutions and different scripts change the rendered width. Prefer an editorially approved short form over shrinking every difficult name until it becomes unreadable.
Safe areas protect placement, not legibility
EBU R 095, version 1.1 covers 16:9 television production intended for 16:9 presentation. It specifies 3.5 percent action-safe and 5 percent graphics-safe margins at each edge, with format-specific pixel and line definitions in the full recommendation PDF. Read the destination's delivery requirements as well; these margins do not automatically solve vertical crops, social-player controls or caption placement.
Reserve space for captions and other required overlays deliberately. A graphic can be within the safe area and still collide with captions, a channel mark or a player's controls. Test the combined output, including captions in their supported positions, instead of approving each layer in isolation.
Check text against bright, dark and changing footage. A restrained opaque backing often holds up better than relying on a thin shadow over arbitrary video. Use sufficient size and weight, avoid information encoded only by color, and give the audience time to read. Preview the final encoded and scaled result on a television and a small display; a sharp design monitor can conceal compression or scaling problems.
Know what carries the image and what controls its visibility
Swipe the table sideways, or focus it and use the arrow keys.
| Method | How it works | Practical check |
|---|---|---|
| File with alpha | Color and transparency are carried in a supported image or video format. | Confirm codec, alpha interpretation, edges and animation playback in the receiving system. |
| Key and fill | One synchronized signal supplies the graphic's color; another supplies the visibility matte. | Match timing, routing, format and the switcher's key settings. |
| Browser overlay | A rendered web page becomes a source in production software. | Canvas size, transparency, fonts, data loading, permissions and reload behavior. |
| Color key | A chosen color is removed to reveal the underlying picture. | Edge quality and whether that color also occurs in wanted graphic elements. |
Straight and premultiplied alpha represent edge color differently. A mismatch can produce dark or pale fringes around otherwise correct text. Inspect the overlay on contrasting backgrounds and use the exporting application's and receiving system's documented settings. Do not compensate for a format mismatch by permanently distorting the artwork.
OBS Browser Source documentation describes local-file and URL inputs, viewport dimensions, transparent default styling and options to unload or refresh a source. Set those options deliberately: a reload can restart animation or data fetching. Match the viewport to the template design rather than accepting an unrelated default size.
For connected templates, restrict page permissions to what the graphic needs, load data from an approved source and keep credentials out of public URLs. Render supplied names as text rather than executable markup. A missing network request should produce a planned fallback, not a blank name paired with an old role.
A fictional rundown makes the approval process concrete
The fictional graphics rundown CSV contains three invented cues. It is an editorial worksheet, not an import file guaranteed to work in a particular graphics system. Its “approved” field describes a rehearsal scenario; replace the sample information and conduct a real review before use.
- G001: Maya Chen, “Coastal engineer,” approved for a six-second lower third in the fictional rehearsal.
- G002: Luis Ortega, “Project coordinator,” held because approval is missing.
- G003: A blank person name with the role “Guest,” held because a required field is empty.
Require a unique cue ID, the correct template, all required fields and explicit approval. Tie revisions to that ID so the operator can distinguish a correction from a new cue. Do not send G002 or G003 to air just because a file was successfully parsed.
For live scores or financial figures, add source timestamps, update rules, range checks and an expiry policy. Decide whether stale data should be removed, marked as unavailable or replaced by a neutral graphic. Plausible-looking old information can be worse than an obvious absence. A passing syntax check says nothing about whether a name, title or number is true.
AI can draft short versions of labels, create fictional test cases or help write validation code. Have a person verify names, roles, facts and the final visible text. Keep approved source data separate from generated suggestions, and never let an AI inference silently fill a missing live score.
Preview the exact cue, then control its life on air
Use a visible sequence: prepare, validate, preview, approve, take, monitor and remove. The OBS Studio Mode overview explains preparing scenes before transitioning them to the live program. Still test shared sources: changing data in an object used by both preview and program can affect the live result. Two preview windows do not by themselves create isolated data copies.
- Preview the exact cue and revision with representative underlying video and captions.
- Have the designated reviewer confirm spelling, fit, source and timing.
- Take the cue on the agreed signal; monitor the program output rather than only the editor.
- Remove it when its purpose is complete. Verify the out-animation and clear control.
- Rehearse a lost data connection, a missing font and an incorrect cue. Keep a tested clear-all or clean-scene fallback accessible.
Keep the last approved template and a local neutral fallback available, with a documented recovery procedure. Test the final recording or downstream feed because the production preview does not reveal every encoding or delivery issue. The graphics preflight checklist covers output, data, captions and recovery without prescribing one production package.
Related: AI in television production, television delivery over IP, and the Television category.