Add motion to a visual design

Finish the static frame first

Motion magnifies layout problems. Confirm screenshot crops, text wrapping, spacing and layers before opening Motion. A viewer should understand the asset on a paused frame.

Animate the whole design or individual elements

1. 1Open Motion and choose Whole design when one motion style should choreograph the full composition, or select a layer to animate that item independently.
2. 2Choose a style from Choreography, Entrance, Ambient, Emphasis or Continuous. Use a subtle float for polish, a reveal for an introduction, or a stronger sequence for a launch moment.
3. 3Choose a Feel to set the strength and speed together. For an individual layer, Fine tune timing can add a start delay and choose Once or Loop; supported choreography styles can also animate the item out at the end.
4. 4Stagger related elements in a logical reading order: product, headline, proof and call to action. Reset an element to the canvas default when it no longer needs its own timing.
5. 5Preview the complete loop several times and remove any movement that distracts from the product screen.
6. 6Choose GIF for broad, simple looping playback or MP4 for smoother color and longer motion.

Avoid common motion export surprises

• A design needs actual motion before GIF or video is meaningful; add motion if the export panel sends you back to the Motion tab.
• Video elements must be exported as video. A still or GIF path cannot preserve a playing clip.
• Keep the export panel open while frames render. You can request cancellation, but closing mid-render discards the in-progress file, not the design.
• Inspect the downloaded loop for its first and last frames, text sharpness and file size at the real placement.