Good tutorial on writing shaders?

Forum for plugin, effect and behavior programmers. Please use the Help & Support forum for help using Construct.

Post » Wed Apr 02, 2008 2:57 am

Hey, anyone know a good tutorial on writing shaders and the general concept? I mean, I know what they do in concept and know the general differences between each version... But I'd like to try my hand at writing some, assuming I can find a good place to start...


That, mainly since there's support in Construct for scaling apps to run under different shader models, but most of the effects are for 2.0 and it would be cool to somehow make a nifty effect for one of the other models...
B
4
S
1
G
5
Posts: 65
Reputation: 1,932

Post » Wed Apr 02, 2008 5:10 pm

Unfortunately no documentation exists on this yet - I think the best place to start is looking at other effects. Additive Plus is a good example, since it is an intensity-customisable version of the Additive effect. It's very simple. If you ignore the miscellaneous definitions around the file, the main function is EffectProcess(), which calculates the effect:

[code:j5si1p0d]// Effect function
float4 EffectProcess( float2 Tex : TEXCOORD0 ) : COLOR0
{
// Add the front and back pixels
float4 front = tex2D(foreground, Tex.xy);
float4 back = tex2D(background, Tex.xy);
back.rgb = (front.rgb * intensity) + back.rgb; // Add colours
return back;
}[/code:j5si1p0d]

This can be summarised as:
1) Get the foreground pixel
2) Get the background pixel
3) Add together the foreground and background pixel (with intensity) and store result in 'back' (note the addition, hence 'Additive blending')
4) Return 'back', which is the result of the effect.

That's a simple blending effect, which means it basically combines the texture and the background in some way (alpha channels are an example of blending, because they combine the foreground and background). Other good blending effects are Dodge, Multiply Plus, Subtractive Plus etc.

Note effects like Multiply (the PS 0.0 version with no intensity) are coded simply by render states, which is a limited way of processing effects on cards with no pixel shader hardware - I think we've covered most of the useful things that can be done with renderstate-only effects, though (but feel free to experiment).

Other distorting effects simply use the texture to distort a texture in some way. Magnify is a good example - the texture's colours never reach the display, they're just used to define how to distort the background. Warp is another good example that just uses sin and cos to make a kind of flag-waving effect on an image.

Finally there are more advanced effects like the Blurs, HDR and combination... I guess these would take full on documentation to fully explain.

Also I've found a fairly good general explanation of shaders here:
[url:j5si1p0d]http://www.facewound.com/tutorials/shader1/[/url:j5si1p0d]
It explains shaders in a general way pretty well, but it obviously doesn't cover Construct's implementation of shaders.
Scirra Founder
B
359
S
214
G
72
Posts: 22,952
Reputation: 178,630

Post » Thu Apr 03, 2008 1:59 am

Oh cool.. That makes sense... I'll play with it a bit and try to understand it better...

thanks
B
4
S
1
G
5
Posts: 65
Reputation: 1,932


Return to Construct engineering

Who is online

Users browsing this forum: No registered users and 1 guest