Editor

Animation & video

Animate layers in and out, set page durations and transitions, add video and audio, and export MP4 or GIF.

On this page

Animating layers#

Select a layer and open the Animate tab. Add one or more animations, each with a phase:

  • In — plays when the page appears.
  • Out — plays before the page ends.
  • Loop — repeats while the page is visible.

Presets: fade, rise, drop, slide left, slide right, zoom in, zoom out, pop, rotate, wipe, typewriter (text), pulse, float, shake and blur in. Each animation has a start time and duration in milliseconds and an easing curve: linear, ease, ease-in, ease-out, ease-in-out or spring.

Press Preview to play the current page with its animations.

The agent can animate for you: "stagger the three features in with a rise, 100 ms apart".

Pages as scenes#

In video and presentation designs, each page is a scene with:

  • a duration — how long the page plays (or auto-advances in a presentation);
  • a transition into the next page — none, fade, slide, push, zoom or dissolve — with its own duration.

Video and audio#

Drop a video file onto a page to add a video layer. Set its trim start and end, volume, mute and loop, a poster image, fit (fill, fit or crop) and corner radius. Audio layers add a soundtrack or voice-over with start time, trim, volume and fade in/out.

Video and audio follow the page timeline: a page's video plays when that page is shown.

Exporting motion#

Export animated designs as MP4 or GIF from the export dialog (Pro). Choose the pages, the frame rate and the resolution. MP4 keeps audio; GIF does not support audio. Rendering happens on the server, so you can close the dialog and pick up the file later in the export list. See export.

AI video clip generation is available on Pro and self-hosted installations with a video-capable provider; see asset tools.

Popular pages

QuickstartGet started
Keyboard shortcutsEditor
The agentAI
Docker Compose quickstartSelf-hosting
Configuration referenceSelf-hosting
Agent API (v1)Developers