Hi,

I have just posted my XNA Shader Programming tutorial on my blog. I have had many presentations and workshops regarding XNA here in norway, and this is my collection related to shader programming.
The tutorials have been written as simple as possible in order to make them easy to follow. This means that there is no custom classes handling shaders, advanced scenes and so on.


Here are the first tutorials, but I will continue to add more:

1 - Intro to HSLS, ambient light
2 - Diffuse light
3 - Specular light
4 - Normal mapping
5 - Deform vertex shader
6 - Shader demo: Simple ocean/island scenery
7 - Toon shading
8 - Gloss map
9 - Wiggle post process
10 - Invert post process
11 - Grayscale shader
12 - Pixel distortion shader
13 - Alpha mapping
14 - Transmittance/depth buffers
15 - Dynamic Environment mapping
16 - Refraction
17 - Point light + Self-Shadowing
18 - Multiple Point Lights
19 - Hemispheric ambient light
20 - Depth of Field
21 - Transition: Fade
22 - Transition: Cross
23 - Blur
24 - Bloom

Hope this can be of help to anyone learning XNA,HLSL:)

Nice series. Congratulations!

Thank you! :)

I have added an other tutorial about gloss maps.

Very nice tutorial, thank you very much!

The only complain right now is that you could have a little more comments in the shader.fx, and some of your comments are in the Norwegian Language..

Yeah, the examples was in norwegian at first. I will go trough the tutorials later and fix it all and add some commets. Thank you for the feedback!

After three days of trial and error with shader-programming, I now finally understand how it all works! I modified your normal map example to work with multiple lights.

Now to the problem, after each render loop I want to use a spritebatch to draw some text to the scene. But if I use the spritebatch, all the 3d-surfaces get totally blank.

My code looks like this

TG Viking:

Now to the problem, after each render loop I want to use a spritebatch to draw some text to the scene. But if I use the spritebatch, all the 3d-surfaces get totally blank.

Let Teh Shawn show you the light. :)

Thanks for the tutorials. They made me understand better how the whole thing works ! Now, I can get fun with the shaders !

TG Viking: You need to call SaveState when using the spriteBatch. spriteBatch.

Begin(SpriteBlendMode.AlphaBlend, SpriteSortMode.Deferred, SaveStateMode.SaveState);


I'm happy these tutorials help you guys. This gives me a lot of motivation, and I'm currently writing a few more examples and tutorials :) Also, if anyone lives in Oslo, I will now start holding monthly XNA presentations at NITH ( A university college ),Oslo.

I will also update the old tutorials with comments once my work gives me some spare time..

Thanks for the help, it works now..

Im stuck on another thing, I want to know how I can send arrays to my shader.
//If my shader have this variable:
float range;
//I send my value like this:
effect.Parameters["range"].SetValue(8);

//But if my shader have this array??
float ranges[12];

Did you try this?

float[] myArray = new float[12];
effect.SetValue("ranges", myArray);

in the shader:
float ranges[12];


Or else, you can devide the array into a few float4s, but that might not be good enough.

Thanks!  Why didn't I think of that! This is the one that works:

effect.Parameters["ranges"].SetValue(new float[4] {1,1,1,1});

Sounds good :) I usually send paramteres to shaders like this, reducing the amount of declarations in the shader and less variables passed to the shader.

I still havent been able to update my tutorials this week due to a lot of work.. Work, eat, sleep every day.

I will fix this during the weekend :)

All tutorials updated!

I have commented all of the shaders in my tutorials and they are now uploading. If the download does not work, please try again soon!

Nice to hear! I run across another problem with your tutorial. The mesh (sphere.x) must have it properties changed to work on xbox, set "Generate Tangent Frames" to be True.

Yes, that is for normal map right?

yess, or else they they will only be gray spots on the model then it is played on xbox

Thanks, this is now fixed as well :)

My time is slowly starting to get balanced again after a hectic easter. This means I can start writing more shader tutorials. I got some tutorials in my mind but I want to know what you guys need to learn? Anything you want me to write about?

How about a shield effect tutorial? As in a transparent sphere around a spaceship or ground object that changes color/shape when hit.

I modyfied your bump-map code with multiple lights (3), that could be a good toturial. Im also interested in a multiple-lights+bump+specular+shadows, mostly how you would pick out witch object is affected by witch light. 

Sure, I'll add some multiple lights tutorials :)

I have added two post process tutorials, and will be creating a few more of them as this is the main area I get questions about.

My two new tutorials can be found here:
9 - Wiggle post process
10 - Invert post process

(and on the main post)

TG Viking:

I've never seen any solutions where you look straight into a lamp and get a nice light effect.

There are many ways of doing this, and HDR laighting can be a good approach. If you mean that "a nice effect" is only the viewer that gets blended, you can take the angle between the view vector and the light direction, and have a white quad on the screen that gets blended based on the Dotproduct between those two vectors.

TG Viking:

And one last thing, textures in the far background can be very noisy (looks like an old movie), how do you normally handle that problem?

Do you mean z-buffer fighting/flickering? If so, you can try and modify the near/far clipping plane dynamically, making it as correct as possible.

Good tutorial!
Can you write a tutorial about transparency and alpha maps?