How to animate frame by frame in Adobe Animate
**NOTE** The new version of Animate contains an excellent Bouncing Ball tutorial, I Highly recommend you do this instead of the one below!
In this tutorial, you’ll learn how to create frame by frame animation in Animate. This technique involves changing each keyframe of an animation to create movement. Here is a simple bouncing ball animation created frame by frame.
1- Draw a ball
First, we’ll draw a ball using the Brush tool.
And make sure to set your view as 100%.
2- Create a frame
Press F7 to insert a blank keyframe into the timeline. This empties any graphics on the stage so that you can start drawing another piece of the animation.
3- Use Onion Skin
This enables you to view the previous images you have drawn, which appear semi transparent. Click on the icon to enable Onion Skin view.
4- Draw the next action
Make sure you have selected the 2nd frame. Then draw the orb again, but with a slightly different shape.
5- Draw and draw again until you complete the animation
Repeat the procedure to complete the animation! Some tips here, if you can’t see previous animations using the Onion Skin view, make sure the Onion Skin box encompasses all frames. (Refer to figure below)
6- Smoothen the graphics
One more useful tip here, you can smoothen your graphics easily by first selecting the orb you drew using the select tool, then click on the Smoothen icon (refer to figure above) several times. It is located in the Options tab. This feature eliminates shakiness from the graphics you drawn. It should look sleeker now. That is all!
7- View your Animation
To view your animation, go to the Control menu and choose “Test Movie.” Or, use the keyboard shortcut of Ctrl-Enter.
So, not too difficult. Try redoing your animation a few times until you get a version you like.
Here is an introduction to Flash by “Animation vs Animator” artist Alan Becker: