PRISM Live Studio

PRISM Live Studio shows your elements with a Web (Browser) source: a source that displays a web page, here a small file the app keeps on your PC. The app gives you the file and the steps, and it takes about a minute.

PRISM Live Studio on Linux

PRISM Live Studio runs on Windows and macOS only. On Linux, use OBS Studio: the app adds elements to it for you.

Note

Menu names in PRISM Live Studio can differ slightly between versions. If a name doesn’t match exactly, look for the closest one.

Open the PRISM guide in the app

Already picked Something else when you first opened Stream UI Fun Studio? Skip to step 3.

1. Click your channel name at the top right of the app. If you haven’t set up your channel yet, it says Set up your channel. The Your channel panel opens.

   

2. Scroll down to What do you stream with?, click Something else, then click Save. You only do this once: the app remembers it.

   

   OBS Studio is picked in this picture. Click Something else instead.

3. In Elements, click the element you want. It opens in the editor, where you can customize it first.

4. Click Add to my stream (1), at the bottom right of the editor.

   

5. The Add it to your stream window opens on Streamlabs Desktop, the first app in the list. That’s normal: it does this every time. In the list of apps on the left (1), click PRISM Live Studio.

   

Use OBS Studio too?

OBS Studio stays at the top of the list. Its Set it up automatically button still adds elements to OBS for you.

Copy the path and note the size

The top of the guide shows The file for a browser source (Local file):

• Click Copy path (1). The button says Copied for a moment, and the path is ready to paste.
• Note the size (2), shown next to Show in folder, for example Size 1000 × 340. You’ll type it into PRISM in a moment.

Each element has its own path and size. This one is YouTube Subscribe Bar.

Keep this window open while you work in PRISM, so you can check the steps and the size.

Add it in PRISM Live Studio

These are the app’s four steps, with a little more detail.

1. In PRISM Live Studio, pick the scene you want the element in. Click + in the Sources list and choose Web (Browser). If PRISM asks for a name, use the element’s name so it’s easy to find later.

2. In the source’s settings, turn on Local file and paste the path you copied. If there’s a Browse button, click it, click in the File name box of the window that opens, press Ctrl + Vin the window that opens press Cmd + Shift + G, press Cmd + V, press Returnin the window that opens press Ctrl + L, press Ctrl + V and click Open. The path ends in index.html.

3. Set Width and Height to the size shown in the app (for example 1000 and 340), then confirm.

4. Position the source on your scene. Drag its corners to make it bigger or smaller.

The element plays once as soon as the source loads, so you may just catch it sliding in and out. That’s a good sign: it works.

The file has everything the element needs, so Stream UI Fun Studio doesn’t have to be open while you stream. Open it when you want to change the element, and it updates the file for you.

Leave the file where it is

Don’t move, rename or delete the file or its folder. PRISM reads the element from there, and the app updates it there when you make changes.

Full-screen elements

Elements that are 1920 × 1080, like YouTube Channel Intro and YouTube End Screen, cover the whole scene on a 1920 × 1080 canvas. Set Width 1920 and Height 1080.

How it plays in PRISM

• It plays once each time the source loads: when you add it, when PRISM Live Studio starts, and when you refresh the source.
• Between plays, the source is see-through. After the animation it disappears, so an “empty” source is normal. Elements that stay on screen, like Socials Bar, animate in and then stay.
• There’s no repeat timer here. Play it again every and Play when the scene becomes visible are options of the automatic Add to OBS dialog, which only works with OBS Studio. The PRISM guide doesn’t set them.
• Also added it to OBS with the app? Then OBS and PRISM use the same file, so the play settings you picked in Add to OBS come along. A Play it again every time repeats the element in PRISM too, and Play when the scene becomes visible may make it play when you switch to its scene. To keep them apart, add a copy to PRISM instead. Make the copy before you add the element to OBS: a copy starts with the play settings of the element it’s made from.
• It doesn’t react to follows or subs. Free elements are animations you play on cue, not alerts. How elements play explains this in more detail.

Make it play when you want (optional)

PRISM Live Studio is built on OBS Studio, so its web source settings may include the same options as an OBS browser source:

• Refresh browser when scene becomes active: the element plays every time you switch to its scene.
• Shutdown source when not visible: the element plays every time you show the source (the eye icon next to it).

If your version doesn’t have them, refresh the source to play the element again.

Update it after you change something

You don’t need to copy the path again. When you change the element (or your channel name or picture), the app updates the file at the same path within a couple of seconds. PRISM keeps showing the old version until the source reloads:

1. Make your changes in the app’s editor.

2. In PRISM Live Studio, open the source’s settings and use its refresh button. Restarting PRISM works too.

3. The element plays again with your changes.

Caution

A refresh plays the element. If you refresh while you’re live and the source is in your live scene, your viewers see it play.

Want two versions of the same element, like a Light one and a Dark one? Make a copy. Each copy has its own path, so you can add both.

Test it before you go live

1. In PRISM Live Studio, switch to the scene with the element.

2. Open the source’s settings and use its refresh button. Watch the element play once.

3. Check that it’s the right size and in the right spot.

Happy with it? Don’t refresh the source again while that scene is live.

If something looks wrong

• The source stays empty. It probably already played. Refresh the source and watch it.
• PRISM shows a blank page or an error. Check that Local file is on and that the path ends in index.html.
• It’s cut off or the wrong size. Set Width and Height to exactly the size shown in the guide.
• Copy path didn’t work. The app says “Couldn’t copy. Select the text and press Ctrl+C instead.” Click in the path box, press Ctrl + ACmd + A, then Ctrl + CCmd + C.

More fixes are in Troubleshooting.

Next steps

How elements playWhen an element plays, and when it doesn't.

Test your elementsMore checks, mostly for OBS.

Customize an elementChange the text, colors and pictures.

Pick your streaming appGuides for the other apps.