Knowledge Base > Sources & Filters > DVE/Animating Sources Tutorial

DVE/Animating Sources Tutorial

You can animate the way sources transition on and off scenes, composite them together, or have multiple effects run at once. In the wider world of video editing, these real-time animations are called Digital Video Effects (DVE). What used to be expensive stand-alone devices are now built-in to software, including OBS Studio.

You can create smooth animations when transitioning sources on and off, as in these examples:

An example of DVEs used at Smash Bros. tournament GENESIS 9 to slide in 2 player cameras and then slide them out to reveal the gameplay feed triggered using Companion to trigger both DVEs simultaneously. An example of a DVE (top right) used at Team Liquid's Race to World First to slide in a secondary gameplay capture and nameplate when the raid splits into two.

Getting started

1. Create a scene (we will call it the crop scene). The crop scene is the one that will be shown on other scenes. In the Scenes dock, click on the Filters button.

2. Add a Crop/Pad filter to the scene. Uncheck Relative, then specify the size you wish the scene to be under Width and Height. In this case, I want the crop scene to be square (1080 by 1080).

Animate a single source

1. Follow the steps in Getting started to create a new crop scene

3. In the scene that will be presented to the viewer, add a Scene source, selecting the crop scene.

4. Right-click on the position scene source, then set up the Show Transition and Hide Transition. This will be used to smoothly animate the contents of the crop scene when the crop scene source is shown/hidden.

Note: because the transitions will be contained within the bounds of the crop scene source, transitions such as Fade and Luma Wipe tend to look best here.

Animate a source in a scene

1. Follow the steps in Getting started to create a new crop scene

2. In another scene (which we will call the position scene), add a Scene source, selecting the crop scene. Position the crop scene source where you want it to appear.

3. In the scene that will be presented to the viewer, add a Scene source, selecting the position scene.

4. Right-click on the position scene source, then set up the Show Transition and Hide Transition. This will be used to smoothly animate the contents of the crop scene when the position scene source is shown/hidden.

Triggering the animation

To trigger the animations:

  • Click on the visibility button (eye icon) in the Sources dock
  • Set hotkeys in OBS Settings → Hotkeys for the crop/position source's visibility state
    • If you set the same hotkey for both showing and hiding, the hotkey functions as a toggle
Animating a single source
Animating a source within a scene