SEARCH
Newsletter
Subscribe to get design tips, latest trends, free stuff and more.
It doesn't look like an e-mail address

hosting

  Tutorials Flash & Swish Flash Tutorials Vector Tutorial : Vector Tutorial : Exporting Animated SWF Files From Illustrator

Vector Tutorial : Vector Tutorial : Exporting Animated SWF Files From Illustrator

aiVault Flash Tutorials Feb 28, 2011

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.

subscribe to newsletter