/w=32,quality=90,fit=scale-down){kind=logo}
/w=256,quality=90,fit=scale-down)
Getting started
System Requirements
Rendering
Vectary Dashboard
Account Settings
Roles
User Interface
Scene Orientation
How To Get HelpImporting
/w=3840,quality=90,fit=scale-down)
Import formats
Figma frames import /w=3840,quality=90,fit=scale-down)
CAD filesDesign process
Design mode
Materials and Textures
Animated Materials/w=3840,quality=90,fit=scale-down)
Decals
UV mapping
Camera
Lighting and Environment
Effects
Background
Ground plane
Control Bar/w=3840,quality=90,fit=scale-down)
Libraries
Edit mode3D Configurator
Floating UI
Hotspots/w=3840,quality=90,fit=scale-down)
Interactions/w=3840,quality=90,fit=scale-down)
Animations
VariantsScene and project settings
Version History/w=3840,quality=90,fit=scale-down)
Augmented Reality (WebAR)
WebXR (beta)
Loading screen
Mouse controls
Interaction prompt
Menu - SettingsSharing, exporting, embedding
Sharing/w=3840,quality=90,fit=scale-down)
Performance analyzer
Optimizing a shared project/w=3840,quality=90,fit=scale-down)
Project cloning
Embedding to other software
Export optionsOther
Figma Plugin - Vectary 3D Studio Lite
2D to 3D
Adding comments
Object Editing
Left bar 
ShortcutsModel API
/w=3840,quality=90,fit=scale-down)
Introduction/w=3840,quality=90,fit=scale-down)
Quick Start
Events & Listeners/w=3840,quality=90,fit=scale-down)
Floating UI Configurators/w=3840,quality=90,fit=scale-down)
EcommerceAnimations
Creating Animation can be done from the Animate mode
Animations are a new tool for achieving professional-level motion in the scene. It is possible to add multiple animations (timelines) to the project. Each animation can be separately controlled in the Interact mode.
Timeline
Is a graphical representation of changes in time. These changes result in a set of motions that we call Animation.
At the moment, animations can be recorded for the following parameters:
Transformation:
- Position
- Rotation
- Scale
Each keyframe contains a set of keyframes for each parameter used:
Tabs
Create different animations in different tabs. Each tab is a separate animation with its own timeline, the tabs are not linked.
What are the different tabs for?
- Interact mode allows you to activate different animations, which makes it possible to create interesting scenarios.
- To try different animation options in the design process.
Keyframe
Key frame is a definition of a parameter in time. In the Animate mode, keyframes are created automatically with each change. Currently, you can only change the transformation parameters - position, rotation, and scale (independently for each axis). A keyframe can be moved in time by dragging it or changing its exact position in the input.
Keyframe interpolation defines motion between keyframes. Is selected on a keyframe and defines motion from the current to the next keyframe.
Keyframe interpolation types:
- Ease auto — achieves the smoothest animation. The motion is computed automatically between multiple keyframes
- Ease in & out — achieves smooth motion between 2 keyframes
- Ease in — motion starts slowly and stops instantly
- Ease out — motion starts immediately and stops slowly
- Linear — motion has no acceleration. It starts and stops instantly
- Constant — no motion. Value is changed at the moment when the next keyframe is reached
Select one or more keyframes to make an interpolation selection:
Playhead (CTI)
This is a graphical element that indicates the current position on the timeline.
Mark In and Mark Out
- Mark In defines the start of the animation.
- Mark Out defines the end of the animation.
- Both can be moved independently by dragging each end.
- Changing Mark In or Mark Out has no influence on keyframes inside of the animation. Keyframes outside this area simply won't play during animation playback.
Timeline scale
The timeline can be scaled by changing the value in the top right dropdown. Changing the scale has no effect on the animation playback speed. Changing the scale can be handy when working with fast or slow scenes.
Scale factors:
- 100% — 1 grid stop is 0.1s
- 10% — 1 grid step is 0.01s
- 1000% — 1 grid step is 1s
Playback type
Playback type defines how the animation is played.
Playback types:
- Single — animation is only played once and stops when the end is reached.
- Loop — animation is played indefinitely. When the end is reached, animation automatically starts again from the beginning.
- Ping-pong — animation is played indefinitely. When the end is reached, the animation plays backward.
Base state
Base state is the original transformation of the object defined in the Design mode. Each keyframe overwrites one or multiple transformation parameters from the base state. Parameters that are not overridden with keyframes will always reflect changes from the base state.
Import
Supported animation types:
- Transform animations (position, rotation, scale)
- Skeletal animations
Supported animation import formats:
- GLTF
- GLB
- FBX
Export
Animation export formats:
- GLTF
- GLB
Skeletal animations
Currently, skeletal animation can be imported. Bones can be manipulated and modified, allowing for the creation of animations, interactions, and transformations. However, creating bones from scratch and linking them to geometry is not yet supported, but this feature is planned for future implementation.
Shortcuts
For shortcuts to work, the cursor must be in the timeline area.
- Spacebar — animation plays from the current position or pauses.
- Enter — animation is played from the beginning
- Left — playhead is moved to the left
- Right — playhead is moved to the right
- Delete — to remove the keyframe