Jean-Marc Le Roux Web, RIAs and chocolate spaghettis…

Minko 1.2: Easier Post-Processing Effects

I've just pushed an update on Minko's GitHub repository. It is tagged as version 1.3 1.2. This new version introduces new helper classes to make it easier to write post-processing effects.

The New Simplified Post-Processing API

Writing a single pass post-processing effect has never been easier, here is how to write a simple greyscale post-processing shader (go to the end of the post to see it in action):

public class GreyscalePostProcessingShader extends PostProcessingActionScriptShader
{
  override protected function getFinalColor(outputColor : SValue) : SValue
  {
    return float4(
      float3(divide(add(outputColor.r, outputColor.g, outputColor.b), 3.)),
      1.0
    );
  }
}

And here is another example to create a "vignettage" effect (it darkens the corners of the viewport):

public class VignettagePostProcessingShader extends PostProcessingActionScriptShader
{
  override protected function getFinalColor(outputColor : SValue) : SValue
  {
    // f = distance(pixel, screen border)
    var f : SValue = length(multiply(subtract(interpolate(vertexUV.xy), .5), 2.));
 
    // f = f^3
    f = saturate(multiply(f, f, f));
    // f = 1 - f
    f = subtract(1., f);
 
    return multiply(outputColor, f);
  }
}

And then, where you initialize the Viewport:

viewport.postProcessingEffect = new SinglePassPostProcessingEffect(new GreyscalePostProcessingShader());

As you can see, writing a single pass post-processing shader is really simple:

1. Extend the PostProcessingActionScriptShader class.
2. Override the getFinalColor() method to implement your shader.
3. Set the Viewport.postProcessingEffect property to a new SinglePassPostProcessingEffect using your shader.

Multipass Post-Processing

If you need to write multipass post-processing effects, it's just as simple as when you work with a rendering effect: implement the IEffect interface and create an IEffectPass class for each pass or reuse the provided SinglePassEffect class (because a single pass effect is... a single pass).

In Blacksun, we use this technique to create the HDR Bloom effect that uses 5 passes:

Live demo right after the jump...