Enjoy it!   Benny

Download audio file (bennyfunkandsoulmix_128kbit.mp3)

Right click and download here

german version

To create this nice fragmentation effect like the one from Andy Foulds`s homepage, i have written this little AS3 Class. The first part of the tutorial will mainly focus on how to get this effect running. The second part shows a way to get an arbitrary DisplayObject onto the fragmentation layer to create a cooler transition effect.

The example code uses a DocumentClass wich is just executed by “FragmentExample.fla”. So don´t be confused if you do not find any AS3 in the *.fla file.

To start the effect from Flash you have to follow these steps:

1. Import Packages:

1

import de.ehrhardt.fragment.*;

2.  Create new fragmentation layer:

2
3
4
5
6
7
8
9
10
11

var rectSize:int = 10;
var updateRate:int  = 30;
var fxDirection:String  = "left";
var bgColor:int = 0xCCCCCC;
var borderColor:int = 0xCCCCCC;
var borderSize:Number = 0.2;
var startNow:Boolean = true;
 
var fragLayer:FragmentLayer = new FragmentLayer (your_mc, rectSize, updateRate,
                       fxDirection, bgColor, borderColor, borderSize, startNow);

3. Define RectSize:

13

your_mc

…should be replaced from your DisplyObject´s instance name. You have to take care that the dimension

s of the object are mapped exactly, because this feature is not introduced here. E.g. a MC with dimension of 220×110 pixels should have rectSize = 10 because of incorrect covering.

4. Set Frame Rate:

More than 25 Frames per second are recommended for proper animations. You find it in Flash under the designation “Properties”.

(optional:)
5. Manual effect start, e.g. after a MouseClick Event:

14
15
16
17
18
19
20

your_mc.addEventListener (MouseEvent.CLICK, clickActionHandler);
 
function clickActionHandler (e:Event):void
{
    fragLayer.startEffect();
    e.target.removeEventListener(MouseEvent.CLICK, clickActionHandler);
}

In addition you have to set the variable startNow to “false” :

21

var startNow:Boolean = false;

Done.
We have finished the first part. How to put an image onto the Fragmentation-Layer to create a nicer transition, i´ll show in the next part.

Download Sources

Entstanden in 3DStudio Max, exportierte PNG-Sequenz wurde auf 4 PCs in einer halben Nacht gerendert. Nachbearbeitung in Aftereffects und Premiere. Achtung: Die statistischen Daten sind allesamt frei erfunden ^^

Enjoy!

Meine ersten Kontakte mit psychedelischer Musik, um genauer zu sein mit Psychedelic-Rock bekam ich schon im zarten Alter von 10jahren. Zumindestens reichen meine Erinnerungen bis dort was den Bezug zur Musik im Allgemeinen angeht. Es waren die Platten eines damals noch eher rebellischer wirkenden Vaters, mit Künstlern wie Deep Purple, Led Zeppelin bis hin zu FRANK ZAPPA!!! Das darauf nur etwas später, unweigerlich eine GOA-Karriere meinerseits resultierte war eine logische Schlussfolgerung, was mich heute im Kontext mit gestalterischen Interessen zu dieser Post veranlasst.

Animation steht ja für die meisten Menschen heutzutage, im Dialog zum Computer und der entsprechenden Software. “KLAR, WIE AUCH SONST?!” denkt sich der ein oder andere…. ATTENTION!

Mein Beweiß, ein animiertes Musikvideo aus dem Jahre 1978 von Frank Zappa zum seinem Song “City of tiny lights” Ein psychedelisches Feuerwerk aus Knete zerschmolzen zu einer, wie ich finde großartigen Animation für einen super Song!

Schaut es euch an und seht selbst, Feedback is welcome

Frank Zappa – City Of Tiny Lights

Greetings
Matthias