Flash Vista - Home
Newest Cool Site
The Two Tales
Site info | Archive
Main Navigation
Home
New Links
Top Rated
Most Popular
Cool Sites
Search

Flash Tutorials
Flash Resources
Flash News
Flash Templates
Flash Intro Templates
Website Templates
Flash Games
Flash Books
FlashVista Polls
Sitemap


Random Link
English
Ljubov Kravtsova
Site info | Get another
FlashVista
Login
Register
Subscribe

Add Link
Modify Link
Favorites
Suggest Category

Advertise with us
Support us
Credits / Thanks
Contact

Flash Templates:

More Templates ...

Mailing List
User

Password



Register
Forgot password?
Partner websites
Free Hit Counter
Free Seo Tools
Free Tutorials
Free Video Tutorials
Forum signatures
Best Free Scripts
Wii Fit
Wii Fit News
Cool Tech Gadgets
Other Resources
Suggest
Suggest this site to a friend


Mailing List
Status: Not logged in

English English German French Spanish Italian Portuguese Russian Polish Finnish Dutch Swedish Thai Romanian Traditional Chinese Simplified Chinese
SearchNot logged in
Keyword: Search for: Advanced Search


Add motion blur to Flash animations


NEW Flash Tutorials in Video Format - Powered by LearnFlash.com: 45 minutes of flash tutorials now available in streaming format or download. Topics Include flash for beginners, text effects, actionscripting, audio/video, flash 8 and more.


Printer version



by Ali Eisa
www.aevision.com


Introduction

In this tutorial you're going to learn how to add a motion blur effect to your animation, using a third party software.

Since Flash Doesn't allow us to add blur to our objects, we're going to use Adobe Photoshop.
The trick involved here is to import 2 images to Flash, one is the normal image, and the other one is motion-blurred in Photoshop.

By applying motion tween to our motion-blurred image, we can make our object look as if it is actually accelerating! Just like our little UFO on the left :)








STEP 1

Alright, let's get started

The First step is to open your image in Photoshop (or any other photo editing software with motion blur effect) and apply the desired motion blur amount to your image.
Good, now we've got 2 images, the original, and the motion-blurred image.



You can save your images as *.jpg format, however, if quality of image in your flash movie is going to be important, then it is highly advised to save as *.png. It is important to note that your flash file size will be larger with .png format though.

Ok, let's go go to Flash now :)


STEP 2

Run Flash and go to File>Import and import the 2 images.

Additional i nfo on image optimization in Flash, you can skip this if you want:

Go to Windows>Library (or F11), right-click your image and go to Properties.
If you saved your images as .png in the previous step, it is important to select "Lossless (PNG/GIF)". Otherwise, leave it as JPEG and flash will compress ur file according to the value set in File>Publish Settings.




STEP 3

Good, your images are ready to be used now by flash.

Now place the two images on different layers.
Apply the desired Motion tween to the original image. Once you get to the point where you need to apply the motion blur, end the original frames and start the blurred image from the same position, as shown in Fig2.







That's basically it, replacing your original image with the blurred image, making sure the blurred image starts from where the original was left out.


Conclusion

What we did:

  1. Used Photoshop to add "motion blur" to our image.
  2. Imported the original and the motion-blurred image to flash.
  3. Optimized the images for better quality and file size.
  4. created 2 layers, the original on one layer and the motion-blurred on another.
  5. Applied motion tween to our images, and stopped the original image at a certain point, for the motion-blurred image to resume.


Well done :) hope you enjoyed the tutorial.

(Added: 05-24-2004, Hits: 0, Rating: 3.18, Votes: 98, Reviews: 2)
Add to Favorites Suggest to a Friend

Reviews: (2)

These tutorials are so well explained that even a beginner in flash like myself can understand. Thank you and please keep these tutorials going. It makes learning flash very exciting and provides ideas for creations.
(Added: 04-27-2006 User: Guest)

First of all thanks to all team members of flashvista. it's great site for lover of flash.

please continue these kind of techniques...

Muhammad Usman
Jr. Graphics Designer

(Added: 02-24-2006 User: Guest)


Add Review
Please note:
We review EVERY comment before it appears on the site, so please dont waste your time by posting spam links :)
No URLs allowed, no HTML please.

If you register or login first, your review will contain your nickname


Rate It



Excellent!
Very Good
Good
Fair
Poor