- Adobe Animate User Guide
- Introduction to Animate
- Animation
- Animation basics in Animate
- How to use frames and keyframes in Animate
- Frame-by-frame animation in Animate
- How to work with classic tween animation in Animate
- Brush Tool
- Motion Guide
- Motion tween and ActionScript 3.0
- About Motion Tween Animation
- Motion tween animations
- Creating a Motion tween animation
- Using property keyframes
- Animate position with a tween
- How to edit motion tweens using Motion Editor
- Editing the motion path of a tween animation
- Manipulating motion tweens
- Adding custom eases
- Creating and applying Motion presets
- Setting up animation tween spans
- Working with Motion tweens saved as XML files
- Motion tweens vs Classic tweens
- Shape tweening
- Using Bone tool animation in Animate
- Work with character rigging in Animate
- How to use mask layers in Adobe Animate
- How to work with scenes in Animate
- Interactivity
- How to create buttons with Animate
- Convert Animate projects to other document type formats
- Create and publish HTML5 Canvas documents in Animate
- Add interactivity with code snippets in Animate
- Creating custom HTML5 Components
- Using Components in HTML5 Canvas
- Creating custom Components: Examples
- Code Snippets for custom Components
- Best practices - Advertising with Animate
- Virtual Reality authoring and publishing
- Workspace and workflow
- Creating and managing Paint brushes
- Using Google fonts in HTML5 Canvas documents
- Using Creative Cloud Libraries and Adobe Animate
- Use the Stage and Tools panel for Animate
- Animate workflow and workspace
- Using web fonts in HTML5 Canvas documents
- Timelines and ActionScript
- Working with multiple timelines
- Set preferences
- Using Animate authoring panels
- Create timeline layers with Animate
- Export animations for mobile apps and game engines
- Moving and copying objects
- Templates
- Find and Replace in Animate
- Undo, redo, and the History panel
- Keyboard shortcuts
- How to use the timeline in Animate
- Creating HTML extensions
- Optimization options for Images and Animated GIFs
- Export settings for Images and GIFs
- Assets Panel in Animate
- Multimedia and Video
- Transforming and combining graphic objects in Animate
- Creating and working with symbol instances in Animate
- Image Trace
- How to use sound in Adobe Animate
- Exporting SVG files
- Create video files for use in Animate
- How to add a video in Animate
- Draw and create objects with Animate
- Reshape lines and shapes
- Strokes, fills, and gradients with Animate CC
- Working with Adobe Premiere Pro and After Effects
- Color Panels in Animate CC
- Opening Flash CS6 files with Animate
- Work with classic text in Animate
- Placing artwork into Animate
- Imported bitmaps in Animate
- 3D graphics
- Working with symbols in Animate
- Draw lines & shapes with Adobe Animate
- Work with the libraries in Animate
- Exporting Sounds
- Selecting objects in Animate CC
- Working with Illustrator AI files in Animate
- Applying blend modes
- Arranging objects
- Automating tasks with the Commands menu
- Multilanguage text
- Using camera in Animate
- Graphic filters
- Sound and ActionScript
- Drawing preferences
- Drawing with the Pen tool
- Platforms
- Convert Animate projects to other document type formats
- Custom Platform Support
- Create and publish HTML5 Canvas documents in Animate
- Creating and publishing a WebGL document
- How to package applications for AIR for iOS
- Publishing AIR for Android applications
- Publishing for Adobe AIR for desktop
- ActionScript publish settings
- Best practices - Organizing ActionScript in an application
- How to use ActionScript with Animate
- Accessibility in the Animate workspace
- Writing and managing scripts
- Enabling Support for Custom Platforms
- Custom Platform Support Overview
- Working with Custom Platform Support Plug-in
- Debugging ActionScript 3.0
- Enabling Support for Custom Platforms
- Exporting and Publishing
- How to export files from Animate CC
- OAM publishing
- Exporting SVG files
- Export graphics and videos with Animate
- Publishing AS3 documents
- Export animations for mobile apps and game engines
- Exporting Sounds
- Best practices - Tips for creating content for mobile devices
- Best practices - Video conventions
- Best practices - SWF application authoring guidelines
- Best practices - Structuring FLA files
- Best Practices to optimize FLA files for Animate
- ActionScript publish settings
- Specify publish settings for Animate
- Exporting projector files
- Export Images and Animated GIFs
- HTML publishing templates
- Working with Adobe Premiere Pro and After Effects
- Quick share and publish your animations
- Troubleshooting
About symbols
A symbol is a graphic, button, or movie clip that you create once in the Animate (formerly Flash Professional CC) authoring environment or by using the SimpleButton (AS 3.0) and MovieClip classes. You can then reuse the symbol throughout your document or in other documents.
A symbol can include artwork that you import from another application. Any symbol that you create automatically becomes part of the library for the current document.
An instance is a copy of a symbol located on the Stage or nested inside another symbol. An instance can be different from its parent symbol in color, size, and function. Editing the symbol updates all of its instances, but applying effects to an instance of a symbol updates only that instance.
Using symbols in your documents dramatically reduces file size; saving several instances of a symbol requires less storage space than saving multiple copies of the contents of the symbol. For example, you can reduce the file size of your documents by converting static graphics, such as background images, into symbols and then reusing them. Using symbols can also speed SWF file playback, because a symbol needs to be downloaded to Flash® Player only once.
Share symbols among documents as shared library assets during authoring or at runtime. For runtime shared assets, you can link assets in a source document to any number of destination documents, without importing the assets into the destination document. For assets shared during authoring, you can update or replace a symbol with any other symbol available on your local network.
If you import library assets with the same name as assets already in the library, you can resolve naming conflicts without accidentally overwriting existing assets.
Additional introductory instruction about symbols is available from these resources:
Types of symbols
Each symbol has a unique Timeline and Stage, complete with layers. You can add frames, keyframes, and layers to a symbol Timeline, just as you can to the main Timeline. When you create a symbol you choose the symbol type.
Use graphic symbols for static images and to create reusable pieces of animation that are tied to the main Timeline. Graphic symbols operate in sync with the main Timeline. Interactive controls and sounds won’t work in a graphic symbol’s animation sequence. Graphic symbols add less to the FLA file size than buttons or movie clips because they have no timeline.
Use button symbols to create interactive buttons that respond to mouse clicks, rollovers, or other actions. You define the graphics associated with various button states, and then assign actions to a button instance. For more information, see Handling events in the ActionScript 3.0 Developer’s Guide.
Use movie clip symbols to create reusable pieces of animation. Movie clips have their own multiframe Timeline that is independent from the main Timeline—think of them as nested inside a main Timeline that can contain interactive controls, sounds, and even other movie clip instances. You can also place movie clip instances inside the Timeline of a button symbol to create animated buttons. In addition, movie clips are scriptable with ActionScript®.
Use font symbols to export a font and use it in other Animate documents.
Animate provides built‑in components, movie clips with defined parameters, that you can use to add user interface elements, such as buttons, checkboxes, or scroll bars, to your documents. For more information, see About ActionScript 3.0 Components in Using ActionScript 3.0 Components.
To preview animation in component instances and scaling of 9-slice-scaled movie clips in the Animate authoring environment, select Control > Enable Live Preview.
Create symbols
You can create a symbol from selected objects on the Stage, create an empty symbol and make or import the content in symbol-editing mode, and create font symbols in Animate. Symbols can contain all the functionality that Animate can create, including animation.
Using symbols that contain animation lets you create Animate applications with a lot of movement while minimizing file size. Consider creating animation in a symbol that has a repetitive or cyclic action—the up‑and‑down motion of a bird’s wings, for example.
To add symbols to your document, use shared library assets during authoring or at runtime.
Convert selected elements to a symbol
-
Select an element or several elements on the Stage. Do one of the following:
Select Modify > Convert To Symbol.
Drag the selection to the Library panel.
Right-click (Windows) or Control-click (Macintosh) and select Convert To Symbol from the context menu.
-
In the Convert To Symbol dialog box, type the name of the symbol and select the behavior.
-
Click in the registration grid to position the registration point for the symbol.
-
Click OK.
Animate adds the symbol to the library. The selection on the Stage becomes an instance of the symbol. Once you have created a symbol, you can edit it in symbol edit mode by choosing Edit > Edit Symbols, or you can edit it in the context of the Stage by choosing Edit > Edit In Place. You can also change the registration point of a symbol.
Create an empty symbol
-
Do one of the following:
Select Insert > New Symbol.
Click the New Symbol button at the lower left of the Library panel.
Select New Symbol from the Library Panel menu in the upper-right corner of the Library panel.
-
In the Create New Symbol dialog box, type the name of the symbol and select the behavior.
-
Click OK.
Animate adds the symbol to the library and switches to symbol-editing mode. In symbol-editing mode, the name of the symbol appears above the upper-left corner of the Stage, and a cross hair indicates the symbol’s registration point.
-
To create the symbol content, use the Timeline, draw with the drawing tools, import media, or create instances of other symbols.
-
To return to document-editing mode, do one of the following:
Click the Back button.
Select Edit > Edit Document.
Click the scene name in the Edit bar.
When you create a symbol, the registration point is placed at the center of the window in symbol-editing mode. You can place the symbol contents in the window in relation to the registration point. To change the registration point, when you edit a symbol, move the symbol contents in relation to the registration point.
-
In the ActionScript Linkage section, you can choose to export for ActionScript by selecting the Export for ActionScript checkbox. The Class and Base Class are automatically displayed (you can choose to rename the class names). Animate searches for class definitions in an external AS file or a linked SWC file. If the class definitions are not found in these locations, Animate automatically generates class files.
(Animate only) Swapping multiple symbols
The Swap Symbol option allows you to swap symbols with a selected symbol or bitmaps.
-
In your Animate document, select multiple symbols on the stage.
-
On the Properties panel, click SWAP.
-
On the Swap Symbol dialog, select the symbol you want to replace all selected symbols/bitmaps with.
-
Click OK.
Convert animation on the Stage into a movie clip symbol
To reuse an animated sequence on the Stage, or to manipulate it as an instance, select it and save it as a movie clip symbol.
-
On the main Timeline, select every frame in every layer of the animation on the Stage that you want to use. For information on selecting frames, see Insert frames in the Timeline.
-
Do one of the following to copy the frames:
Right-click (Windows) or Control-click (Macintosh) any selected frame, and select Copy Frames from the context menu. To delete the sequence after converting it to a movie clip, select Cut.
Select Edit > Timeline > Copy Frames. To delete the sequence after converting it to a movie clip, select Cut Frames.
-
Deselect your selection and make sure nothing on the Stage is selected. Select Insert > New Symbol.
-
Name the symbol. For Type, select Movie Clip, then click OK.
-
On the Timeline, click Frame 1 on Layer 1, and select Edit > Timeline > Paste Frames.
This action pastes the frames (and any layers and layer names) you copied from the main Timeline to the Timeline of this movie clip symbol. Any animation, buttons, or interactivity from the frames you copied now becomes an independent animation (a movie clip symbol) that you can reuse.
-
To return to document-editing mode, do one of the following:
Click the Back button.
Select Edit > Edit Document.
Click the scene name in the Edit bar above the Stage.
Duplicate symbols
Duplicating a symbol lets you use an existing symbol as a starting point for creating a symbol.
To create versions of the symbol with different appearances, also use instances.
Duplicate a symbol using the Library panel
-
Select a symbol in the Library panel and do one of the following:
Right-click (Windows) or Control-click (Macintosh), and select Duplicate from the context menu.
Select Duplicate from the Library Panel menu.
Duplicate a symbol by selecting an instance
-
Select an instance of the symbol on the Stage.
-
Select Modify > Symbol > Duplicate Symbol.
The symbol is duplicated, and the instance is replaced with an instance of the duplicate symbol.
Edit symbols
When you edit a symbol, Animate updates all the instances of that symbol in your document. Edit the symbol in the following ways:
In context with the other objects on the Stage by using the Edit In Place command. Other objects are dimmed to distinguish them from the symbol you are editing. The name of the symbol you are editing appears in an Edit bar at the top of the Stage, to the right of the current scene name.
In a separate window, using the Edit In New Window command. Editing a symbol in a separate window lets you see the symbol and the main Timeline at the same time. The name of the symbol you are editing appears in the Edit bar at the top of the Stage.
You edit the symbol by changing the window from the Stage view to a view of only the symbol, using symbol-editing mode. The name of the symbol you are editing appears in the Edit bar at the top of the Stage, to the right of the current scene name.
When you edit a symbol, Animate updates all instances of the symbol throughout the document to reflect your edits. While editing a symbol, use any of the drawing tools, import media, or create instances of other symbols.
Change the registration point of a symbol (the point identified by the coordinates 0, 0) by using any symbol-editing method.
Edit a symbol in place
-
Do one of the following:
Double-click an instance of the symbol on the Stage.
Select an instance of the symbol on the Stage and right-click (Windows) or Control-click (Macintosh), and select Edit in Place.
Select an instance of the symbol on the Stage, and select Edit > Edit In Place.
-
Edit the symbol.
-
To exit edit-in-place mode and return to document-editing mode, do one of the following:
Click the Back button.
Select the current scene name from the Scene menu in the Edit bar.
Select Edit > Edit Document.
Double-click outside the symbol content.
Edit a symbol in a new window
-
Select an instance of the symbol on the Stage and right-click (Windows) or Control-click (Macintosh), and select Edit In New Window.
-
Edit the symbol.
-
Click the Close box in the upper-right corner (Windows) or upper-left corner (Macintosh) to close the new window, and click in the main document window to return to editing the main document.
Edit a symbol in symbol-editing mode
-
Do one of the following to select the symbol:
Double-click the symbol’s icon in the Library panel.
Select an instance of the symbol on the Stage, and right-click (Windows) or Control-click (Macintosh), and select Edit from the context menu.
Select an instance of the symbol on the Stage and select Edit > Edit Symbols.
Select the symbol in the Library panel and select Edit from the Library Panel menu, or right-click (Windows) or Control-click (Macintosh) the symbol in the Library panel and select Edit.
-
Edit the symbol.
-
To exit symbol-editing mode and return to editing the document, do one of the following:
Click the Back button at the left of the Edit bar at the top of the Stage.
Select Edit > Edit Document.
Click the scene name in the Edit bar at the top of the Stage.
Double-click outside the symbol content.