In|Framez® Papers

Real-Time shaders in SOFTIMAGE|XSI 2 (and later)

By Homam Bahnassi


This tutorial is divided into the following sections:


Skill Requirements

In addition to the fundamental experience in using XSI, more knowledge is required in the following fields:
Applying shaders & using render tree. Painting vertex-colors.



All About Shaders

Doing 3D scenes for real time media is one of the major things I spend my time in (especially during the development of the new release of DirectSkeleton 3D engine). And the first scene I worked with was this scene (which we’ll use as the tutorial's sample).
(Download files used to complete the tutorial [449,563 bytes]).

The original game: Terminator™

This basic scene was prepared in XSI 1.5, then exported to dotXSI to show the new engine’s ability to open such a powerful format. Now, the games production pipeline has improved a lot in XSI 2 specially by supporting real time shaders and improved poly-reduction tools. So I think it’s a good idea to try the new workflow with my old scene and take benefit of the new real time shaders ability. Start your XSI and open the RTut_start.scn. You’ll see two light cones emitting from the light sources in the walker model. In this tutorial we’ll learn how to assemble a real-time shader tree for the light cones to produce an attenuated volumetric light effect.


Render Tree Planting

First of all, select the light cone which is named “Lspotlight” and open the render tree (press 7) to view all shader nodes. You'll see all shaders that are attached to the material. Notice that the real-time plug on the material node is empty. This is where we’ll plug in our shaders.

The light's default render tree

First, we need to attach a ‘Draw’ node to begin the first real time pass (RenderTree:Nodes>Realtime>Draw). Next, add a ‘shade’ node and connect it the previous plug in the ‘OGLDraw’ node. Finally, add a ‘Single Texture’ node and stick it to the ‘OGLShade’ node (RenderTree:Nodes>Realtime>Single Texture).

The real-time render tree growing up

Double click on the ‘OGL2DT’ node to open the texture PPG, select the ‘blue3_tga’ image clip from the clips list, change the modulation to ‘decal’ and set the texture projection to ‘Texture_Projection (Explicit UVWs)’.

Setting a smokey texture for the light

Now, before checking what you've just assembled, you need to change the viewing mode for the camera view to ‘Realtime Shaders’. Notice how the texture has been decaled on the cone.

A first look on what we did

Next, we need to add some transparency to the light cone. Double click on the draw node to open its PPG. Turn on ‘Enable Blending’, and set the blending modes to ‘Source: ONE’ and ‘Destination: ONE’. Change ‘Culling’ to ‘BACK’ to prevent the hardware from rendering the back faces of the mesh.

Setting up the blending mode

This is called ‘Additive’ blending. You'll notice that light cone has become constantly transparent.


Painting

To complete the effect, we need to add fading to simulate light attenuation. We'll use a technique commonly used in the game industry to achieve this; which depends on the model’s vertex color alpha channel to compute blending values. So let's begin painting the vertices of the light cone. Change the viewing mode (View>Display Options[All Cameras]) from ‘Show RGB Color’ to ‘Show Alpha’ so you can see the alpha color values on the model as you paint them.

Visualizing Per-Vertex Alpha Values

Add ‘Color at Vertices’ property to the light cone (Render:Property>Color At Vertices). Next, open the Brush Properties PPG (Ctrl+w) and set the painting color alpha value to 0 (completely transparent) and be sure to turn off all bleeding options.

Choosing the transparent color

When ready, paint the vertices farthest to the emission point (Shift+w).

Painting the light cone's base vertices

After finishing your paint work, change back the viewing mode to ‘Show RGB Color’. Finalize the effect by opening the draw node from the render tree, then changing the blending mode to ‘Source: SRC_ALPHA’ and ‘Destination: ONE’. One last thing should be done is to setup ‘OGL_Shade’ to compute shading only from alpha info that we supplied. This is done be turning off ‘enable lighting’ in ‘OGL_Shade’ PPG. Now you should see how the light cone fades out along the area you painted with “black” alpha.

Copy the render tree from the cone you just done to the other cone. This could be done by saving the render tree of the first cone as a preset, then loading it onto the other cone’s render tree. And for the vertex color information you could copy it be doing some drag’n’drop in the explorer view.


HUD Display

Our scene will be overlaid by a HUD display; which will display vital info to the player on the status of Terminator. Unhide the display HUD grid which has another render tree setup. Examine it to see the real time shaders that are used there.

Terminator's HUD




Limitation Note

For most of today’s hardware, blending requires some processing to z-sort the models’ polygons from far to near. Without this, objects behind translucent models may not render at all, even though they have totally transparent areas. This case may appear in XSI ‘real time shaders’ view mode. That means when you enable blending in the ‘draw’ node on a mesh that is created before the others in the scene the blending will not work, and every mesh behind the blended mesh will not show at all.

XSI's draw order affects blending operations

One available workaround is to control the drawing order manually by cutting and then pasting the object to bring it to the end of the drawing order. So, the objects last created, are last drawn. Translucent models should be drawn last to get proper blending.


Games and Beyond

Using real-time shaders in XSI2 is a great way for simulating the game results in your authoring software. SOFTIMAGE|XSI extends this pipeline by allowing you to transfer your render tree to the game engine through the dotXSI file format; which means no more unexpected results, nor programmers having to make artistic decisions in writing shader setups (Yuck!).
Game development workflow can be pushed even further by simulating most of the game behavior in your authoring software by using expressions/scripted ops and external scripts. So don’t be surprised next time if you see any one playing his game in XSI!


See Also

To view the actual real-time scene with full interaction you can download the compiled Terminator™ application which contains the same scene exported to dotXSI, and viewed by DirectSkeleton 3.0.



Special Thanks

to Wessam Bahnassi for his explanations on the objects drawing order for real time blending. Additional special thanks goes to the guys at Softimage who supplied the nice walker model with the dotXSI FTK 3.0 which I used in this tutorial.
Built on Thursday, Nov 14, 2002