It’s no secret that I like graphics. It’s the main reason why I play video games and it’s the main reason I got into programming. So obviously I was delighted to be invited and to join to the Away3D team last month. Inspired by my earlier Stok3d project (now on the backburner for a bit), I set off to create similar normal mapped pixel shaders, this time in full 3D. After some rough first patches (Stok3d was pretty simple since it only used DisplayObjects, flat planes), things have luckily shaped up, leading up to the first release!

The current state is a dot-release (3.4.2), so the exact implementation might still change while we’re working towards a shiny new 3.5.

The new shaders

So what is the difference with the previous shaders? Using Pixel Bender, the shading is calculated for every pixel in the texture, resulting in much more detailed and realistic lighting or reflections. Each shader requires an object-space normal map, which you can use to add detailed shading information without increasing the polycount of the mesh.

The shaders come in three flavors: environment map shaders, and single- and multi-pass shaders. Single-pass shaders take one PointLight3D and any AmbientLight3D on the scene to calculate the lighting, whereas multi-pass takes any number of lights of any type (AmbientLight3D, DirectionalLight3D, and AmbientLight3D). Important to note, tho, is that every light adds another pass and will be slower. Of course, if you’re only using 1 light, always use single pass.

Check out the following classes in Google Code:

• SphericEnvMapPBMaterial:  spheric environment mapping
• Cubic EnvMapPBMaterial: cubic environment mapping

• DiffusePBMaterial: Single-pass, adds diffuse lighting to the texture
• PhongPBMaterial: Single-pass, adds diffuse lighting and specular highlights, with support for specular maps
• SpecularPBMaterial: Single-pass, adds only highlights – can be used in combination with Prefab3D’s prebaked lighting to create view-dependent specular highlights

• DiffuseMultiPassMaterial: Diffuse shading with multiple light sources
• PhongMultiPassMaterial: Phong shading with multiple light sources

Demos

Enough explanations, time for some demos! Right-click to view source:

• Cubic environment mapping
• Single pass shading: showing how a detailed normal map and specular map can enrich the shading
• Multi pass shading: using 3 lights (directional moonlight, firefly, and a flickering flame) and ambient

That’s it, enjoy! Feel free to drop by the mailing list for questions or read the official announcement! For now, I need to get some sleep before Flash on the Beach kicks off

When Alternativa3D showed some demos with their parallax mapping, I always thought it’d be interesting to try it myself without having to resort to PixelBender.

Well, I did, and I wasn’t happy how some things turned out. There was no overlap of objects, and sharp edges would come out looking odd or distorted. Then, taking another look at their demo, I noticed they conveniently used slanted or smooth edges all the time without any possible overlap.

Reading up on some stuff, I decided to make the process iteratable, and liked it much better already. There are some downsides… Most importantly, it’s a cpu-killer and still pretty flawed compared to the real thing (which is a pixel shader). Nonetheless, it was fun to figure out and code, and that’s pretty much the reason why I decided to post it

Oh, and I also rewrote the Bump Map from some time ago, since I needed it to make this demo a bit cooler overall. The code back then was a quick experiment; not exactly a beauty nor reusable whatsoever, which has been taken care of to some extent. Additionally, the lightmaps now support colours and you could just as well write your own.

Check out the demo here and the source here. The images used came from here.

Bump mapping in AS3 has been done a couple of times before already, but I thought it would be cool to try out the effect with a seperate bump map for diffuse and specular lighting (with only slightly different logic for each ‘layer’, and that is how the light maps are calculated). It’s great to create wet surfaces or waterdrop effects.

Well, there’s not much more to say about it, it’s a rather old topic anyway Enjoy the demo, and the source can be viewed by right-clicking, or here.

EDIT: I adapted the code a bit to fix the white pixels appearing