Exercise 1 - Frame-by-Frame Animation with Keyframes - use F6 if you want the frames to accumulate content, e.g. spelling out your name but use F7 if you want a frame to have only new content, with nothing from earlier frames.
Exercise 2 - Onion Skinning - Above the timeline, click the the two overlapping circles (Onion Skin). You will be able to see a ghost image of the content of other frames on the stage. This allows you to change the current artwork relative to the ghost images. Which frames you see through onion skinning are controlled through the Onion Skin Markers, which are vertical lines that appear at the top of the Timeline after you click the Onion Skin button.
Exercise 3 - Inserting and Deleting Frames - Adjusting the frame rate affects the speed of the animation, but it affects the entire movie. By inserting and deleting frames, one can adjust the speed of parts of the movie. You can insert frames by hitting F5. To remove frames, you can select them by clicking and dragging and then choosing the keyboard shortcut Shift-F5 or by right clicking and choosing Remove Frames.
There are icons above the timeline (< and >) that will take you to next and previous keyframe in that layer as well as the next and previous frame (arrows with vertical lines).
In versions of Flash prior to CC, the authoring tool customarily generated an .swf file which is what was displayed in a web browser. In Animate, this option is selected at file creation by choosing the ActionScript 3.0 alternative.
Over the years, several formats were available but beginning with Animate 2020, there are only two options - ActionScript 3.0 and HTML5 Canvas. All of these formats have used a .fla format as the native file format, i.e. that used within the program.
The ActionScript 3.0 option can export a .swf file which plays in the Flash Player. However, the Flash Player has not been supported on mobile devices for several years and support for the Flash player in many browsers is ending in 2020 and thus the swf format no longer is an attractive choice. However, the ActionScript 3.0 option can also be exported to an animated gif. Although the functionality of the animated gif format is less than the swf file, the animated gif will continue to work in browsers and an animated gif can be brought into a Premiere Pro project whereas a swf file cannot.
If one creates an ActionScript 3.0 file, selecting Control>Test Movie generates a .swf file. If one chooses Test Movie>In Animate, the .swf file plays in the Flash Player within Animate and the movie will loop by default. One can control looping by choosing, within the Player, Control>Loop Playback.
If one chooses Test Movie>In Browser, the swf file is displayed within the browser if the browser permits Flash. Choosing Control>Test Movie>In Browser generates the .swf file plus an html file to display the .swf file and launches the html file in the default browser. To eliminate looping when the movie is displayed in the browser, choose File>Publish Settings. If HTML Wrapper is not checked, then check it and uncheck the Loop option under Playback on the right.
Note: If HTML Wrapper is already checked, you will need to click on it to uncheck it and then click again to check it to display the Loop option on the right.
When the Animate movie is published, Animate will generate the HTML necessary to display the Animate movie in a web page. To use this Animate movie inside a web page, one needs to use all the HTML generated by Animate between the <object>and </object> tags. One can copy all this information to a web page, or edit the HTML file generated by Animate.
Exercise: Create a frame by frame animation where the content is additive - i.e. use F6. Generate the swf file and the html to reference it by choosing Control>Test Movie>In Browser. Open the generated html file in different browsers to see if any will play the animation.
Exercise: In Dreamweaver, select Insert>HTML>Flash SWF to create a reference to the swf from an html file. Open the generated html file in different browsers.
Exercise: In Animate, choose File>Publish Settings and choose an animated gif as the output and specify that it should not loop. Insert the .gif file into a web page using the img tag. Display the html file in a browser.
Still another way to display the .swf move in an existing web page is to use the <embed> tag, e.g.
<param name="slideshow" value="splash.swf">
Although this code appears to work in current browsers, it may not function in older browsers as well as the code generated by Animate or Dreamweaver and is dependent on the browser supporting the Flash Player.
Exercise: In Animate, choose HTML5 Canvas as the format at the outset. Do a frame by frame animation and choose File>Publish Settings and uncheck the "Loop Timeline" checkbox. Then File>Publish. Copy and paste the existing code into Dreamweaver or a text editor and modify the HTML. Note that when you upload the html file to your webspace, you will need to upload a .js file and the images folder as well.
Revised: March 20, 2020. Comments to William Pegram, email@example.com