Adding Shaders and Pixel Bender to Away3dlite

June 3, 2010

Adding Shaders

Once you’ve experienced the speed of Away3dlite you next want to bump up its appearance. The best way to do that is by using Pixel Bender shaders….and with Pixel Bender the sky is the limit! In this post, you get the code that let’s you do that, and you learn to add shaders and Pixel Bender to Away3dlite. The same approach is applicable to PV3D.

Here’s the demo

Shaders in Away3dlite

Shaders in C

Check out the video!

Download the Code

Read Some Discussion

The key to getting this to work was to first get all the shaders over into Away3dLite, then instantiating the ExLight example in Flash Builder and using switch case to create the different materials for your model.

Here’s what the switch case code looks like. It is really simple…everything else is in the video and the download…cheers!

override protected function onInit():void


var md2:MD2 = new MD2();

var light:Light = new Light();

var _texture:Bitmap = new Texture as Bitmap;

var _bitmap:BitmapData = new BitmapData(_texture.width, _texture.height, false);


var _normalMap:Bitmap = new Normal as Bitmap;



case 0: //Normal Shader

var rLight:DirectionalLight3D = new DirectionalLight3D();

rLight.direction = new Vector3D(1, 0, 0);

rLight.color = 0xFF0000;

rLight.ambient = 0.1;


var gLight:DirectionalLight3D = new DirectionalLight3D();

gLight.direction = new Vector3D(0, 1, 0);

gLight.color = 0x00FF00;

gLight.ambient = 0.1;


var bLight:DirectionalLight3D = new DirectionalLight3D();

bLight.direction = new Vector3D(0, 0, 1);

bLight.color = 0x0000FF;

bLight.ambient = 0.1;


var material:BitmapMaterial = new Dot3BitmapMaterial(_bitmap, _normalMap.bitmapData);

material.smooth = true;

md2.material = material;

md2.centerMeshes = true;


case 1: //Plane Material

/*var filter1:BevelFilter = new BevelFilter(10, 45, 0xFFFFFF, 0.5, 0x000000, 0.5, 10, 10, 50);

var filter2:GlowFilter = new GlowFilter(0xFFFFFF, 1, 50, 50);

var filter3:GlowFilter = new GlowFilter(0xFF0000, 1, 50, 50);


var planeMaterial:BitmapMaterial = new BitmapMaterial(_bitmap);

md2.material = planeMaterial;

md2.centerMeshes = true;


case 2: //Flat Shader

var myFlatShader:FlatShader = new FlatShader(light);

md2.material = myFlatShader;

md2.centerMeshes = true;

light.x=light.y =400;

light.z = -400;



case 3: //Phong Color Shader

var myPhongColorShader:PhongColorMaterial = new PhongColorMaterial(light, 0x00ff00);

md2.material = myPhongColorShader;

light.x=light.y =400;

light.z = -400;


md2.centerMeshes = true;


case 4: //Phong Shader

var myPhongShader:PhongMaterial = new PhongMaterial(light, _bitmap);

md2.material = myPhongShader;

md2.centerMeshes = true;

light.x=light.y =400;

light.z = -400;



case 5: //PBJ Filter

var mat:PBBitmapShader = new PBBitmapShader(light, _bitmap, _normalMap.bitmapData);

md2.material = mat;

md2.centerMeshes = true;

light.x=light.y =400;

light.z = -400;



case 6: //Shader

var mat2:PBTransparentShader = new PBTransparentShader(light, _bitmap, _normalMap.bitmapData);

md2.material = mat2;

md2.centerMeshes = true;

light.x=light.y =400;

light.z = -400;



case 7: //Shader

var myShader:VertexShaderMaterial = new VertexShaderMaterial(light, _bitmap);

md2.material = myShader;

md2.centerMeshes = true;

light.x=light.y =400;

light.z = -400;




trace(“Out of range”);



var loader:Loader3D = new Loader3D();

loader.loadGeometry(“assets/torsov2.MD2”, md2);

loader.addEventListener(Loader3DEvent.LOAD_SUCCESS, onSuccess);


camera.z = -200;



Creating a Simple Flip Book in Flash Builder

January 28, 2010

Flip Book Intro

Here’s a simple flip book I created using Flash Catalyst and Flash Builder.


Flip Book



Hope you get some use out of this.

Creating a 3D Room in Flash Catalyst (in 6 lines)

January 23, 2010

Building a 3D Room

Creating a 3D room could never be easier than in Flash Catalyst…and with only writing six lines of code. Now of course it takes more than 6 lines of code to create a 3D room…about 80 using Flash Catalyst. But 74 of them are auto-generated for you. It’s all click and drag and once you bring it into Flash Builder…you just need to add 6 lines of your own to make everything operational.

Check out the demo below:

3D Room Demo (Click the Image)

3D Room Demo


Note: My son James Lively created the images if you use them please give him credit.


Video 1: Building a 3D Room in Flash Catalyst (1 of 3)

Video 2: Building a 3D Room in Flash Catalyst (2 of 3)

Video 3: Building a 3D Room in Flash Catalyst (3 of 3)

What’s Important Here!!!

(1) It was all created with only 80 lines of code (74 auto-generated)
(2) It uses very little system resources…your computer doesn’t run hot or slow down
(3) The images are easily replaceable…so create as many rooms as you want
(4) Development time is decrease by a factor of 10
(5) You are not limited by Viewport size or anti-aliasing concerns
(6) It’s just great fun!

Click the link below to see the code.

Read the rest of this entry »