Timeline positioning
An element can be moved on the timeline by clicking and dragging it to a new location. Similarly, an element's duration can be changed by dragging its edges.
As the example above shows, an element automatically snaps to nearby elements. When it snaps to the preceding element on the same track, its start is set to Auto, linking the two elements together, indicated by a chain link on the seam between the two bars. From that point on, the element always starts exactly where the preceding element ends, even when that element is moved or changes in length. When an element is dragged over a preceding element, a transition is inserted between the two.
Timeline indicators
Every bar in the timeline shows how its element is timed using a set of indicators. The icon at the left edge of a bar (or on the seam with the previous bar) relates to the element's start; the icons at the right edge relate to its duration:
| Icon | Mode | What it does |
|---|---|---|
| Auto start | The element starts exactly where the preceding element on its track ends, and moves along with it. The chain link is shown on the seam between the two bars. | |
| Auto duration | The element expands to fill the available time. | |
| Media duration | The element plays for the full length of its source clip. This applies to videos and audio. | |
| Fixed | The element is pinned. At the left edge, its start doesn't follow the elements before it: it starts at a set time, or it is anchored to the end of the scene (see End below). At the right edge, it lasts a set number of seconds. | |
| Share | The element takes a share of the scene's length, which is divided again on every render. See Dividing a scene evenly. | |
| Loop | The element repeats itself to fill its time. This icon is shown in front of the duration icon. |
When Creatomate detects a possible timing problem, the icon it relates to turns amber, like this: . For example, this happens when an element is set to start at a fixed time while placed behind a video whose length varies from render to render. When that video gets shorter, the pinned element stays where it is and leaves a gap of black frames, and when it gets longer, the two overlap. Click the icon to see what's going on and how to fix it. Here, the fix is to link the element to the video: drag it onto the video until it snaps, or set its start to Auto, and from then on it starts wherever the video ends.
Inspecting an element's timing
These indicators are clickable. Clicking one opens a popup that explains in plain words how the element is currently timed, and lets you change it right there. If a timing problem was detected, the popup also describes the issue and highlights the recommended setting.
- Start is a time in seconds, Auto to run right after the previous element on the track, or End to finish exactly when the scene ends. End suits an outro or a logo that should close the video, however long the rest of it turns out to be.
- Duration is a number of seconds, Auto to fill the available time, or, for video and audio, Media to play the whole clip. An element that takes a share of the scene shows Share here.
- Loop, for video and audio, repeats the clip to fill its time.
Dividing a scene evenly
Sometimes a row of elements should simply split the scene between them: photos shown over a voice-over whose length differs with every render, for example. Fixed durations would leave the photos too short or too long for the voice-over.
Right-click the name of the track and choose Distribute clips evenly, or use the Distribute all … clips evenly suggestion in the timing popup of any element on it. Every element on the track then gets an equal share of the scene and runs right after the one before it, so together they always fill the scene exactly. Their bars show the share icon on the right.
Shares are calculated over the whole track. When you add an element to the track later, distribute it again, so the new element gets its share as well.
The template's own duration is set in the properties panel instead: with nothing selected, it is in the Layout section, next to the template's size.