📜 ⬆️ ⬇️

Introducing Adobe Pixel Bender (Part 1)

Technology Pixel Bender was developed in the laboratory of Adobe, to create filters designed 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 process images with hardware acceleration in software. It is good because it allows you to process each pixel in a phased crawl of the image.
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 the native C-like language and graph-language, examples of filters, documentation.
Creating filters is divided into 3 stages:


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

Press the Run button and see that the image has become lighter. Now let's try to shift our image 10 pixels higher and 15 pixels to the left. To do this in evaluatePixel write:
dst = sampleNearest(src,outCoord()+float2(15,10));
According to the swizzling rule, which is implemented in PB, this is how it turns out:
dst = sampleNearest(src,float2(outCoord().x + 15, outCoord().y + 10);
As you may have guessed, the y-axis is pointing up, the abscissa axis is to the left.
Now let's try to fill the pixels in the x coordinate less than 50, with the pixels in the x=50; coordinate x=50;
We write in evaluatePixel function:
if(outCoord().x<float(50))
{
dst = sampleNearest(src,float2(float(50), outCoord().y));
}
else
{
dst = sampleNearest(src, outCoord());
}

image
Now let's try to create a beam of light in the image.
As mentioned above, to make the pixel brighter, you need to increase the value of its channels.
Take the random coordinate of the beam of light, let's say it will be a parameter
float2 center = float2(100,100);
Let's figure out the size of the glow 200. Next we have to divide the size of the glow 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 5x5 pixels. The color of this large pixel we will take from its upper left corner. As we go round the pixels, we will divide each coordinate by the size of the large pixel, thereby we will know its number in the two-dimensional array (m, n). Next, you need to multiply m and n by the size of the large pixel, in order to find out the coordinate of the upper left corner.
float2 sc = floor(outCoord() / float2(5, 5));
sc *= 5;
dst = sampleNearest(src, sc);

image
Now we will try to realize bloor.
Create a “container” in which we will add our image with an offset.
float4 outpixel;
outpixel += sampleNearest(src,outCoord()+float2(1,1));
// Shifted left, up
outpixel += sampleNearest(src,outCoord()+float2(1,-1)); // Shifted left, down
outpixel += sampleNearest(src,outCoord()+float2(-1,1)); // Move right up
outpixel += sampleNearest(src,outCoord()+float2(-1,-1)); // Shifted left, down
dst = outpixel / float(4.0); // dst = outpixel / float(4.0); // 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:
imageimage
It can be found in the Adobe Pixel Bender Exchange. We will think a little about implementation. The filter itself turns the image into a grid, i.e. the output image contains less than half the pixels than the original. Therefore, as we traverse each pixel of the incoming image (the evaluatePixel function), we will look at the coordinates, if the pixel lies on a diagonal of a square of size (dynamic parameter), then we derive it. We look at the implementation.
image

Conclusion: With PB you can realize any effects. Helps to improve the performance of RIA applications. An indispensable tool for programmers who work with graphics. Having learned to process images in Pixel Bender, you will save 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

Source: https://habr.com/ru/post/70246/


All Articles