The new scoreboard overlay for streaming

For some time we've provided a simple scoreboard overlay for streamers to include on their videos. Lot's of people have been using it, and valuable feedback has come our way. We decided to give the feature some more attention, and it has resulted in an overlay feature with an updated design and some other cool features coming.

The most important thing to know about the new scoreboard is the size of it (size matters..). The old scoreboard was very limited in both design and size. This was caused by the fact that the streaming software did not support transparency in web pages (the browser source could not display transparently), which limited the overlay feature to be only a certain amount of pixels tall to not cover the playing surface. In the new version we cover the whole area of the video, and can make use of transparency in the design, which let's us be a lot more creative with it's content.

Before explaining how you can start using it, here's a working example from a Norwegian tournament at Oslo Biljardsenter:

The scoreboard overlay coupled with scoreboard tablets at the venue

How to get going

Every venue/playing facility registered in our database has a certain number of tables installed. Those tables get their own ID in our database, and by providing us with that table ID, we can provide you with the correct match happening at the table at any given time. This means that once you've added the overlay to your stream, you can just leave it. No need to update whenever a new match is on, the overlay always know when a match is on or not.

1 - Get the table link

First of all, you need to get the correct table ID for the table you want to provide streaming for. By using the CueScore's search function (top menu) you should be able to find the venue hosting the event. In this example I'll be using "Oslo Biljardsenter" which is a venue in Oslo, Norway. You can also visit the tournament you are about to stream from, and click the venue link from there.

Once on the venue's page, (f.ex: Oslo Biljardsenter ) you will see there is a menu on that page. Click the menu option "Billard tables" to see tables available at the venue.

In the list of billiard tables you'll see the table number, table size, manufacturer and so on. One of the columns in that table has a header that says "Scoreboard overlay". Copy the link in that column to get the correct link for your table.

2 - Add a browser source in your streaming software

We recommend using the free streaming application OBS Studio (Open Broadcaster Software) when doing your live streams. Other software is fine too as long as the browser source extension supports transparency in webpages.

When setting up the scoreboard overlay you need to add it to the "sources" list as a "browser" source. Open the dialog to add it, paste the link from step one, then set the preferred size of the webpage. This last step is important as it will define how big/small the overlay will appear on the resulting video. If you plan to broadcast in full HD, you should set the width and height of the browser source to 1920x1080 pixels. For 720p you enter 1280x720 and so on. The overlay is intended to cover the whole area of your video source, so be sure to enter values that correspond to the video output size. You can of course mix and match this as you see fit, but you should know what size you are streaming (sending to youtube or whatever) and keep it the same size for the best result.

Adding a browser source in OBS Studio

3 - How it works (and when)

If you've set this up properly you should see tournament and match information (see example image) in OBS now. If not, the tournament or match might not have started or been created yet. Make sure the tournament exists and that the match you want to stream is set up to use the same table as you've just set up in the streaming software. Important things to check if nothing comes up is the dates of the tournament, the status of the match (must be "playing" (blue)), and that the correct table number has been selected for it.

If you can see tournament information, but not the match you were anticipating, don't worry. The match will not be visible until it actually starts. The scoreboard overlay keeps track of this by itself, and will show the match scoreboard once the match has been started by the tournament manager.

Once the match is finished, the match scoreboard will disappear (fade out) and only the tournament information will be shown (top left). At this time (between matches) you can expect to see results from other matches, info about what is the next match and so on, based on what the tournament manager enter into the system. More on this later as this is currently under development.

4 - What information is shown

We include a bit more information than we had on the previous scoreboard, and the content is divided into two main sections. The top left section, and the center bottom section.

In the top left section you'll find:

• Logo of the organizer (or CueScore logo for private tournaments)
• Tournament date (from - to)
• Tournament name
• Venue name
• Discipline

In the center bottom section (the actual scoreboard), you'll find:

• Player A and B names
• Profile images of both players, and their nationality flag
• Score player A and B (well, duh..)
• Table number
• Race to length
• Round
• Innings and average for both players for disciplines where this is relevant

Both sections also include the color selected as main color for the organization if selected (if not, it will be a grey gradient).

5 - Language support

You can get the scoreboard in any of the languages we currently support. The default language is english, and to override the language you'll have to add a "lang=" parameter to the URL (from step 1).

This is the scoreboard URL for table 1 at CueScore headquarters:
https://cuescore.com/scoreboard/overlay/?tableId=1167880

To get the scoreboard in Norwegian, I'll have to add the parameter mentioned, like this:
https://cuescore.com/scoreboard/overlay/?tableId=1167880&lang=nb

For your convenience, here's a list of codes for languages we support as of today. Replace "nb" with the code for your language in the scoreboard URL:

5 - What's next?

The scoreboard overlay has some cool features planned. Connected with the scoreboard for tablets application, we will have the ability to show statistical information about the match in between frames or after the match, we can show results from other matches appearing in the overlay at certain times (when other matches finish f.ex). If you have any ideas on what kind of information would be cool to see, please don't hesitate to get in touch!