Skip to main content

Setting Up Player Images in FUSE

Learn how to set up player images in FUSE, from exposing Rive image slots to configuring player variables, image templates, and testing.

Overview

Player images allow you to display team roster photos within FUSE graphics. This guide covers setting up player variables for dropdown selection, creating image slots exposed from Rive files, defining image templates (300×300), and linking player image data through the competition theme — enabling dynamic player photo display during live broadcasts.


Prerequisites

Before you begin, make sure you have the following in place:


• Access to the FUSE graphics editor


• A Rive file with exposed image slots for player photos


• Player roster data with image URLs configured in the LIGR platform


• A competition theme with player image templates set up


Step-by-Step Guide

1. Start by setting up the Rive file with image slots. In your Rive design file, create image placeholders for player photos. These slots need to be exposed so FUSE can access and populate them with data. Each image slot should be named descriptively (e.g., playerImage, playerPhoto) for easy reference in expressions.


[SCREENSHOT: the Rive design file showing an exposed image slot named for a player photo, e.g. "playerImage"]


2. Next, add a Player control variable in FUSE. In the FUSE editor, navigate to the Control Variables panel and add a new variable of type Player. This creates a dropdown selector in the Control Room that lists all players from the team roster.


3. With the variable in place, create player data expressions to bind player information to your graphic elements. The player.data object provides access to all player information, and for images specifically, you should use the player image URL expression to link the Rive image slot to the selected player's photo.


4. Now configure the image template in the competition theme. In the competition theme settings, set up an image template with 300×300 pixel dimensions for player photos. This template defines how player images are processed and sized before being displayed in the graphic.


5. Once configured, test the player image display in the FUSE preview by selecting different players from the dropdown to verify that player images load correctly. Check that the image sizing and positioning look correct within the Rive graphic.


[SCREENSHOT: the FUSE preview panel with the Player dropdown open and a selected player's image displayed on the graphic]


6. Finally, publish and verify in the Control Room. Publish the graphic and assign it to a test event, then in the Control Room confirm that the player dropdown shows the full roster and that selecting a player loads their image correctly.


Key Points

• Player images are pulled from the roster data — ensure all players have image URLs assigned in the platform


• The 300×300 image template is the recommended size for player headshots in most graphic layouts


• Image slots in Rive must be explicitly exposed for FUSE to populate them — unexposed slots will remain blank


• Use the competition theme to manage image templates centrally — changes apply to all graphics using that theme


• If a player has no image, the graphic will display a blank space unless you configure a default/fallback image


Did this answer your question?