I did these last night. The story about the matrix filter is below them.
One of the coolest things about messing around with art on the computer is that you can change the colors of pixels that are already on the canvas. When you have a complex mix of colors, it’s quite neat to see them all change, usually rotating through the color-wheel, hue by hue.
After I did the first piece, I decided I wanted to make a little animation in Flash that showed that happening. I figured it would be necessary for me to get every pixel, then calculate the hue change, and then to put it back where I found it.
In order to make this color picker control for Flash, I had to learn to do HSV colors and convert them to RGB. I ended up finding a cool class that did the conversions for me. I thought I was going to have to use that class to adjust every pixel in my new thing.
Flash provides a filtering system for display objects and bitmaps. It can cache a display object, perform some operation on all the pixels, and then swap the cache for the live image.
Flash supports a color matrix filter. A color matrix is a set of 20 values in an array that defines the math operations to be done to the R and G and B components of each pixel in the image created by the display object.
Here is Adobe’s documentation of the class that creates the filter from the matrix: flash.filter.ColorMatrixFilter.
Let me show you the highlights!!
redResult = (a[0] * srcR) + (a[1] * srcG) + (a[2] * srcB) + (a[3] * srcA) + a[4]
greenResult = (a[5] * srcR) + (a[6] * srcG) + (a[7] * srcB) + (a[8] * srcA) + a[9]
blueResult = (a[10] * srcR) + (a[11] * srcG) + (a[12] * srcB) + (a[13] * srcA) + a[14]
alphaResult = (a[15] * srcR) + (a[16] * srcG) + (a[17] * srcB) + (a[18] * srcA) + a[19
So, I scratched my head for a minute and then went looking to see if someone else had already figured out what the matrix should be to change blue into a slightly more greenish-blue without changing the saturation or the brightness.
Matt Lloyd had already created a class that created a matrix to feed to Flash to create the filter I needed. It has a creative commons license on it, and I’m making this blog post to thank him and give him credit for his work.
Here is his post: Matt-Lloyd’s Blog: Hue Color Matrix Filter
Here is a link to the little Flash thing I did so quickly thanks to Matt’s work: Joe’s 2012 Art – Study 1
And here’s my Flash thing running in an iframe:
Here is what the two upper layers look like:
Leave a Reply