Flash CS4 Motion Easing
In this Flash project tutorial, designer David Stiller works with the new CS4 motion editor and its easing functions to adjust the speed of movement in a simple animation. The easing graphs allow for adjustments to motion speed to be made visually. Sample files are available for viewers who want to follow along with tutorial. Click here to download.
This video requires Adobe Flash Player.
Visitor Comments »
Pingback by Flash CS4视频教程 - | October 9, 2008 @ 11:08 pm
Nice tutorial
Comment by Hakan KARSON | November 13, 2008 @ 4:57 am
Hakan,
Thanks!
Comment by David Stiller | November 17, 2008 @ 1:10 pm
very good tutorial…well explained and demonstrated
Comment by Michelle Laham | November 18, 2008 @ 7:59 pm
Michelle,
Glad to hear that! Thanks.
![]()
Comment by David Stiller | December 15, 2008 @ 10:06 am
Very helpful! Great tutorial
Looking forward to more.
Comment by Aaron | December 31, 2008 @ 5:40 pm
Aaron,
Thanks!
Comment by David Stiller | January 5, 2009 @ 7:32 am
Thanks
Comment by Judy | January 6, 2009 @ 3:52 am
Thanks~
Comment by Murphyphy | January 25, 2009 @ 8:34 am
Mohamed,
thank you nice tutrial
Comment by Mohamed | February 7, 2009 @ 11:07 am
Mohamed,
You’re welcome! Glad you liked it.
Comment by David Stiller | February 9, 2009 @ 11:09 am
Nice tutorial. Thank you for sharing.
Comment by Lex | February 23, 2009 @ 9:47 am
I think a better object to demonstrate the motion ease would have made it a better tutorial. Obviously I can’t complain that much about an excellent tutorial for FREE!!
Comment by Steve Grappone | February 27, 2009 @ 7:17 pm
Lex and Steve,
Thanks! Not sure what object would have been better (slice of pizza? rabbit-in-a-hat? Goomba?) but fortunately, the principles are the same no matter what’s depicted.
![]()
Comment by David Stiller | March 23, 2009 @ 8:54 am
I agree with Steve a better object would have made a better tutorial but,the motion editor is a powerful new tool, and the tutorial demonstrates that nicely.
Thanks for the free tutorial, I’ll definitely be working in the motion editor a lot more![]()
Comment by Anthony | May 11, 2009 @ 4:57 pm
Maybe the Y axis would have should it of better?
Comment by Anthony | May 11, 2009 @ 5:00 pm
very help full
thank you
Comment by dineshkumar | May 20, 2009 @ 8:59 am
I’ve watched a number of video tutorials on easing. Yours is the best. You explain it very clearly and go through it as a new person might applying an ease.
Comment by Michael | May 22, 2009 @ 12:46 pm
To Anthony and dineshkumar …
Thanks! (Anthony, that’s a decent point about the Y axis. Maybe next time!)
To Michael …
You just made my afternoon.
![]()
Comment by David Stiller | May 22, 2009 @ 4:10 pm
As a 25-year tech with engineering in my background, I can’t shake the distinct impression that easing simply describes a method to modify an acceleration curve. As with the math term “gradient” (direction of steepest slope, where the magnitude is rate of change) this may help others with engineering calculus to instantly identify the concepts–without requiring methodical jaunts through a lot of arbitrary videos.
As a direct comment on this video, good work; I had the concept as soon as I realized what the term meant. Thank you.
Comment by Kirk M. Schafer | August 14, 2009 @ 3:05 pm
Kirk,
Thanks for the insight! To me, this sounds a bit like presenting the ingredients for bread as chemical notation. Most people will be more comfortable calling them flour, salt, and water. But sure, for the calculus-minded, the Motion Editor panel provides a new way to modify acceleration curves. Glad you enjoyed the video!
Comment by David Stiller | August 18, 2009 @ 10:47 am
Good video however like all video’s it does not show how it works with multiple keyframes. That part keeps a mystery to me. In the old cs3 style a easing is appliedper tween, it does not work like that in cs4.
Comment by Mike | August 19, 2009 @ 6:10 am
Mike,
To clarify, the old CS3 style easing — at least, what I think you mean by that — is still available in CS4. It’s just that you need a classic tween in order to use it. (In previous versions of Flash, even prior to CS3, classic tweens were called motion tweens, and the now old-style easing was the only option available, aside from the Custom Ease In / Ease Out dialog box introduced in Flash 8.)
With motion tweens in CS4 — that is, the new-style tweens that involve the Motion Editor panel — easing applies to the whole span of frames in a given tween, regardless of the number of property keyframes in that tween.
To illustrate, imagine that a new-style tween encompasses frames 1 to 100 of the main timeline. You introduce four property keyframes somewhere between frames 1 and 50, then apply easing to the tween as a whole. The effect of your easing will be distributed from frame 1 though 100, even though no property keyframes appear after frame 50. In CS4 (using the new style), it is not possible to apply one ease between the first two property keyframes, nothing between the second and third, and another ease between the third and fourth. In a sense, it’s all or nothing, unless you actually break the motion tween into two separately selectable spans of frames.
Comment by David Stiller | August 25, 2009 @ 10:30 am
The new Motion Editor is not so intuitive as it seems.
You tutorial is very well explained.
Thank you
Comment by Valdemar | August 27, 2009 @ 2:22 pm
Valdemar,
Thank you!
Comment by David Stiller | August 28, 2009 @ 4:12 pm
Leave us a comment

- Dragging an Object Between Documents
- TV Scanline Effect
- Trick to the Glossy Effect
- 3D Text
- Changing Type on a Path






Photoshop
Illustrator
Indesign
Dreamweaver
Fireworks
Premiere
Flash
After Effects
Lightroom
Acrobat














