picture home | art | events | music | rack extensions | downloads | pixel blog | qt_tools

omino pixel blog

pixels, motion, and scripting
entries for category "pixel bender"

projection_frame.jpg

This is a rendering simulating an image projected onto a simple 3d scene. There’s nothing too exotic about it, except that the projection was done in 2d, in After Effects.

And… here’s a moving sequence of the same scene. With old family movies.

stage_demo_640_dt-desktop.m4v

click for
http://omino.com/pixelblog/wp-content/uploads/2009/05/stage_demo_640_dt-desktop.m4v

The usual way you’d do this is by rendering a movie, taking it into your 3d program, and projecting it onto a scene through a light source.

For my current project, I needed this effect, but wanted a way to work in After Effects. I did this for workflow reasons: my projection content was all AE authored. But it also turns out to save render time. More than a little.

The trick was to render the scene in 3d as a coordinate-map, in Red and Green. I used Modo, and the projection mode is called “Front Projection”, from a spotlight or camera. I projected a red-green ramp onto the scene.

gradient.png

But we’re going to use the red and green values as a projection function. Changing the shader to use unattenuated (“luminous” @ 1W/steradian in modo) accomplishes this. We’re rendering geometry, not optics.

Then, I wrote a simple Pixel Bender kernel to use the red and green pixel values as coordinates to draw from the source projected image.


// by david van brink / poly@omino.com / 2009
// http://omino.com/pixelblog/
kernel rg_projection
<  namespace : "omino";    vendor : "omino";    version : 1;    
   description : "uses red/green from one image to map another"; >
{
    input image4 src; // Red-green mapping image
    input image4 ref; // image to project
    output pixel4 dst;

    parameter float imageXSize;
    parameter float imageYSize;
    parameter float imageXOffset;
    parameter float imageYOffset;

    void
    evaluatePixel() {
        pixel4 a = sampleLinear(src,outCoord());
        float r = a.r * imageXSize + imageXOffset;
        float g = a.g * imageYSize + imageYOffset;

        dst = sampleLinear(ref,float2(r,g));
    }
}

To test the Pixel Bender kernel, I ran a reference grid through the red-green ramp.

test_grid_gamma.pngtest_grid_no_gamma.pngtest_grid_no_gamma_better_gradient.png

The first one shows gamma correction on the ramp image in After Effects. Under “Interpret Footage”, be sure to turn on “Preserve RGB”.

The second one reveals that Photoshop’s default ramp is some sort of s-shaped modified linear function. Creating a custom gradient with more stops along the way helped get the third, which is Good Enough. I went back and redid the scene with the improved red-green gradient.

gradient_settings.png

And of course, use 32-bit color throughout. 16-bit works ok, too. 8-bit showed definite Squarifying in the projection, though.

To reintroduce the optical nature of the projection, back in After Effects it’s multiplied by a normally rendered image and, because I still think it’s pretty neat idea, an ambient occlusion pass as well.

stage_ambient_occlusion.jpg

stage_grid_projected.jpg

And there you have it! 3d projections done all in 2d.


Download the AE Project

2 comments
human.bin // Sun 2009.08.16 17:115:11 pm

oh my god man!

do you think this thing would work realtime in flash trough pixelbender?

AndrewYY // Tue 2009.09.1 15:343:34 pm

And to think, Maltaannon is selling this exact thing, just with more parameters.

oh, i dont know. what do you think?


david van brink // Sat 2009.03.14 14:20 // {after effects pixel bender}

AE CS4: Pixel Bender Quick Notes

Here are some super short notes about using Pixel Bender inside of After Effects CS4. This post is just another dicing of the available info culled from the After Effects help, and the Pixel Bender Developer Guide.

But it’s the stuff that I most needed to get started, as well as a handy copy-and-paste source for the parameter control types.

This is about Pixel Bender in After Effects specifically.

Installing

Let’s start at the end. To use a Pixel Bender kernel in After Effects, just drop it in the Plug-Ins folder.

  • By default, it shows up in the Pixel Bender effects category.
  • It won’t show up until the next time you start After Effects
  • If it has any syntax errors, AE will warn you as it starts up, and reject the kernel.
  • Any changes to the kernel won’t show up until you quit and re-run After Effects. (Purge-all doesn’t seem to reload it…)
  • (And you can put it in a subfolder of Plug-Ins, of course, to keep things organized.)

Authoring

Source Image To work with After Effects, near as I can tell, it must take at least one image4 source. Even if the kernel is a pure generator, it needs to take an image input.

Multiple Source Images If the kernel takes more than one source image, the additional sources can be chosen in AE by a layer control. (Grand!)

Control Types By default, all parameters show up as sliders. But you can request a different control in the parameter description.

Example

Here’s an example of a Pixel Bender kernel that just generates a solid color. It has several parameter controls on it of the different supported types, and accepts a second layer as input. These are all ignored! But we can see how the controls are displayed, which is handy.

Here’s a screen capture, with the About box. (Trivial bug, the display name isn’t used in the About box…)

pbSolidColor.png

And here’s the code for the kernel, showing the various descriptors.

<languageVersion : 1.0;>

kernel solid_color
<namespace : "omino"; 
 vendor : "Omino PixelBlog 2009"; 
 version : 2; 
 description : "Generates a solid color.";
 displayname: "Solid Color";
 category: "omino"; >
{
 input image4 src;
 input image4 src2;
 output pixel4 dst;

 parameter float4 color 
  <defaultValue: float4(1,0,0,1); 
   aeDisplayName: "Color"; 
   aeUIControl: "aeColor";>;

 parameter float angle 
  <defaultValue: 45.0; 
   aeDisplayName: "Angle"; 
   aeUIControl: "aeAngle";>;

 parameter float2 point 
  <aePointRelativeDefaultValue: float2(0.5,0.5);
   aeDisplayName: "Point";
   aeUIControl: "aePoint";>;

 parameter int popup 
  <defaultValue: 3; 
   aePopupString:"Zero|One|Two|Three|Four"; 
   aeDisplayName: "Popup"; 
   aeUIControl: "aePopup";>;

    void evaluatePixel()
    {
        dst = color;
    }
}

Onward

With this amount of flexibility, and the instant cross-platform nature of Pixel Bender kernels, the barriers to entry for effects development have been dropped to almost nothing. Great stuff!

oh, i dont know. what do you think?


david van brink // Sun 2008.11.2 22:58 // {pixel bender}

Pixel Bender: Sphere Redux

Tweaks and improvements to the previous diced sphere Pixel Bender kernel.

Just click Go. Really.

cubes04.swf

click for
http://omino.com/pixelblog/wp-content/uploads/2008/11/cubes04.swf

As before, it uses a sort of orthogonal ray tracing technique. The depth into a particular cell determines the amount of darkness. In this sense it’s a short cut for HDRI and radiosity in that, simply, the further into the “cave”, the darker it is. Seems to work.

oh, i dont know. what do you think?


david van brink // Sat 2008.11.1 21:10 // {pixel bender}

Pixel Bender: Waves

Everyone loves sine waves.

waves.swf

click for
http://omino.com/pixelblog/wp-content/uploads/2008/11/waves.swf

In the above .swf, a Pixel Bender kernel is summing three sine waves at various frequencies and amplitudes, and drawing it in three colors. Each pixel gets either black, or one of the three colors, depending how close it is to the waveform.

The distance to the waveform is measured only vertically, though, so the peaks get extended in a strange, sort of 60’s/70’s op-ish way.

oh, i dont know. what do you think?



0.0896s
(c) 2003-2013 omino.com / contact poly@omino.com