Make some noise with your Edge Animate projects with the new ability to add audio to your projects. Using the native HTML5 audio APIs available in all modern browsers, you can bind audio events to the timeline, add audio actions to your elements, and create audio transitions for unique sound effects.
To learn more about how to get started with audio, see Add audio to animations.
Making responsive Animate projects is now as simple as clicking a button. When enabled, this option allows you to scale your Animate stage up and down while maintaining its aspect ratio. Use Responsive Scaling for stand-alone Animate content, or when embedding Edge Animate compositions inside a responsive website.
Responsive scaling can also be used when embedding an OAM inside supported Adobe applications. Resize the content frame for the placed OAM and preview to see the results.
You can set Responsive Scaling in the Stage properties to "width", "height", or "both" to scale the whole composition proportionally. Aspect ratio is maintained and is determined by the ratio of stage width to stage height.
Responsive Scaling option in Properties panel
- 'width' resizes the composition only when the width of the document window changes.
- 'height' scales the composition with the height of the document.
- 'both' resizes the composition in both directions.
Scaling is determined by the size of the Stage's parent. If you place the stage into a static page, the stage parent's height and width must also be set.
Placing these compositions into static files gets easier now: the composition fits into the document flow.
Loading scripts into the Library
Add JS File from Disk
Import JS files from your local file system. These files are included in a “js” folder on saving.
JS File from Disk
JS File from URL
Motion Path Improvements
Enhancements have been made to motion path editing, allowing you to easily modify motion paths applied to objects.
When you hover over a motion path, you see the new tool tip overlays that provide information on the keyboard commands available for motion path controls. To toggle display of this overlay, press “H”.
Rotate motion path
Scale motion path
New distribute commands
New distribute commands are available from the align menu to help with aligning and positioning elements on the stage. Select three or more objects and select Modify > Distribute from the menu to access various distribute options.
To evenly space objects of different sizes horizontally or vertically, select Distribute > Horizontal Space or Vertical Space.
Center your Animate stage within the browser window or whatever parent container it’s placed in. Choose from three different options:
- Vertical – Centers the stage based on the width of the viewport
- Horizontal – Centers the stage based on the height of the viewport
- Both – Centers the stage based on both the width and height of the viewport
Transparent poster image for OAM
You now have the option when publishing an OAM file to save the poster image as a transparent PNG. This option is especially helpful when embedding Animate content inside Adobe InDesign or Adobe Muse if you want a transparent stage to overlay the design contents of your document.
Publishing with Transparent Poster Image
Note: When this option is selected, the OAM appears as an empty frame when placed inside other Adobe applications. Always preview a live sample of your project to see the playback results.
This feature currently is not compatible with PDF Folio types when publishing to DPS. To use a transparent poster image, choose Automatic, PNG or JPG Folio types.
CDN option for OAM
Hosting the runtime files is now available as a publish setting for OAM. If you are creating Animate content with the intent of online use (Adobe Muse or Adobe Dreamweaver) you may want to benefit from CDN hosting for the Animate runtime and jQuery. When you enable this option, your files download faster with cached hosting.
CDN option for OAM
Two new lessons (Responsive Layout and Audio) are available for you to get started with some of the features available in this release. Check out “Getting Started” on the Welcome Screen, or Window > Lessons to view the Lessons panel.