Animations
Last updated
Last updated
Vectary’s animation system is based on keyframes, allowing for precise control over object transformations within a structured timeline. The animation workflow is built around a timeline where keyframes define changes over time. To animate objects, switch to Animate mode.
The timeline is the primary interface for managing animations in Vectary. It provides a visual representation of keyframes along a linear time axis, allowing precise control over animation timing and transitions. The timeline enables to set, move, and edit keyframes, adjust interpolation, playback type, and structure animations efficiently.
The height of the timeline can be adjusted by dragging its edge to expand or contract the view
The timeline displays only two keyframes by default - the first and last - called Master Handlers.
All intermediate keyframes are contained within the master group and can be accessed by clicking the expand icon or double-clicking the grey line.
Dragging a Master Handler scales all keyframes proportionally
To record data into a keyframe, move the playhead to the desired position and transform the object on the canvas. Each transformation (position, rotation, scale) is automatically recorded into a keyframe at the playhead's position.
To overwrite an existing keyframe, position the playhead over the keyframe and modify the object's transformation. The new transformation values will replace the previous ones in that keyframe.
Keyframes can be moved individually or in groups. To select multiple keyframes, either hold Shift and click on them or drag with the left mouse button to select a range of keyframes.
Interpolation controls how animation transitions between keyframes.
To change interpolation, select at least one keyframe and choose the desired method.
Available interpolation types:
Ease Auto — Automatically adjusts smoothing for the best transition.
Ease In & Out — Starts slowly, accelerates, and then decelerates toward the end.
Ease In — Starts slowly and then moves at a constant rate.
Ease Out — Starts immediately and slows down toward the end.
Linear — Moves at a constant speed without acceleration.
Constant — Instantly switches states without transition.
Multiple tabs can be created above the timeline, each representing a separate animation with its own timeline.
Tabs can be rearranged by dragging them
Right-clicking on a tab opens a context menu with options to duplicate, delete, or invert the animation
Inverting reverses the order of keyframes, creating a mirrored animation
Each animation tab can be controlled individually using the Animation interaction
Tab can be renamed by double-clicking on it
The timeline scale controls the level of detail in the animation timeline:
100% — 1 grid step = 0.1s
10% — 1 grid step = 0.01s
1000% — 1 grid step = 1s
The playhead is a movable indicator that represents the current position within the animation timeline. It determines where new keyframes are recorded and serves as a reference point for editing animation sequences.
Moving the playhead allows previewing animation states at different points in time.
Any transformation applied to an object while the playhead is positioned on the timeline automatically creates or updates a keyframe.
The playhead can be dragged along the timeline to navigate through the animation.
Clicking on the timeline moves the playhead to that position.
Mark In and Mark Out define the playback range of an animation. This range determines which part of the animation is played, but it does not affect the placement or existence of keyframes - keyframes can exist outside the Mark In/Out range and remain unchanged.
Mark In defines the start of the animation.
Mark Out defines the end of the animation.
Both can be moved independently by dragging.
Adjusting Mark In/Out does not affect keyframes; keyframes outside this range simply won't play.
Double-click on Mark In/Out to snap to the first or last keyframe.
Hold Shift while dragging to scale the animation proportionally.
Defines how the animation plays back.
Single — Plays once and stops
The Base State represents the object's original transformation in Design Mode. Each keyframe modifies specific transformation parameters, but any parameters not animated will always follow the Base State.
GLTF
Transform animations (position, rotation, scale)
Skeletal animations
GLB
Transform animations (position, rotation, scale)
Skeletal animations
FBX
Transform animations (position, rotation, scale)
Skeletal animations
Skeletal animations can be imported. Bones can be manipulated and modified, allowing for animation, interaction, and transformation. However, creating bones from scratch and linking them to geometry is not yet supported but planned for future updates.
Formats that support animation export:
GLTF
GLB
USDZ
For shortcuts to function, the cursor must be in the timeline area.
Spacebar
Play/pause from the current position.
Enter
Play from the beginning.
Left Arrow
Move the playhead left.
Right Arrow
Move the playhead right.
Delete
Remove the selected keyframe.
Loop — Repeats continuously
Ping-pong — Plays forward, then reverses
