Pixel Shader Effect Examples

Question

I've seen a number of pixel-shader effect examples, stuff like swirl on an image. But I'm wondering if anyone knows of any examples or tutorials for more practical uses of shader effects?

I'm not saying that a swirl effect doesn't have it's uses, it's just that many of the examples I've found have the basic effect explained and don't go into how it might be used subtly with another effect or transition to produce a wonderful effect. There's a video here, that outlines all the WPF Effects Library, but I'm not sure how I would use some of them in a practical context.

For example, when Flash 8 came out with effects like blur, I found a wonderful video that showed how to use the blur effect to create a cool effect with speeding text, that video inspired many ideas of what I could do with the effects in Flash 8. I'm looking for something similar with Pixel Shader Effects.

Answer 1

One practical thing that pixel shader effects enable ... are blend modes.

Check out Robby Ingebretsen's post on the matter (which discusses a useful way to take advantage of the linear burn blend mode). There is also a StackOverflow question on this subject as well.

In fact, I actually have written a blend mode library for WPF & Silverlight, and make it freely available at my blog. Following is a list of all my blend mode posts (all of which have source code and binaries attached):

• Blend Modes, Part I
• Blend Modes, Part II
• Blend Modes for Silverlight
• Blend Modes, Part III
• Blend Modes: Now Opacity Aware
• Blend Modes: Hue, Saturation, Color, and Luminosity with WPF 4.0

Hope this sparks your imagination ... and let me know if you toy around with the library!

Answer 2

I've used pixel shaders in different contexts. Mostly to wow users.

Here are two examples from me. Genie effect in Silverlight/WPF: live demo

alt text http://img121.imageshack.us/img121/6074/genied.jpg

---

Webcam support in Silverlight 4 gives you endless fun, when you combine it with shaders. I surprised a conference attendees with Bill Gates face, appearing on white surfaces. I set a flashlight next to webcam and...

alt text http://w2.com.ua/files/tinymce/images/Analytics/IT%20Jam%20/.thumbs/4bd67c03d4553251a72a01256fd9e61f_600_0_0.jpg

Web cam application is also availble here: live demo (you'll need Silverlight 4 runtime & web cam).

Wowing users is definitely not only way to use shaders. You could also do some costly calculus on GPU, but I can't find any good real-life example. And if you are a game developer (I'm not) you probably use shaders on a daily basis.

---

As for practical uses explanation there is not much in the Net, specifically to WPF/Silverlight technologies. One should go through adjacent topics, starting from HLSL language specification and ending with flash pixel bender. Here are some good references to start:

• HLSL Introduction by Chang Li.
• Announcment of WPF Pixel Shader Effects Library contains some links at the bottom.
• Shader X2 Books on Gamedev.net. ShaderX2 book shows different shader applications. Many of them are not applicable to WPF, but they still may give reader good feeling of practical uses.

I also described in details how I created Genie effect, but explanation is available only in Russian.

---

There are no build-in usage of shaders in WPF controls, as far as I know.

Hope this helps :). Cheers.