Fun Vector Butterfly Flash Animation

This movie requires Flash Player 9

Here’s a little departure from the norm. Just want to share with you a little butterfly animation that I whipped together. I grabbed a static butterfly and simply animated the wings in a self-contained movie clip symbol. Grab it and use it any way you like. Download and details inside.

A few quick notes

I downloaded a free vector pack of butterflies from webbydzine.com (go there if you want more butterflies). I learned about the assets from following @CreativityGeek who commonly posts interesting stuff.

I wondered, “hmmm I wonder how this would import into Flash? Will it be easy to animate?” As seen in the swf above, both answers are yes.

I chose to animate the butterfly along a classic motion guide, but you can just slap the butterfly symbol into any project and have all that 3D wing flapping goodness ready to go.

I use a little TweenMax magic to randomly change the color of the wings on each loop just to keep it interesting.

Oh, and the script technique I use to flip the animation around… never use that.

Download: SNORKLtv-butterfly_animation_CS4

Enjoy!

-Carl

 

 

 

 

Post to Twitter Post to Facebook

This entry was posted in Just for Fun. Bookmark the permalink.
  • Galya-n

    Thanks a lot! I like your blog very much.

  • Thanks for the feedback!

  • That looks so awesome! I love your work and tutorials. They’re so inspiring. 

  • Jesús Bejarano

    thanks Carl awesome i always wanna have some of this and learn how to do it +u+

  • Something so simple yet so creative, you inspire all of us Carl 🙂

  • Marius,

    Thanks so much for the kind comment. When I made this I just wanted to have fun doing something “brainless”. I’m very glad that others can enjoy it too!
    -Carl

  • BarryS

    Hi Carl,

    It’s Barry here from the GreenSock forums! This is GreenSock reletated but is based around your butterfly animation. It was completely by chance that I found your butterfly animation and decided to use it in a project.

    Instead of using a path like in your example I have been moving the buttefly with GreenSock, but I’ve found that the butterfly is stretched somehow. Its wierd because if I move another MC stretching is not apparent, but if I move the butterfly its almost as if its tipping over slightly and the wings stretch.  Do you have an idea why this would happen? I could just use a motion path, but I’d like to use GS bezier as is should be easier.

    If you’d like me to post this on the GS forums then I will.

    Thanks for your help.

    Barry

  • Hi Barry.

    Sounds like it has something to do with the 3d perspective and the objects relationship to the camera.

    Can’t troubleshoot it right now.

  • BarryS

    Hi Carl,

    No worries, just thought it may be of interest or something you had come across before. Thanks again for making it look so easy and sharing what you know. Thanks for the headsup on the 3D perpective and the objects relationship to the camera.

    Cheers,

    Barry

  • BarryS

    Hi Carl,

    You were right of course. I just needed to reduce the Perspective angle of the mc in the 3D position and view settings. Until now I didnt know they existed.

    Thanks for your help.

    Barry