Introducing Adobe Pixel Bender (Part 1)

    Pixel Bender technology was developed in an Adobe lab to create filters for video and image processing. Pixel Bender (PB) filters can be used in software products: Adobe Flash, Adobe Flex, Adobe Photoshop, Adobe After Effects. At its core, PB provides the ability to programmatically process images that support hardware acceleration. It is good because it allows you to process each pixel in a phased bypass image.
    The Pixel Bender Toolkit is absolutely free, you can download it at the following link labs.adobe.com/technologies/pixelbender . PBT (Pixel Bender Toolkit) includes: an integrated development environment with support for a native C-like language and graph language, filter examples, documentation.
    Creating filters is divided into 3 stages:
    • Algorithm development
    • Writing an algorithm to PBT
    • Export to bytecode


    Getting started writing filters. Run the program. Create a new filter (File> New Kernel Filter) The code appears in the code editor:
    image
    The languageVersion language version must be specified in the tag . The tag kernel contains a description of the filter: author, version, developer namespace, characteristics.
    input image4 src;
    This line indicates that the input image src is of type image4. A type image4 has 4 properties: a (transparency), b (blue channel), g (green channel), r (red channel).
    Because We will output the processed image by the 1st pixel. We should indicate the type and name of the processed pixel. In this case, the pixel dst will be of type pixel4.
    output pixel4 dst;
    FunctionevaluatePixel()will be called for each pixel. If the function will not return variables, specify void. In order to find out which pixel is currently being processed, it is necessary to use outCoord()this type variable float2, a vector, which has two properties: X and Y. The function sampleNearest(изображение, координаты); returns a pixel (pixel4) in the coordinates of the specified image.
    In line dst = sampleNearest(src, outCoord());, we assign pixels located on the image src in the coordinates outCoord().x, outCoord().y. After starting the filter (Run button), we see that the image has not changed, because we just copied the pixels. Now let's try to change this situation.
    It's no secret that you can brighten the image by increasing the values ​​of the channels. In the function evaluatePixel we write:
    dst += sampleNearest(src,outCoord());
    dst += sampleNearest(src,outCoord());
    dst += sampleNearest(src,outCoord());

    Press the Run button and see that the image has become brighter. Now let's try to shift our image 10 pixels higher and 15 pixels to the left. To do this, evaluatePixel we write:
    dst = sampleNearest(src,outCoord()+float2(15,10));
    According to the swirling rule, which is implemented in PB, it turns out like this:
    dst = sampleNearest(src,float2(outCoord().x + 15, outCoord().y + 10);
    As you may have guessed, the ordinate axis is up, the abscissa axis to the left.
    Now we’ll try to fill the pixels in the coordinate xless than 50, with pixels in the coordinate. x=50;
    We write in the function evaluatePixel: Now we’ll try to create a beam of light in the image. As mentioned above, to make a pixel brighter, you need to increase the value of its channels. Take a random coordinate of the light beam, let's say it will be a parameter
    if(outCoord().x {
    dst = sampleNearest(src,float2(float(50), outCoord().y));
    }
    else
    {
    dst = sampleNearest(src, outCoord());
    }

    image



    float2 center = float2(100,100);
    Let’s think of a glow size of 200. Next, divide the glow size by the distance from its center to the current pixel.
    dst = 200/distance(outCoord(), center) * sampleNearest(src, outCoord());
    image
    Let's say we need to make pixels 5x5 in size. The color of this large pixel will be taken from its upper left corner. As we go around the pixels, we will divide each coordinate by the size of a large pixel, thereby we find out its number in the two-dimensional array (m, n). Next, multiply m and n by the size of a large pixel in order to find out the coordinate of the upper left corner. Now let's try to implement bloom. Create a “container” in which we will add our image with an offset. // Move Left, Up // Move Left, Down // Move Right, Up // Move Left, Down
    float2 sc = floor(outCoord() / float2(5, 5));
    sc *= 5;
    dst = sampleNearest(src, sc);

    image


    float4 outpixel;
    outpixel += sampleNearest(src,outCoord()+float2(1,1));

    outpixel += sampleNearest(src,outCoord()+float2(1,-1));
    outpixel += sampleNearest(src,outCoord()+float2(-1,1));
    outpixel += sampleNearest(src,outCoord()+float2(-1,-1));
    dst = outpixel / float(4.0); // We display the resulting pixel, not forgetting to reduce the value of the channel by dividing. If we do not reduce, then the image will turn out bright and contrast.
    Here is the result:
    image
    crossStitch Filter: You
    imageimage
    can find it in the Adobe Pixel Bender Exchange. Let's think a little about implementation. The filter itself turns the picture into a grid, i.e. the output image contains less than half the pixels than the original. Therefore, as we go around each pixel of the incoming image (function evaluatePixel), we will look at the coordinates, if the pixel lies on the diagonal of a square of size size (dynamic parameter), then we display it. We look at the implementation.
    image

    Conclusion: With PB, you can implement any effects. Helps in improving the performance of RIA applications. An indispensable tool for programmers who work with graphics. Learning how to process images in the Pixel Bender will save you a lot of time in the future.

    Where to get ready-made filters?
    Adobe Pixel Bender Exchange Site www.adobe.com/cfusion/exchange/index.cfm?event=productHome&exc=26
    Petri Leskinen pixelero.wordpress.com/category/pixel-bender
    Mrdoob www.mrdoob.com/blog/post/586
    Kevin GoldSmith blogs.adobe.com/kevin.goldsmith
    For cool algorithms climb here iquilezles.org/www/index.htm

    Author: Sergey Flastar Gonchar flash developer flastar.ru/blog

    Also popular now: