Processing: Creative Coding and Computational Art

PROCESSING: CREATIVE CODING AND COMPUTATIONAL ART
406
I’m sure most of you recognized the output as the classic color wheel, composed of the
three primaries (red, yellow, and blue), the three secondaries (green, purple, and orange)
and the six tertiaries (yellow-orange, red-orange, red-purple, blue-purple, blue-green, and
yellow-green). The two wheels (one showing shades of the colors and the other showing
tints) represent color relationships as perceived off a reflective colored surface, such as a
painting. This color model is referred to as subtractive. When the full spectrum of colors is
mixed together in the subtractive model, we get a dark, neutral color that approaches
black. In contrast, the colors we perceive on a computer monitor, through projected light,
are considered additive. These colors, when mixed together, create white light. In addition,
the primaries in the additive model are red, green, and blue, as opposed to red, yellow,
and blue, as in the subtractive model.
The preceding sketch uses the arc() function to create a series of circles (composed of
pie wedges) that overlap one another. The overlapping circles get progressively smaller,
while the value of the color darkens and lightens on the left and right circles, respectively.
Since the colors are fully opaque, there is no mixing of the overlapping pie wedges—
rather, the shift in value is determined solely by the calculations within the cols[] array.
The array uses Processing’s color data type. I create and fill the arrays from scratch each
iteration of the loop, using anonymous color objects; they’re anonymous only in the sense
that I’m not assigning each color object to a variable. As a fun problem to try on your own,
try modifying the previous sketch to generate two similar wheels based on the additive
model.
Controlling alpha transparency
Besides the color component properties, you can also specify an alpha component, which
controls the transparency of the color. For grayscale, you pass an optional second argument,
and for color you pass an optional fourth argument. Here’s a combined example
that shows both (see Figure 10-4):
// Alpha
size(400, 315);
for (int i=0; i< height; i+=width/15){
float r=random(255);
float g=random(255);
float b=random(255);
for (int j=0, a=255; j