Storyboard
Last updated
Last updated
Storyboard is the core area of the Video to Playable, used to construct and manage the logic structure of single-threaded or multi-threaded interactive videos. Through the storyboard, you can:
Create and manage multiple scenes (video nodes and end cards);
Add Interactive Elements such as Freeze, Loop, or Auto Redirection, to implement the scene transition logic;
Design single-branch or multi-branch interactive flows to meet the needs of complex interactive video production.
Building the framework of the interactive video with the storyboard can be divided into three main steps: building the script structure, adding videos and end pages, and setting the transition logic.
Open the interactive video editing page and enter the storyboard area.
By default, the storyboard will have an initial video node. You can either start editing this node directly or add more nodes as needed.
Add new nodes:
Click the "+" button of the video node to add a new child node under the current node.
Shortcut keys: Enter — Add a sibling node. Tab — Add a child node.
Click the "+End Card" button to add an End Card under the current node.
The initial video node can be copied and pasted, but it cannot be deleted.
Newly added video nodes/end pages can be copied, pasted, or deleted.
Note: Deleting a higher-level node will also delete all associated lower-level nodes.
If the interactive flow is multi-branch, the storyboard will display connections labeled "1", "2", or more numbers. Clicking on any node will show the full video flow for that node.
Once the script structure is built, you can upload videos to the corresponding nodes and set the transition logic between the nodes.
In the storyboard, you can upload videos via the following methods:
Upload from local device
Upload from the Asset Library: Select a previously uploaded video from "My Assets"
Upload videos to "Project Video", then add them to the specific node.
Video upload requirements: MP4, <3M
You can add an End Card to a video node in the storyboard as the end page for that scene.
The End Card is the final video screen and can only link to another node. It does not support linking out (i.e., no videos can follow the end page).
The End Card by default includes four elements: product Icon, product name, CTA button, and background overlay. These elements can be adjusted as needed.
In the storyboard, you can add interactive elements between video nodes to define the play order and transition logic of the videos.
There are two types of node transitions: Auto Redirection and Interactive Redirection.
Auto Redirection: After the current video ends, it automatically redirects to the next video.
Interactive Redirection: After the current video ends, the user must interact to proceed to the next video.
Interactive redirection supports two types: Freeze or Loop (Note: "Hold" interaction is not supported between nodes).
Freeze: Added to the last frame of the video, the user must interact (e.g., press or swipe) to continue the video.
Loop: By default, added to the entire video, the video will loop within this element's time frame until the user interacts.
After selecting the type, you need to set the interactive Click Area and Gesture (event) in the parameter area on the right. The user's actions in different areas will determine which video scene to jump to (For more detailed explanation of parameter settings, please refer to [Track Area] 👉 4. Add and Edit Interactive Elements).
In the interactive elements section of the storyboard, right-click to quickly switch interaction types.
For the function intro of the [Package Size Estimation], it is basically the same as the Content Editor. You can directly jump to refer 👉 Package Size Estimation
