3D effect with filters

Posted on March 14, 2008
Filed Under Flash Tips |

By mixing multiple layers of filtereffects you can make this nice little 3d-effect.

Flashcontent

Here is the recepy:

Create these filters:

var filter1 = new flash.filters.DropShadowFilter();
filter1.angle = 90;
filter1.distance = 1;
filter1.blurX = 0;
filter1.blurY = 0;
filter1.color = 0xf3d22f
filter1.strength = 1;

var filter2 = new flash.filters.DropShadowFilter();
filter2.angle = 90;
filter2.distance = 2;
filter2.blurX = 10;
filter2.blurY = 10;
filter2.color = 0×000000
filter2.strength = 0.5;

var bevelFilter = new BevelFilter(2,90,0xfedc74,10,0×929292,10,2,2,0.42);

Add “filter1″ 12 times or what you prefer (myMC.filters[filter1,filter1,...]).
Add a regular drop shadow ( “filter2″) at the end.

In this example a have added a beveleffect (”bevelFilter”) to each slice. To get the correct z-rendering of  the blue slice I scripted a mask, based on the angle of that slice.

 The downside is the lack of antialiasing on the edges.

Leave a Reply




For and by the developers at swedish digital agency Projector.