# Timeline vs state machines
Understand the difference between timeline-style Figma to Lottie export and interactive dotLottie state machines.

Most animation exports create a timeline: the animation starts, plays through time, loops or stops, and does not need user input to decide what happens next.

Interactive Figma exports are different. They can become a dotLottie state machine, where user input changes the state of the animation.

## Timeline-style animation

Timeline-style animation is best for:

- Loading animations.
- Success or error feedback.
- Logo loops.
- Simple UI transitions.
- Linear onboarding moments.

Preset, multi-frame, and most prototype flow exports behave like timeline-style animations. Prefer dotLottie for smaller files and modern playback; use Lottie JSON only if the destination requires legacy `lottie-web` compatibility.

## State-machine animation

State machines are best for:

- Buttons with hover and press states.
- Toggles.
- Interactive icons.
- Components that react to click, hover, press, or timed transitions.

State-machine behavior must be preserved in `.lottie`. Lottie JSON cannot carry state-machine interactivity, themes, or motion tokens.

## Designer mental model

Timeline animation is like a movie clip: press play and time moves forward.

A state machine is like a component variant system with rules: the animation can move between states when an input happens.

## Related

- [Exporting interactive state machines](/en/integrations/figma/04_figma-to-lottie/exporting-interactive-state-machines)
- [Choosing an output format](/en/integrations/figma/05_export-and-handoff/choosing-an-output-format)
- [Player controls](/en/integrations/figma/08_runtime-compatibility/player-controls)