Resource icon

Animated captions with OBS controller and a preview function 1.0.1

General description
More templates added - infographics starter pack which can be used in live news TV reports.
  • Horizontal bar charts for displaying up to four items and their percentages
  • Pie chart kit. You can display one, two or three pie charts on one screen
  • Comparison graph showing percentage distribution between two items
All templates are cloud-based and available without any installation.

Here is a link to the control panel for running the graphics -

https://gfxpro.tv/animPacks/infograph_packs/infographStarterPack/controls.html

A display link for OBS/Vmix or just for preview can be found at the bottom of the Control panel page. Paste this link in the OBS Browser source input and you’re ready to go.

Adding the control panel as an OBS dock is simple: Docks=>Custom Browser Docks menu. Please use Browser/OBS switch to conform the control panel view to the OBS styling. Alternatively, you can control your animation from your computer/phone Chrome browser.

All graphics are also compatible with vMix, although you can't add the control panel to vMix interface.

Animation in details

Three templates available - horisontal bar charts, pies charts, comparison graph. Use "select your graphic" dropdown in the control panel to pick the one you need

Horizontal bar charts

With this animation, you can illustrate a story with the percentage data for up to four subjects.

1651671572955.png


You can choose how many items you show. Just keep the percentage at 0 in the control panel for the unwanted item and it'll be hidden.

What you can customise:
  • Of course the percent.
  • Headline and items names/description
  • Colours
Pie charts set
This one is a kit of three pie charts. You can youse all three of one/two.

1651672570196.png


To exclude a pie chart from the sceene just keep the relevant percentage at 0.

Customisation options:
  • Percent
  • Headline and items description
  • Up, down or no arrow
  • Pie charts colours
Comparison graph

This one is useful to compare the shares of two items.

1651673113199.png


Pretty straightforward one.

You can customise:
  • Percentage
  • Headline and description
  • Colours
To avoid clashing between the graphics we apply play in/out rules so if you play the graphic in while another one is onscreen, the existing one will be automatically played out first.

Please feel free to add your comments/suggestions to the discussion board.

As the next step we're looking at the option of uploading your own images to use with the animation templates.
  • Like
Reactions: jaymcdonough
General description
New graphics added - starter pack for football game broadcasting.
  • Score + live timing tile to be displayed at the top left corner of the screen
  • Game event animation - a goal or a card
  • Substitution graphics
It’s all cloud-based and you don’t need to download and install anything.
The Control panel for running the graphics is here - https://gfxpro.tv/animPacks/sport_packs/football_starter_pack/controls.html
And a display link with the actual animation is generated at the bottom of the Control panel page. Paste this link in the OBS Browser source input and you’re ready to go.

You can add the control panel as an OBS dock via Docks=>Custom Browser Docks menu. Use Browser/OBS switch to conform the control panel view to the OBS styling. Alternatively, you can control your animation from your computer or phone Chrome browser.

These graphics are also compatible with vMix.

Animation in details

Score/live timing

This animation is designed to stay on screen during the whole game showing the score and live timing. In this graphic you can customise:
  • The teams’ names. It’s advised to use short three characters long names.
  • Teams’ colours
  • Score
  • Game start time in HH:MM format. That will start the time count. For the second half add a break time (15 mins usually) to the actual game start time

1648138247082.png


Game event
This is a graphic to illustrate some event in a game - a goal scored or yellow/red card received for example.
Customisation options:
  • Team one name
  • Team one score or a number of cards
  • Team two names
  • Team two score/number of cards
  • A player’s name who scored or got a card
  • Team to which this player belongs (selection of team1/team2)
  • The event name. What actually happened - GOAL, RED CARD etc.
  • Teams’ colours
You can also use this graphic to remind your viewers about some stats of the game. If you skip the player’s name field in the control panel form you can just tell what’s the stats in a certain game event.

1648138803503.png


Substitution
The name speaks for itself here. This one is designed to show the subs in the match.
You can specify:
  • Name of a player coming out
  • His number
  • Going in player’s name
  • His number
  • Team name
  • Is it team one or team two. This will display the correct colour.
1648139156276.png


There’s some play in / playout logic implemented: if there’s a graphic on-screen and you play in the next one, the current one automatically animates out. So the animations will not clash with each other.

We hope you’ll find it useful.

And if you have your design that you want to turn into customisable web graphics, please get in touch via the discussion board. We can turn your After Effects artwork into web-based animation.

As the next step, we plan to introduce some infographics animation - bar graphs, line charts, etc.
We've released a server version of our plugin.

Here is the link to the web control panel:

Now you don't need to install anything locally. You can use the control panel to control the animation in a browser outside OBS or drop it into OBS as usual. Use a preview link for the browser source.

You can also use a phone as a controller,

If you use this web control panel within the OBS, please use Browser/OBS switch at the top of the dashboard.

New templates are coming soon. We're working on a football broadcasting templates kit - scores, subs, etc. So stay tuned.

If you have a suggestion for the types of templates you'd like to see - please post your idea on a discussion board.
  • Like
Reactions: paedlorida
Top