[private]This tutorial was originally written for Premium members , and have stayed in the private collection for too long , it is time to get this story a little attention 🙂 so i am reposting this tutorial for regular readers. Hope you like it.

In this tutorial i will show you how to set up an illustrator document for working in illustrator to work better in flash. I will also tell you how to create an animation IN illustrator FOR flash. And export animated swf files from illustrator . Source file is available for download at the end of the tutorial.

you can preview how we animated a simple flower falling and exported it as swf. This is a small example but the technique can be used in different ways to fulfill your aesthetic requirement.

Preview the file

Step 1

Setting up Layers

If you are like me you are most likely to have all your illustration in one single layer !..If you are! …Prepare your work by placing all of your objects in separate layers. At this point you should have in mind how your file will be working in flash . So just separate all of your work and place different symbols / objects in different layers . This will give you greater ability to modify or animate them while they are imported into flash.

Step 2

Crop your area

Select your background create a copy > paste in back > GO to Object > Crop Area > make

Step 3

Creating animation

Remember illustrator is a drawing aid , for complex animation flash will work best and it is for this purpose that flash is created . This is just a small demonstration which can reduce your work that you do in flash.

I will select here two symbol instances , I want to make the flower on the top left to fall towards the right corner.Here is how you do it.

Select both flower instances .

Step 4

Using Blends

go to object > Blend > Blend options. insert some specified steps More steps you give More smooth your animation will be . If you want to give effect of flower coming from behind you can reduce the size of the upper flower.

Go to object > Blend > make

Illustrator will create multiple positioned instances between the two depending upon the number of steps you choose.

Step 5

Editing animation path

You can edit the path of the Flow Or animation of the object by editing the bled path ope up your Anchor points pallette , Add an Anchor point  where you would like to adjust it from .

Step 6

Adjusting nodes

select the node and convert anchor point tool by adjusting the handles. where ever you would like the object to follow.

Step 7

Exporting swf

illustrator has ability to now import the vector work as layered as in illustrator so you you can have all your work placed in layer , save it as a usual ai file when you open it in flash as usual it will separte and adjust the artwork as layers in flash as was in illustrator. Here since we are exporting an swf we will give the options something like this.

Export as > AI layers to swf FRAMES.
Clip to artboard size
Use as background > if you take a layer that covers the whole background this will be taken in each frame!
Last but not the least Animate Blends.> in sequence hit ok

Step 8

importing in Flash

Open up a new file > go to file > import and there you have it your animation sequence using blend tools exported as swf.

click on the link below to download source file

[download id=”4″ format=”3″]

[/private]