Clinton Rocksmith's Blog

Musings of code, video and audio

Creating the perfect Alpha Channel using Pixel Shaders Part 2

In part 2, we take the Pixel Shader we created in part one and inject it into a Silverlight project.

We look at the standard Color Key effect and how it chokes the element we want to use and we also look at the finished result of the Maori’s walking over the hill.

I also forget how to make a video loop, but I’ve fixed it in the code for you to download and play with. The code also overlays 2 videos and 1 image background so you can see the power of what you’ll be able to create.

You can download the files:- HERE

  • Rob says:

    How do you make the side-by-side alpha channel video? I have multiple movies I need to convert to this format.

    July 30, 2011 at 1:58 am
  • Rob says:

    We’ve modified the pixel shader slightly because we were having quality issues with the scaling of the image. With this shader the right side of simply masked.

    // The texture is loaded into this Register as Texture1Sampler
    sampler2D Texture1Sampler : register(S0);

    float4 main(float2 uv : TEXCOORD) : COLOR
    {
    //Double the screen Width
    float2 currentPixelPosition = uv;

    //Grab the current pixel value for the current Pixel Position, referencing the texture
    float4 currentPixel = tex2D( Texture1Sampler, currentPixelPosition );

    //check to make sure we don’t try and grab the alpha value beyond the screen
    float value = 0;
    if (uv.x <= 0.5)
    {
    //Get alpha values from the second half of the screen
    float2 alphaPixelPosition = uv;

    alphaPixelPosition.x = currentPixelPosition.x + 0.5;
    float4 alphaValue = tex2D( Texture1Sampler, alphaPixelPosition );

    //Get the red channel to convert to Alpha value, could change to blue/
    value = alphaValue.r;
    }

    //Assign the value to the alpha channel
    currentPixel.a = value;

    //Assign that value as a multiplier to the RGB channels
    currentPixel.r = currentPixel.r * value;
    currentPixel.g = currentPixel.g * value;
    currentPixel.b = currentPixel.b * value;

    return currentPixel;
    }

    September 28, 2011 at 11:35 pm

Your email address will not be published. Required fields are marked *

*