Tuesday, August 5, 2008

Learning about Displacement Map Filters in Flash

Recently, we learned how to use a displacement map filter to create a perspective effect in Flash. Here's how we did it.


Here is a bitmap which has a gradient in the blue and red channels.

The blue gradient augments the horizontal position of pixels in our ground image. Zero blue in the displacement map causes pixels from the ground image to move to the right, while full blue causes the pixels to move to the left. A medium blue value causes no change to the pixels. The blue gradient has medium blue values at the bottom, and at the horizontal center.

The red gradient augments the vertical position of pixels in a very similar way... our ground pixels get "squished" with the bottom most pixels being unchanged because of the medium value in both red and blue channels.

Applying this bitmap as a displacement map filter to these display objects,


we'll see the objects with an perspective effect like the following images.




Then by sliding our ground images across the displacement map we can achieve a perspective effect like this.

1 Comments:

At September 3, 2008 11:21 AM , Anonymous Andrew said...

Any chance for code examples? I've been working on something similar and am having a hard time getting the gradient to augment my source image correctly.

 

Post a Comment

Links to this post:

Create a Link

<< Home