Timeline
Timeline is the interface that we will use when we create keyframes to make animations.
When a scene item is added to a playlist, it has 10 seconds duration as default.
Open Scene Designer, and you will notice Timeline is located at the bottom bar.
You can expand it by clicking on Timeline.
Total scene duration is displayed on the left side. In the screenshot below, it is 10 seconds.
Use the timeline view slider on the right to zoom in or out.
Creating Animations
To create animations, you will be using the animations tab.
When an element is selected, click on the animations tab from the right menu.
Click Add Animation.
Configure the animation type, start time, duration, etc.
Click Save. You can also edit and save after you create the animation.
You can add multiple animations.
Press PLAY button on the top right corner of the timeline to preview the animation.
Keyframes
For animating scene elements, we use keyframes. Keyframe is a special type of marker that contains a particular parameter setting for an element. For instance, a text's horizontal position (x) may have two different values at two different points on the timeline. This means that you have two keyframes, and the text will animate horizontally between two keyframes regarding their (x) value.
Keyframes appear on the timeline as dots. We will be explaining how to use them for animations below in Creating Animations section.
You can create custom animations by using formatting options. In the example below, we have created keyframes by changing position, text color, and text box fill color.
Note: Every value change on a different time point would create a new keyframe, forcing element to change its state from previous keyframe to the latest one.
Deleting a Keyframe
Right-click on the keyframe you want to delete.
Click Delete.
Warning: If you press delete key on the keyboard, it will delete the item, not the keyframe. This action can't be undone.
Animating Grouped Elements
When you would like to change position, size, opacity and radius of several elements at the same time, you can group them first.
Beware that grouping or ungrouping items deletes all keyframes of items. You will be warned before executing such actions. This action can't be undone.
Other Things to Note
Shortest animation duration is 100 milliseconds (0,1 second).
Duplicating an item will copy all keyframes of the original item to the duplicated one. Note: Duplicated item will spawn 30 pixels to the right and bottom of original one. If you want to make both items exactly same, you should adjust values on x and y accordingly (including time zero).
_______
Previous: 8.9 Timeline - Keyframes - Animations
_______