User Guide Cancel

Export graphics and videos with Animate

  1. Adobe Animate User Guide
  2. Introduction to Animate
    1. What's New in Animate
    2. Visual Glossary
    3. Animate system requirements
    4. Animate keyboard shortcuts
    5. Work with Multiple File Types in Animate
  3. Animation
    1. Animation basics in Animate
    2. How to use frames and keyframes in Animate
    3. Frame-by-frame animation in Animate
    4. How to work with classic tween animation in Animate
    5. Brush Tool
    6. Motion Guide
    7. Motion tween and ActionScript 3.0
    8. About Motion Tween Animation
    9. Motion tween animations
    10. Creating a Motion tween animation
    11. Using property keyframes
    12. Animate position with a tween
    13. How to edit motion tweens using Motion Editor
    14. Editing the motion path of a tween animation
    15. Manipulating motion tweens
    16. Adding custom eases
    17. Creating and applying Motion presets
    18. Setting up animation tween spans
    19. Working with Motion tweens saved as XML files
    20. Motion tweens vs Classic tweens
    21. Shape tweening
    22. Using Bone tool animation in Animate
    23. Work with character rigging in Animate
    24. How to use mask layers in Adobe Animate
    25. How to work with scenes in Animate
  4. Interactivity
    1. How to create buttons with Animate
    2. Convert Animate projects to other document type formats
    3. Create and publish HTML5 Canvas documents in Animate
    4. Add interactivity with code snippets in Animate
    5. Creating custom HTML5 Components
    6. Using Components in HTML5 Canvas
    7. Creating custom Components: Examples
    8. Code Snippets for custom Components
    9. Best practices - Advertising with Animate
    10. Virtual Reality authoring and publishing
  5. Workspace and workflow
    1. Creating and managing Paint brushes
    2. Using Google fonts in HTML5 Canvas documents
    3. Using Creative Cloud Libraries and Adobe Animate
    4. Use the Stage and Tools panel for Animate
    5. Animate workflow and workspace
    6. Using web fonts in HTML5 Canvas documents
    7. Timelines and ActionScript
    8. Working with multiple timelines
    9. Set preferences
    10. Using Animate authoring panels
    11. Create timeline layers with Animate
    12. Export animations for mobile apps and game engines
    13. Moving and copying objects
    14. Templates
    15. Find and Replace in Animate
    16. Undo, redo, and the History panel
    17. Keyboard shortcuts
    18. How to use the timeline in Animate
    19. Creating HTML extensions
    20. Optimization options for Images and Animated GIFs
    21. Export settings for Images and GIFs
    22. Assets Panel in Animate
  6. Multimedia and Video
    1. Transforming and combining graphic objects in Animate
    2. Creating and working with symbol instances in Animate
    3. Image Trace
    4. How to use sound in Adobe Animate
    5. Exporting SVG files
    6. Create video files for use in Animate
    7. How to add a video in Animate
    8. Draw and create objects with Animate
    9. Reshape lines and shapes
    10. Strokes, fills, and gradients with Animate CC
    11. Working with Adobe Premiere Pro and After Effects
    12. Color Panels in Animate CC
    13. Opening Flash CS6 files with Animate
    14. Work with classic text in Animate
    15. Placing artwork into Animate
    16. Imported bitmaps in Animate
    17. 3D graphics
    18. Working with symbols in Animate
    19. Draw lines & shapes with Adobe Animate
    20. Work with the libraries in Animate
    21. Exporting Sounds
    22. Selecting objects in Animate CC
    23. Working with Illustrator AI files in Animate
    24. Applying blend modes
    25. Arranging objects
    26. Automating tasks with the Commands menu
    27. Multilanguage text
    28. Using camera in Animate
    29. Graphic filters
    30. Sound and ActionScript
    31. Drawing preferences
    32. Drawing with the Pen tool
  7. Platforms
    1. Convert Animate projects to other document type formats
    2. Custom Platform Support
    3. Create and publish HTML5 Canvas documents in Animate
    4. Creating and publishing a WebGL document
    5. How to package applications for AIR for iOS
    6. Publishing AIR for Android applications
    7. Publishing for Adobe AIR for desktop
    8. ActionScript publish settings
    9. Best practices - Organizing ActionScript in an application
    10. How to use ActionScript with Animate
    11. Accessibility in the Animate workspace
    12. Writing and managing scripts
    13. Enabling Support for Custom Platforms
    14. Custom Platform Support Overview
    15. Working with Custom Platform Support Plug-in
    16. Debugging ActionScript 3.0
    17. Enabling Support for Custom Platforms
  8. Exporting and Publishing
    1. How to export files from Animate CC
    2. OAM publishing
    3. Exporting SVG files
    4. Export graphics and videos with Animate
    5. Publishing AS3 documents
    6. Export animations for mobile apps and game engines
    7. Exporting Sounds
    8. Best practices - Tips for creating content for mobile devices
    9. Best practices - Video conventions
    10. Best practices - SWF application authoring guidelines
    11. Best practices - Structuring FLA files
    12. Best Practices to optimize FLA files for Animate
    13. ActionScript publish settings
    14. Specify publish settings for Animate
    15. Exporting projector files
    16. Export Images and Animated GIFs
    17. HTML publishing templates
    18. Working with Adobe Premiere Pro and After Effects
    19. Quick share and publish your animations
  9. Troubleshooting
    1. Fixed issues
    2. Known issues

 

Export App Preferences

You can switch between expert and novice preferences.  You can also export your own app settings including tool bar setting, key board shortcuts and other application settings as a single file.  Taking your app preferences across devices as simple as export and importing a file.

Export app preferences

Export preference
Export Preference – export all or select saved settings to take it to other machines or with others

Exporting images and graphics

PNG sequence

You can export a series of image files from an individual movie clip, button, or graphic symbol in the Library or on the Stage. During export, Animate (formerly Flash Professional) creates a separate image file for each frame in the symbol. If you export from the Stage, any transformations (for example, scaling) you have applied to the symbol instance are preserved in the image output.

To export a PNG sequence:

  1. Select a single movie clip, button, or graphic symbol in the Library or the Stage.

  2. Right click it and choose Export PNG Sequence.

  3. In the Save As dialog, choose a location for the output and click OK.

     

  4. In the Export PNG Sequence dialog, set your desired options. 

    Width - The width of the image output. You can scale the output by changing this value. The default is the width of the symbol content.

    Height - The height of the image output. You can scale the output by changing this value. The default is the height of the symbol content.

    Resolution - The resolution of the image output. The default is 72 dpi.

    Colors - The bit depth of the image output. You can select 8, 24, or 32 bit. The default is 32 bit, which supports transparency. If you select 24 bit or 8 bit, which do not support transparency, the Background setting changes to Stage. See below.

    Background - The color to use as the background color for the image output. This setting is only available when the Colors option is set to 8 bit or 24 bit. When Colors is set to 32 bit, the image background is always transparent. When the Colors option is set to 8 bit or 24 bit, the Backgroundoption defaults to the Stage color. With 8 bit or 24 bit images, you can change the setting to Opaque and then select a background color from the color picker. Alternatively, choose an alpha value for the background to create transparency.

    Smooth - Toggles whether to apply smoothing to the edges of the image output. Turn off this option if you are not using a transparent background and images placed on a background color are different from the current color of the Stage.

  5. Click Export to export the PNG sequence.

Export animated GIF

You can export animated GIF files in Animate by performing the following steps: 

  1. Go to File > Export > Export Animated GIF

    A dialog appears. 

  2. Choose your desired options in the dialog and click Done to export your animation as animated GIF file. 

    You can also export static GIF image file by choosing File > Export > Export Image.

Export images and graphics to CC library

To export your images or graphics to CC library, select Window > CC library

CC libraries window appears. 

Click the + icon at the lower-left corner of the CC Libraries window, select the images or graphic files, and click Add.

FXG graphic interchange format (deprecated with Animate)

About FXG files

The FXG format is a graphic interchange file format for the Animate/Flash Platform. FXG is based on a subset of MXML, the XML-based programming language used by the Flex framework. The FXG format helps designers and developers collaborate more efficiently by enabling them to exchange graphic content with high fidelity. Designers can create graphics using Adobe design tools and export them into the FXG format. You can then use the FXG file in tools such as Adobe Flash Builder and Adobe Flash Catalyst to develop rich Internet experiences and applications.

When creating an FXG file, vector graphics are stored directly within the file. Elements for which there is no corresponding tag in FXG are exported as bitmap graphics which are then referenced in the FXG file. These include bitmaps, some filters, some blend modes, gradients, masks, and 3D. Some of these effects can be exported as FXG, but cannot be imported by the application that opens the FXG file.

When you export a file containing vector and bitmap images using FXG export, a separate folder is created along with the FXG file. This folder has the name <filename.assets> and contains the bitmap images associated with the FXG file.

For more information about the FXG file format, see the FXG 2.0 Specification.

FXG export constraints

Animate allows single or multiple selection of any objects on the stage for export to FXG. Object and layer names are preserved when exporting to FXG format.

The following items are constrained when saving to an FXG file:

  • Scale-9 grids: exported, but readable only by Adobe Illustrator.

  • Sound and video: not exported.

  • Components: not exported.

  • Tweens and animation with multiple frames: not exported, but a selected frame is exported as a static object.

  • Embedded fonts: not exported.

  • Button symbols: Animate exports only the Up state of buttons.

  • 3D properties: not exported.

  • Inverse Kinematics (IK) properties: not exported.

  • Text attributes: some attributes may not be exported.

Export Animate content in FXG format

In Animate, you can export content in FXG format in two ways:

  • To export objects on the Stage as FXG, select the objects and choose Export > Export Selection. Then select FXG format from the File Type menu.

  • To save the entire Stage as FXG, choose Export > Export Image and select Adobe FXG from the File Type menu.

JPEG Sequence and JPEG Image

These options match the JPEG Publish Settings options. However, the Match Screen matches the exported image to the size of the Animate content as it appears on your screen. Match Movie matches the JPEG image to the Animate content and maintains the aspect ratio of the original image.

PNG Sequence and PNG Image

The PNG export settings options are similar to the PNG Publish Settings options (which you can apply as well), with the following exceptions:

Dimensions

Sets the size of the exported bitmap image to the number of pixels you enter in the Width and Height fields.

Resolution

Enter a resolution in dpi. To use the screen resolution and maintain the aspect ratio of your original image, select Match Screen.

Colors

The same as the Bit Depth option in the PNG Publish Settings tab. Sets the number of bits per pixel to use in creating the image. For a 256‑color image, select 8‑bit; for thousands of colors, select 24‑bpc; for thousands of colors with transparency (32 bpc) select 24‑bpc with Alpha. The higher the bit depth, the larger the file.

Include

Select to export the minimum image area or specify the full document size.

Note:

The dimensions of the exported GIF are restricted to a value less than 4000 pixels. This restriction in dimensions is applicable for versions later than CS6.

Note:

The Dither Solid Colors option does not function if 256 Colors option is selected. It means that the GIF image is not dithered if the selected color scheme for the GIF is 256 colors.

(Deprecated with Animate)Bitmap (BMP) image

Create bitmap images for use in other applications. The Export Bitmap dialog box has the following options:

Dimensions

Sets the size of the exported bitmap image in pixels. The size you specify always has the same aspect ratio as your original image.

Resolution

Sets the resolution of the exported bitmap image in dots per inch (dpi) and automatically calculates width and height based on the size of your drawing. To set the resolution to match your monitor, select Match Screen.

Color Depth

Specifies the bit depth of the image. Some Windows applications do not support the newer 32‑bit per channel (bpc) depth for bitmap images. If you have problems using a 32‑bpc format, use the 24‑bpc format.

Smooth

Applies anti-aliasing to the exported bitmap. Anti-aliasing produces a higher-quality bitmap image, but it can create a halo of gray pixels around an image placed on a colored background. Deselect if a halo appears.

Animate document (SWF)

To place the Animate content in another application, such as Dreamweaver, export the entire document as a SWF file. Animate exports the SWF file using the current settings in the Publish Settings for the FLA file.

Exporting HD videos with Adobe Media Encoder

Animate allows you to export tweens, symbols, and graphics to High Definition videos of various formats. Video Export feature has been enhanced to have a seamless integration with Adobe Media Encoder.

In Animate, you can choose any video format and its presets supported by AME and, if you select the appropriate option, Animate ensures that the video is queued and even processed automatically in AME. You will be notified once the processing is successfully completed.

In addition, you can export all scenes or a desired scene to loop, and for a specific scene you can export all frames or a range of frames.

The HD videos exported with Animate can be used with Communications-enabled applications, for video conferencing, streaming, and sharing.

By default, Animate can export to QuickTime Movie (.MOV) files, only. The export function requires you to install the latest version of QuickTime Player, since Animate leverages QuickTime libraries when exporting MOV files.

The HD video export workflow has been remodeled, as Animate is now integrated with Adobe Media Encoder. It allows you to convert MOV files to various other formats. To its end, Adobe Media Encoder has been optimized to only present export formats relevant for Animate content. For more information on Encoding and Exporting videos using Adobe Media Encoder, see Encode and export video and audio.

Note:

Adobe Media Encoder is automatically installed when you install Animate from the Creative Cloud desktop application.

Difference between previous and latest export video workflows

The new workflow is different from the export video workflow of CS6 and earlier versions.

The major points of difference are:

  • Integration with Adobe Media Encoder: Animate has been integrated with Adobe Media Encoder 7.0, and the earlier versions were not dependent on AME.
  • Export formats: Animate can export QuickTime movies, only.
  • HD videos: Animate allows you to export HD videos.

Also, the CS6 workflow had the following issues:

  • The MOV export workflow using QuickTime was error-prone and memory consuming.
  • The AVI export did not support movie clips.

With Animate, the above-mentioned issues have been fixed including the loss of frames issue. With the Adobe Media Encoder workflow, you can export to MOV files seamlessly with Animate. With the new AME-based workflow, you can export Animate content to MOV files, and later use AME to convert MOV files to any desired output.

Export begins at Frame #2

Depending how the Timeline is structured, the exported video can be a result of any of the following scenarios:

  1. If there is more than one frame on the root timeline, the export will begin from frame #2.
  2. If there is only one frame on the root timeline, then the export will include frame #1.
  3. If there is more than one frame on the root timeline and ActionScript or sound is added to frame #1, it will not be called.

Exporting HD video

Before you begin exporting, do the following:

  • Install QuickTime
  • Set the frame-rate to a value equal to or less than 60 fps. For more information, see Animation Basics.
  1. Create or open an existing FLA.

  2. Go to File > Export > Export Video.

    Export video
    Export video dialog

  3. On the Export Video dialog, the Render Width and Render Height assume width and height values set for Stage size.

  4. On the Export Video dialog set your desired options:

    • Render Size H and W: Configure the render size according to the resolution in which you want to export, depending on whether you want to export HD video or normal. Set the values equal to the Width and Height of the Stage, respectively. If you want to change the Render Width and Render Height values, then modify the Stage size accordingly. Animate maintains the aspect ratio as per the Stage dimensions.
    • Ignore Stage Color (generate alpha channel): Creates an alpha channel using the stage color. The alpha channel is encoded as a transparent track. It lets you overlay the exported QuickTime movie on top of other content to alter the background color or scene.
    • Convert Video in Adobe Media Encoder: Select this option if you want to convert the exported MOV file to a different format using AME. If selected, AME is launched after Animate completes exporting the video.
    • Path for the Exported Video: Enter or browse to the path where you want to export the video.
    • Stop Exporting: Specify when Animate terminates exporting.
      • When The Last Frame is Reached: Select this option if you want to terminate at the last frame.
    Stop exporting when the last frame is reached
    Stop exporting when the last frame is reached

    • Stop Exporting: Specify when Animate terminates exporting.
      • After Time Elapsed: Select this option and specify the time span after which you want to terminate exporting. The option allows you to export sections of the video, separately.
    Stop exporting after 1 minute 15 seconds
    Stop exporting after 1 minute 15 seconds

    Stop exporting after 3 seconds
    Stop exporting after 3 seconds

  5. Click Export. If you selected the Convert video in Adobe Media Encoder option, AME is launched and the exported MOV file is available in a new queue. To know more about encoding and converting videos using AME, see Encode and Export Video and Audio.

Exporting SVG sequence

With the new upgradation to Export setting, users can export current timeline as SVG Sequence. Click File> Export> Export Movie… and select the Save as type as SVG Sequence.

Export SVG sequence
Export SVG sequence

Export animated assets to videos, animated GIFs and more

Animate has an efficient publish process while exporting your animated assets to animated GIFs, videos and more. Want to learn how to export your animation? Watch the tutorial at the end of this example and follow these steps.

  1. Click File> Export> Export Video.

  2. In the Export Video dialog box, choose the following options:

    • Render Size: Set the values equal to the Width and Height of the Stage, respectively.
    • Ignore Stage Color (generate alpha channel): Creates an alpha channel using the stage color.
    • Convert video in Adobe Media Encoder: Converts the exported MOV file to a different format.
    • Stop Exporting: Choose the required option to terminate exporting.
    • Browse: Enter the path where you want to export the video.
  3. Click Export.

How to export your animated assets to video, animated GIF, and other formats.

Watch the video to know how to export your videos to animated GIFs and other formats.

 Adobe

Get help faster and easier

New user?

Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX 2024

Adobe MAX
The Creativity Conference

Oct 14–16 Miami Beach and online

Adobe MAX

The Creativity Conference

Oct 14–16 Miami Beach and online