Creative COW SIGN IN :: SPONSORS :: ABOUT US :: CONTACT US
ADOBE FLASH: Adobe Flash ForumAdobe Flash TutorialsAdobe Flash Video TutorialsWeb Streaming ForumAdobe Flash

Growing effect, stroke animation with flash from illlustrator path

Cow Forums : Adobe Flash
Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Feb 7, 2007 at 1:46:47 pm

Hello Everyone,

New member posting... Thanks to CreativeCow for all Tutorial and everything :-)

I am also new to Flash and damned I can't find how to do a "growing effect" with some illustrator path. I searched a lot wohtout finding the way to do this (except using a mask maybe but it seems complicated for multiple path ?)

I want to animated some lines growing and (drawing) following the illustrator path from first anchor point to last one.
Like this (short sample A or B, here made in AE, I wanted to do the same in Flash with illustrator path):

http://www.sbgraphic.ch/download/flash_flv_player/test.html

Is there a way with some simple "actionscript" or other tips to do so (something like the "stroke render" in AE). I also have C4D and I wonder if I can use it to do so.

what is important is I want to use vector only files in order to get a light but large web .swf background animation.

if someone knows where i can find tips etc...

Many thanks in advance
Eric


I've really searched but did not find my solution sometimes it a lack of correct keyword for search

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by grafxflow on Feb 7, 2007 at 6:44:16 pm

Hi,

What about doing a mask in flash and use a keyframe every 10 frames, then use motiontween to fill in the frames.

regards
grafxflow

grafx that flow!

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Feb 7, 2007 at 11:10:58 pm

Hi,

Thanks for your first reply.

is there a another simpler way... ? without a motion tween mask ? like specifying the "drawing" of each path on a different layers for exemple.

Thanks,
Eric

Respond to this post   •   Return to posts index


Re: Growing effect, stroke animation with flash from illlustrator path
by grafxflow on Feb 7, 2007 at 11:44:04 pm

Hi,

Would it be possible to import the illustrator file in after effects and add the 'stroke render' then export the file out as a swf file. Then import this into flash.

I have done this with a clip of someone walking in after effects and because it was a mask and vector based flash imported it with no problems, plus it was a small file.

regards
grafxflow

grafx that flow!

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Feb 8, 2007 at 10:05:06 am

Hi,

well, why not... I'm worried about the size but I'll try, I'll let you know.

Eric


Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Feb 8, 2007 at 10:57:24 pm

"it was a mask and vector based flash imported it with no problems, plus it was a small file."

Hi,

how did you export as vector from AE then ? (if I use the Render/Stroke effect) I only can export .swf with a "pIxellised" effect. Of course if I pixellise the effect it render but it will be far to heavy if I want to keep scaled capabilities like vectors.

Thanks, I'm still searching....

Respond to this post   •   Return to posts index


Re: Growing effect, stroke animation with flash from illlustrator path
by grafxflow on Feb 9, 2007 at 12:37:59 am

Hi, Okay I've just tried it your right. But I have the answer.

Create a new composition in after effects, and add a solid.
Add your illustrator file as the mask and use the filter stroke. You will have a nice animated line etc.

Now select keying/colour key (or keylight, it would be better) and choose the solids background colour. You may have to change the edge settings to something like 2 if it is colour key.

Now with the solid layer selected go to the menu and choose layer/auto-trace. As a test I set tolerance and threshold to 1 and choose Work area. This may take a while. But an new Mask layer will be created.

Delete the original solid layer. And then export again as a swf file. This should work. Get back to me!

Keylight is an extra plugin not built in to after effects.

grafxflow


grafx that flow!

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Feb 19, 2007 at 12:05:26 am

Hello Grafxflow,

Sorry for not replying earlier... was a bit busy
That's a great tips, I can make it working that way but I just have another trouble now in flash (I'm lost there):

Now that i have my mask converted in swf, there is a lot's of keyframes with no tint (images?), how can I selected them (set them?) all together with the the same colour or same stroke, I could find how yet, I could but only one frame after one, ther must be a possibilities (or with an action script)

I also find a good way with Cinema 4D but the render is a bit slow with Flashex (but it's in 3D then)

Thanks for your help again :-)
Eric


Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by grafxflow on Feb 19, 2007 at 9:02:41 pm

Hi,

You have loads of frames on your main timeline?? Yes.

Copy all those frames. Go to your library and create a 'movie clip' then paste all the frames into the 'movie clip's timeline. Delete all the frames from the main timeline only, not the 'movie clip's timeline. Now just place the 'movie clip' from your library onto the main timeline. You should be able to select the movie clip and change its colour tint.

grafxflow

Respond to this post   •   Return to posts index


Re: Growing effect, stroke animation with flash from illlustrator path
by Funkyrico on Feb 20, 2007 at 1:41:23 am

Hi,

Thanks, Finally I've done it, first I did not select the clip only the frame..., but I should have to select the clip in the view, not the frame... huhuhu. I thought I could edit all frames together.

It's nicer your way :-) pfff... i'll put one test with a link later.

hmm if I may again another last question...
is it possible to edit then all symbol together, e.g. to smooth or optimize some curves ?
I've tried but I could only one frame by another (on the clip, symbol) (e.g. i could separate some forms then optimize)

Many thanks again
Eric

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by grafxflow on Feb 20, 2007 at 7:21:05 am

Hi,

If I understand you correctly then you need to use the 'edit multiple frames' option.

Where you have your timeline, at the bottom left are icons. Select the one that looks like 2 dark blue boxes with one overlaping the other. When moving your mouse over it you should give a message saying 'edit multiple frames'.

grafxflow

Respond to this post   •   Return to posts index

Re: Growing effect, stroke animation with flash from illlustrator path
by Funkyrico on Feb 21, 2007 at 12:25:52 am

Hi,

You've just understood perfectly, Many thanks again for all your tips.

(it 's a bit hard for me to get into the Flash interface yet, but I hope to progress... :-D )

I'll work on the design now I know how to do it !


Cheers,

Eric

Respond to this post   •   Return to posts index


Re: Growing effect, stroke animation with flash from illlustrator path
by funkyrico on Sep 19, 2007 at 3:41:33 pm

Hello,

Sorry this link has been updated:

http://www.sbgraphic.ch/download/mediaplayer/sbgd_lab/sample.html

I still have to finish my tests... too busy!

Thanks,
Eric




Respond to this post   •   Return to posts index

<< PREVIOUS THREAD   •   VIEW ALL THREADS   •   PRINT   •   NEXT THREAD >>


FORUMSTUTORIALSMAGAZINEDVDsBOOKSPODCASTSEVENTSSERVICESNEWSLETTERNEWSBLOGS

© CreativeCOW.net All rights are reserved.

[Top]