Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
762
being either open or closed wouldn’t give us much logic to work with, but if you take all
the transistors on a CPU, and begin coding logic based on series of these gates being open
or closed, well, the possibilities are limitless. And since the core processing logic at the
chip level is based on this binary (zeros and ones) system, bitwise operations (also based
on a binary system) are really efficient, which means large amounts of data can be
processed more quickly. This speed benefit is the main reason it’s worth learning to
directly manipulate bits with regard to graphics computing.
Color data structure
Besides the silicon story, there is another practical reason why bitwise operations work
well with color, and it relates to how color is stored and structured in memory.
Color information is stored in what’s referred to as a packed 32-bit integer, representing
alpha, red, green, and blue. The reason the integer is referred to as “packed” is because
the components—alpha (A), red (R), green (G), and blue (B)—are divided up into distinct,
delineated 8-bit sections. The following line shows how the color is actually stored as an
integer (the letter of the color is used to show the place in the integer):
AAAAAAAARRRRRRRRGGGGGGGGBBBBBBBB
In actuality, of course, the values of each of the bits can only be 0 or 1. Remember, a 32bit
integer is just a binary (base 2) number to 32 places. Also, alpha by default is set to
100% when you create a color (which equals all ones for its eight bits). So, for example, the
color purple at 100 percent alpha would be represented like this: 11111111 11111111
00000000 11111111. (I separated the 32 bits into four 8-bit groups just to help you visualize
where each of the components is stored in the continuous 32-bit string). Likewise, the
color red would be 11111111 11111111 00000000 00000000, and blue would be 11111111
00000000 00000000 11111111. If this still isn’t clear, maybe this list will help (please note
that the bits are counted from right to left):
Alpha: Bits 25 through 32
Red: Bits 17 through 24
Green: Bits 9 through 16
Blue: Bits 1 through 8
What is confusing about the color integer (at first glance) is that the 8 bits controlling
alpha seem to be on the wrong side of the bit string, since alpha is normally specified as
the fourth argument when you create an (RGBA) color, as in color c = color(255, 127,
0, 255). However, in the integer, alpha is specified in the first 8 bits. I’m also using the
default value for alpha, which is 100 percent, which is why all the places (where alpha is
specified) are 1.
OK, but that still doesn’t explain why the value of eight ones is equal to 100 percent alpha?
The trick to converting a binary value (like eight ones) back to our more familiar decimal
(base 10) system is to think about how numbers are represented, which is easiest for us to
do in our base 10 system. For example, what’s the difference between the numbers 52,
479, and 100,000? The key to answering this question is found in the number of places in