When Noise Shouldn't Be Noisy

(there's a video at the end, if you're the sort to cut to the chase)

Typically when we implement noise in graphics, we're doing it to hide some too-accurate border or pattern, and we think "well, we'll smutz things up a bit" - and we reach for perlin noise, or maybe a gaussian blur, or whatever.

Stop!  Stop right there!

Take a second to think about what you're actually simulating, and whether one of those general noises or blurs is really the best option.  I'll grant you that it's often the best choice for photorealism, since what you're covering for is a lack of accuracy (though even then - stop and think), but for non-photorealism (NPR)?  All blurring communicates is a blurry line, is that really what you want?  Especially if your style is defined by hard-edges, you don't necessarily want to blur that aliased edge, all you really want is to break the pattern up so that it looks appealing rather than aliased.  NPR demands a defter touch.  Thus, enter one possible solution: recursive texture sampling.

The idea is simple.  Take your UV coordinates at some given point on a triangle, however they might be generated (more on that in a sec), and sample some interesting texture.  Now take that pixel's RG (or GB, or RB, or BA, or whatever coordinates make sense given your application and texture), and sample that same texture again using the RG as your UV.  That's pretty much it, on a basic level... but you'll need to get a bit fancier for good results.

First thing you might want to do is experiment with clamping those coordinates.  You can of course just wrap them and get decent results, but depending on the frequency domain of your texture, that may be a bad idea, and you might be better off thinking of the coordinates as clamped/scaled offsets from the original UV.  Next thing, well, ok, great, so now your texture is warped.  That's handy for edges, I guess, and maybe for texture generation, but let's kick it up a notch.

I most recently used this to create a water plane effect (which you can see in the below-linked video).  Water has layers, and I figure we've already got these intermediate colors sampled as we drill down recursively, so the first thing I did was to retain each step's resultant color values.  The other important bit is animation, which you get by starting with animated UVs. Now take the result RG channels, add a second independent offset vector (Vec(RG) + Vec), then use the resultant coordinates sample again.  Then take THAT RG, add a third independent offset, and sample one more time.  I scaled each successive offset (1.0, 0.75 and 0.5) as well, to give a sense of increasing depth for each layer.  Then take the 3 color values you have (1 unwarped / just a UV animated surface, your first recursion, and your second recursion), blend them with 0.3333 weight apiece, and render.  You probably also want to "swish" each layer animation back and forth, and you especially want to make sure the animations take place along different directions - the trick here is to separate the vectors enough that you don't get horribly noticeable tiling.  It's difficult but possible, and also depends on your texture, but the key here is just to experiment.

If all you're wanting to do is break up an edge, a shadow for instance, consider that the surface you're casting on can itself be used as the seed for this technique - and if you happen to be rendering deferred, odds are good you've even already got that color sampled.  Use that color as your noise instead of a more costly calc, and you might like the results. Want lava instead of water?  Change up your texture to something with a different overall color shape, and you'll affect the flow, or change up which layers you use or discard/just recurse through, and you'll change its sense of depth and movement.  In any case, one of the many surface effects you can get in this possibility space is what we ended up with, distortion water:

http://www.youtube.com/watch?v=1rvoeZKTfoY

(the video isn't the greatest, but you get the idea - and note that there is no lighting applied to this, no normal mapping, nothing, that highlight'y shiny effect is purely the result of the warp)

[see more from Megan Fox at her primary site, Glass Bottom Games]