Motion System
Motion System lets you use motion design elements from the Figma plugin's System tab. Create a Motion System and manage the system itself in the web dashboard. For an existing system, use the plugin to add or edit supported items and apply them to your Figma work. Detailed preset creation happens in Lottie Creator.
Create a Motion System and manage the system itself in the Motion System web dashboard. For an existing system, use the plugin to add, edit, and publish supported colors, easings, fonts, and assets, then apply them to your Figma work.
If you've used color styles or variables in a Figma design system, Motion System extends the same idea to animation work. Named colors, font styles, easing curves, presets, and shared assets become reusable items you can apply to selected Figma layers or use when preparing animation previews.
Motion System does not replace the plugin's export formats. Files prepared with a motion system can still be downloaded through the export formats available in the plugin, such as Lottie JSON, dotLottie, and MOV.
In this chapter
Motion System basics — concepts: what's a system, what's a section, what's an item, and how drafts and publishing work.
Editing sections — adding, modifying, and organizing the design items inside a system.
Motion System panel controls — UI reference.
When to use Motion System
You're shipping multiple Lotties that should share a visual language (brand colors, signature easing curves).
You want to apply shared colors and font styles to Figma layers without recreating them per file.
You want to prepare selected frames or prototype flows with a shared easing curve or motion preset.
You want reusable collection assets that can be inserted from the plugin.
Related
Workspace — Motion Systems are saved to the workspace; that's where they're discoverable across team members.
Choosing an output format — Motion System work can still use the plugin's existing download formats.