How to Export an Animation: GIF, WebM and MP4

Why and when to export

Exporting turns your project into a single shareable file — a GIF or a video — that plays anywhere, on any device, without FrameAnim. It is the final step that takes your animation out of the editor and into the world, whether that is a social post, a message to a friend, or a portfolio piece.

Export when the animation reads the way you want it to. Play the loop a few times, check the timing and spacing, and make sure the motion is clean. It is quick to export again, so there is no harm in exporting a test version, watching it back, and refining — but it saves time to get the animation right in the editor first.

GIF, WebM and MP4

FrameAnim exports to three formats, each with its own strengths:

• GIF — an animated image that loops automatically and is supported almost everywhere. Ideal for short loops, reactions and stickers. The trade-off is a limited colour range and larger files for longer animations.
• WebM — a modern video format that produces small files at good quality. Excellent for the web, though a few older applications do not support it.
• MP4 — the universal video format, playable on virtually every device and platform. The safest choice when you are not sure where the file will end up.

Choosing the right format

Match the format to where the animation is going:

• A looping clip for social or chat — GIF. It loops on its own and plays inline nearly everywhere.
• Embedding on a website — WebM for small, high-quality files; keep an MP4 as a fallback for older browsers.
• Maximum compatibility — MP4. When in doubt, it plays almost anywhere.
• Longer animations — a video format (WebM or MP4), which handles length far more efficiently than GIF.

Quality settings

FrameAnim offers Low, Medium and High quality. Higher quality preserves more detail and colour but produces a larger file; lower quality trades some fidelity for a smaller, faster download. Medium is a sensible default that balances the two. Reach for High when detail matters — a portfolio piece — and Low when file size is the priority, such as a quick share where speed beats crispness.

How FPS and size affect the file

Two project settings have a big impact on the exported file. Frame rate determines how many frames are packed into each second — a higher FPS looks smoother but means more frames and a larger file. Canvas size sets the pixel dimensions; a larger canvas produces a sharper, heavier file. If an export comes out larger than you want, lowering the quality, the frame rate, or the canvas size are all effective levers. The role of frame rate in how motion feels is covered in the timing and FPS guide.

How to export in FrameAnim

Exporting is a short, guided process:

1. 1
   Open the export dialog

   With your animation finished, open the Export dialog from the editor.
2. 2
   Preview the animation

   Use the built-in preview to play the animation back and confirm it looks the way you want before exporting.
3. 3
   Choose a format

   Select GIF for an animated image, or WebM or MP4 for video.
4. 4
   Choose a quality level

   Pick Low, Medium or High depending on whether you want a smaller file or the best-looking result.
5. 5
   Export and save

   Start the export, wait for the progress bar to finish, and the file downloads to your device.

The dialog also shows a summary of your animation — its dimensions, frame count, frame rate and total duration — so you can confirm everything is set correctly before you commit to the export.

Previewing before you export

The export dialog includes a preview player so you can watch the animation exactly as it will be rendered. Use it to play, pause and restart the loop, and to catch anything you want to fix — a hitch in the timing, a frame that lingers too long — before creating the file. Previewing first means fewer throwaway exports and a cleaner final result.

Troubleshooting

• The file is too large. Lower the quality, reduce the frame rate, shrink the canvas, or switch from GIF to a video format for longer animations.
• Colours look flatter in a GIF. GIF supports a limited palette. If colour fidelity matters, export as WebM or MP4 instead.
• An MP4 came out as WebM. On some browsers MP4 falls back to WebM, because export happens right in your browser. The video is fine; if you specifically need MP4, try a different browser or convert the file afterwards.
• The export seems slow. Longer animations and larger canvases take more time to render. The progress bar shows how far along it is — let it finish.

Sharing your animation

Once your file has downloaded, it is a standard GIF or video you can post, message, or embed anywhere. A finished, exported loop is also a great portfolio piece — if you have been working through the exercises, an exported bouncing ball or walk cycle is a perfect first share. Need more ideas to animate next? Browse the animation examples for your next project.