Well.. everyone loves transitions right? I do anyway. Even if they are utterly useless like the firefly one I posted a few days ago I still enjoy it just for the sake of the ‘ooooo‘ effect it can produce. I’ve always been a bit of a sucker for the pure visual parts of flash, which is probably why I went in the direction of ActionScript instead of C# or something else.
This class will take any content you give to it (A displayobject is required though) and distort it with the help of Perlin Noise, DisplacementMapFilter and a Blurfilter. The end result is something that looks like its ‘rippling out‘. (lack of better words! haha)
It dispatches an event when the content is completely gone, and you can choose what to do before starting the ‘road back’ so to speak. The last event it dispatches triggers a reset of the parameters so you can do it all over again! Click the ducky to try it! Download the class inside…
As always, if you like it, it’d be cool if you left a digg or a comment! I’ll answer any questions you might have in the means of time or whatnot ;)
Download here (20Kb) (1312 downloads)


June 25th, 2008 at 8:01 pm
Excellent effect Erik, I dig it probably even more than the fireflys, which were super cool…
June 26th, 2008 at 2:53 pm
Awesome as ever. Again, like it more than fireflies, this one’s a little more, subtle I guess : ).
Was this used in the Virgin campaign?
June 26th, 2008 at 3:35 pm
Thanks you guys.
Law; Yes and no. The Virgin effect was based on somewhat the same logic, but it was in Actionscript 2 :)
June 26th, 2008 at 4:25 pm
Dude. This effect is sick thanks soo much for posting it.
June 29th, 2008 at 2:06 am
Cool effect!
Great work as always!! ;)
July 2nd, 2008 at 4:31 am
Nice to see you updating this one to an AS3 version, I’ll probably be using it at some point in the future…
July 10th, 2008 at 6:30 am
Meh! ;) (that obvious internet comment)
July 11th, 2008 at 8:03 am
I’m a newbee at AS3 and have a question for you experts. I downloaded this file and and all that it had was one layer, with the bstart object - movie clip - instance of start in it. No action layer. Could somebody reply with the code that’s supposed to go into an action layer. Thanks ahead of time. And again I’m a newbee to AS3 so if you could give me some direction as to what to do as well I’d appreciate it, thanks!
July 11th, 2008 at 8:15 am
Mike, it uses a document class for the code.. check down in the properties for your project where the size and background color shows up.. you can see document class and a link to it. You can click the little pencil to open the file, or double click it directly in the folder (baseClass.as)
July 11th, 2008 at 8:36 am
Pro,
I did that and it says that the “definition for the document in the classpath could not be found” I have the fla file and the baseClass.as in the same directory. In that document class do I need to list like everything in the path, documents/test/FlashWork/perlin_transition(2) Folder/baseClass.as??? All that I had in the document class was baseClass.as. I must be doing something wrong… Also when I test he movie the click to activate text isn’t considered a button. When I rollover it it doesn’t do anything. Don’t I need to- in the Actions Layer that I don’t have- state something about the instance of start being a true button or something?
Newbee
July 17th, 2008 at 4:14 pm
Ok. Post more.
July 19th, 2008 at 1:55 pm
When will you post more? I need a better transition.
July 21st, 2008 at 12:20 pm
Could you possibly give me the actual fla file for this example. There’s no actions layer so that is whats wrong with the click me to activate movie clip not being a button.
July 30th, 2008 at 9:05 am
lovely transition, well done.
My work won’t upgrade me to CS3, so i’m still working with AS 2.0
I converted your PerlinDistort class to AS 2.0 and works great.
If anyone is interested, I’ve put a copy of the AS 2.0 version on my server:
http://www.alexh.org/z/PerlinDistort.zip
August 21st, 2008 at 3:23 pm
[...] Transition effect for AS3 with Perlin noise and DisplacementMap [...]