← BACK

In Studio, a scene is a segment of a demo that represents or controls a single sequence or action that the user experiences during the demo. Collectively, they provide structure and unity to your demo and determine its flow.

 

Note: Scenes that exclusively perform logic to control how assets and transitions are handled never appear on the screen. They are referred to as Logic-Only scenes.

In addition to Logic-Only scenes, there are two more special types of scenes that you can set in the Properties panel—Fist Scene and End Scene.

Below are additional details on each special type of scene and overall guidelines with tips on how to add scenes and structure your project most efficiently.

First and End Scenes

In a simple, on-rails demo, scenes transition sequentially from the scene set as the First Scene until the last scene set as the End Scene. The First Scene is typically the splash screen where you add the background music and set all counters for the entire demo. The End Scene is typically the end card, which may contain a set of buttons, such as Replay, Close, and a Call to Action.

By default, Studio automatically adds the first scene to your new project and sets it as the First Scene. You can have only one First Scene in a demo. This means that if you set another scene as the First Scene, this setting will be automatically cleared for the scene initially set as such. Depending on your design, however, you can have multiple End Scenes, one for each alternative flow.

  • It is a best practice to add a distinct Call to Action with your app branding to your end card video asset, especially for Facebook Ads.
  • Make sure the CTA video asset is a clean loop. If needed, see Video Editing Tips.
  • Don’t add a persistent CTA button to the end card with a CTA video asset.
  • The Close button is added to all projects by default. On iOS devices, you can choose whether to display it or not. For details, see iOS App Settings.

Logic-Only Scenes

These are reusable “backstage control scenes” that define advanced transition logic in your demo. Logic-only scenes do not appear on the screen and should not contain any assets or interactive elements. Instead, they typically include actions and events that are all executed as soon as the specified conditions are met. For details on using them, see Logic-Only Scenes.

Important: If you select the Logic Only checkbox in the Properties of a scene that has any media assets or visible layers added to it, they will be removed from the scene. You will not be able to undo this by clearing the checkbox.

In Path View, regular scenes that display media are typically shown with video assets and After Video transitions, while Logic-Only scenes never appear with any media assets and always have immediate transitions indicated by the Every Time label on the arrows.

Regular Scene Logic-Only Scene  
 
Working with Scenes

Scenes usually roughly correspond to the panels in your storyboard. It is common to add most of your core scenes to the project at once, especially the ones in the on-rails sections of your project. This will give you an idea of the overall sequence in your demo. If needed, you will create and fine-tune your Logic-Only scenes later.

The sections below outline the overall process and provide best-practice guidelines.

Adding Scenes

You add scenes to your project in the Scenes panel. For instructions, see Add Scenes

  • To facilitate the process, add as many scenes as you need and then rename them according to your storyboard. 
  • The order in which you add scenes defines the order in which they appear in this panel and in other places in Studio like drop-down lists.

    Note: To specify the order in which your scenes appear in the demo, you need to add transitions and gestures to them.

  • To change the order of the scenes in the panel, drag individual scenes up or down to the desired location in the list, and the scene order will be updated in the panel and throughout Studio.
  • If needed, to delete multiple scenes, use Shift+click and press Delete on your keyboard.

After you add all your core scenes, select the first and end scenes. Again, you will take care of your Logic-Only scenes later, if you need any.

Loop-Action Scene Sequences

Most on-rails projects, or on-rails parts of more sophisticated projects, follow the same loop-action overall sequence illustrated in the Kingdoms of Solitaire tutorial:

(First Scene) -> Loop 1 Scene -> Action 1 Scene -> Loop 2 Scene -> Action 2 Scene -> … -> (End Scene)

Loop scenes play continuously until the user interacts with the demo by using a gesture. Action scenes immediately show the results of the user interaction, execute all their actions, and automatically transition to the next scene in the project.

To make a loop, select the Looping checkbox in the video action menu of the selected scene.

 

Tip: Make sure assets in loop scenes are clean loops. If needed, see Video Editing Tips

 Adding Assets to Scenes

To all scenes that are expected to appear in the demo, you need to add assets. A scene may have multiple media assets, including multiple videos in some cases.

  • The easiest way to add assets is to drag their files all at once from the Finder to the Studio workspace. For step-by-step instructions, see Add Assets to Scenes.
  • To add more than one video asset to the same scene, use the Add an Action drop-down list in the Actions & Events panel and select Play Video
  • In most cases, keep the default On Enter setting for all media assets, which means the assets will play immediately upon the transition to their scene.
  • Only in some cases, you may need to specify the At Time or On Exit events for certain assets and actions in their respective action blocks in the Actions & Events panel.  
  • To replace an asset in a scene, just drag another one to the canvas. You can also click the respective action block and select a different asset in the drop-down list in the media action menu.

Defining Transitions and Logic

To define transitions in your project, add the appropriate gestures to all loop scenes and scene-to-scene transitions to all action scenes. To learn more about them, see transitions and gestures. For instructions, see Add Transitions and Add Gestures.

You can preview scenes, their transitions, and video assets in Path View. Click any scene to view its contents and properties in the respective side panels.

In most cases, only after you lay out your high-level demo outline, it’s time to define its logic for more sophisticated projects. Most on-rails projects will be complete at this point and will not require advanced logic.

To provide a more engaging and interactive experience for the user, you may want to create sophisticated flow with alternate flows that enable variable outcome for the user. You can do this with advanced transitions that are created with the help of triggers, counters, their conditionals, and logic-only scenes. For details, see Advanced Transitions and Logic-Only Scenes.

Updated June 10, 2019