Adobe Pixel Bender Effects – Flower Frame Shader

Introduction

Welcome to another tutorial on creating Pixel Bender Shaders. Today we will create a flower image frame. The shader allows us to specify frame center, size, number of leaves and background color. It also allows us the shift and adjust the input image.

Adobe Pixel Bender

If you want to write an image shader for your Flex or Flash application it is recommended that you install Adobe Pixel Bender Toolkit. It includes the Pixel Bender kernel language and graph language, the Pixel Bender Toolkit IDE, sample filters, and documentation needed for developing and debugging shaders. Once you finish developing your shader you can export the binary code and use it in a regular Flex/Flash application.

Flower Frame Shader

I did not invent the equation for the flower frame. I just ported a popular polar graph using Pixel Bender Shader syntax as indicated below:

Live Demo

In order to use the shader above in a Flex/Flash application you need to compile and export the shader using Pixel Bender Toolkit mentioned earlier. Here is the shader in action. Try to play with it to get a feeling of what it does.

[kml_flashembed movie=”https://www.8bitavenue.com/wp-content/uploads/2012/05/pixel_bender_flower_frame.swf” height=”450″ width=”550″ /]

Flex Source Code

You can download the full Flex source code here. Thanks for reading.

Add a Comment

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