Before you start
Download your StreamSpell package, extract the ZIP or RAR file, and keep the package folders open while you work in OBS Studio.
Create the Social Media scene
- In OBS Studio, select the + button in Scenes, choose Add Scene, and name it Social Media.
- In Sources, add a Text (GDI+) source. Create four text sources for the social usernames you want to show.
- Open the Icons > Social Media folder in your StreamSpell package and drag the icons you want into OBS Studio.
- Select the icons, use Transform > Center to screen, then resize and position each icon beside its username.
Video tutorial
Build the Starting scene
- Create or select the Starting scene, then drag Screens > Starting.webm from the package into Sources.
- Open the media source properties and enable Loop.
- Add the Social Media scene as a Scene source, then resize and position it over the Starting screen.
Add the BRB and Offline scenes
- Repeat the Starting-scene process for the BRB and Offline scenes.
- Use the matching .webm file for each scene, enable Loop, and confirm that every scene is named correctly.
Configure the Intermission scene
- Create an Intermission scene and add the matching Intermission.webm file with Loop enabled.
- Add a Video Capture Device. Set Resolution/FPS Type to Custom and choose 1920 x 1080, then position the webcam below the Intermission overlay in Sources.
- Add Display Capture and drag any label icons you need from Icons > Label into Sources.
- For chat, copy your Streamlabs Chat Box URL, add a Browser source named Chatbox, paste the URL, and position it in the reserved chat area.
Set up the transition
- In Scene Transitions, add a Stinger transition and name it Transition.
- Browse to Transition > Transition.webm inside the package and select it.
- Preview the transition and adjust its timing. StreamSpell packages commonly use approximately 1000 to 1200 ms.
Build the Live scene
- Create a scene named Live. Add Webcam.webm, two copies of Overlayslot.webm, and the label icons you want to display.
- Open the properties for every .webm source and enable Loop.
- Add your Video Capture Device at 1920 x 1080, resize it, and place it below the overlay and game-capture layers in Sources.
- Arrange the sources so the webcam, game capture, labels, and overlays appear in the correct visual order.
Setup complete
Preview every scene, confirm that animated files loop, check the source order, and test the transition before going live.
Common problems
The animation stops
Open the media source properties and make sure Loop is enabled.
The webcam is hidden
Move the Video Capture Device below the overlay, but above any background layer, in Sources.
Chat does not appear
Copy the Chat Box URL again and confirm that it was pasted into an OBS Browser source.