One browser source for the whole broadcast

Most people set PONNE Broadcast up the slow way first: one browser source per graphic — there are twenty of them — each sized by hand. It works, and then one source is 1600×900 while the rest are 1920×1080, the driver cam sits slightly too far left on stream but looks right in the Studio, and you spend a race night wondering which of you is lying.

There is one step instead.

Add one source

In OBS: + → Browser, and give it exactly this:

URL     http://localhost:4600/program.html
Width   1920
Height  1080

Then set the source's position to 0, 0 and leave its size alone. No scaling, no cropping, no stretching to fit.

That is the whole setup. Every graphic — timing tower, lower thirds, the battle graphic, pit ticker, race control, the stewards card, track map, start grid, results, championship standings, casters, the ticker, slates, moment banners, the replay wrapper and your decor layer — lives inside that one page, layered and positioned by PONNE.

Why one source and not twenty

• What the Studio shows is what streams. With per-source sizing, the Studio and OBS are two opinions about where things go. With one source there is only one.
• It is lighter. One Chromium page instead of twenty, on the machine that is also running iRacing.
• Nothing drifts. Add a graphic to the show later and it appears inside the source you already have. No new source, no re-sizing, no scene edits.

Match the numbers to your stream

The size of the browser source must match your output resolution, not your monitor:

If those disagree, OBS scales the page and your type goes soft. Check Settings → Video → Output (Scaled) Resolution and use that number.

Scene variants

Sometimes you want a scene with less on it — a clean camera shot with only the tower, say. Add the same URL with a filter on the end:

http://localhost:4600/program.html?only=timing-tower,lower-third
http://localhost:4600/program.html?skip=track-map

only= lists what you want; skip= lists what you don't. Everything else behaves exactly as it does in the full feed, so a variant scene never gets its own layout problems.

Common snags

The page is blank. PONNE Broadcast has to be running — the graphics are served by the app itself, so nothing answers on port 4600 without it. Start the app, then hit Refresh on the source.

Nothing is on air. The feed is deliberately empty until the console puts something up. Open the console, click a graphic in the ON AIR row, and it appears. A blank feed is the app being disciplined, not broken.

A scroll bar on stream. Set the source to exactly your output size at position 0,0. If it is a pixel or two smaller than the page, some versions of Streamlabs draw a scroller. (OBS Studio hides it; Streamlabs does not, which is how we found this.)

Port 4600 is taken. Another program has it, or a previous PONNE Broadcast is still running in the background. The app will tell you which; Task Manager settles the second case.

If you prefer the individual pages

They still work, and they are still there — http://localhost:4600/timing-tower.html and the rest. Use them if you want a graphic on a different scene from the others, or you are compositing in something that is not OBS. Everything in this guide applies to each of them; you just do it once per graphic.

If you run your own relay

PONNE's hosted relay is the default and needs no setup. If your league runs its own (tools/team-relay.mjs), know that a self-hosted relay fails open: it does not check that anybody has PONNE Broadcast access, and it cannot. Your room keys are the security — the spotter key is the director's authority, the follower key is a shared link, and only the viewer key is meant for strangers. The relay's own README says this at length, and it is worth reading before you hand the follower key to twenty people.