Dorkbot Presentation

Thursday, October 27, at En3my Sound, 1550 N. Milwaukee Ave., 3rd floor, in Chicago: I’ll be presenting the newest version of my Processing library, IgnoCodeLib. I may even be so lucky as to have it online and ready to download. If not, expect an announcement soon. IgnoCodeLib provides a framework for 2D graphics using Bézier curves and straight lines. It can export its graphics to Adobe Illustrator. Moar information can be found on the Dorkbot Chicago site.

I’ll also hang some of my most recent work, created with my library. I’ve been posting much of it to Flickr, to the Sampling Patterns 55 set (a selection from the larger Sampling Patterns set) and recently to the Tree Jive set. This animated GIF, Not a Glitch, was created with the Tree Jive algorithm. My page on on Open Processing has some samples of the library used for animation.

 

Not a Glitch, animated GIF

Not a Glitch, animated GIF, created with Processing and IgnoCodeLib

 

Update: for those curious about the algorithmic technique behind the Tree Jive patterns, L-systems or string-rewriting systems, I recommend Prusinkiewicz and Lindenmeyer’s book The Algorithmic Beauty of Plants, available in a free, high-resolution version on the Algorithmic Botany web site.

Computational Aesthetics 2011

Two large format digital prints by Paul Hertz will be shown in the juried art show at the annual Computational Aesthetics conference, held this year in Vancouver, Canada from August 5 through 7. The archival inkjet prints from the artist’s recent “Sampling Patterns” series, Ponente and Shimmer, were printed at Ignotus Editions.

Selections from the Sampling Patterns series can be viewed here, in a Flickr set. The series was developed with the Processing programming language, including Hertz’s Processing Library, IgnoCodeLib.

Artist’s Statement

Ponente and Shimmer are based on regular random distributions known as “blue noise.” Natural phenomena such as identically charged particles jostling for position within a limiting boundary or a flock of birds adjusting their mutual distances have similar distributions. Blue noise dot patterns have interesting visual and cognitive effects: Their regularity seems to imply an order just about to emerge, which their randomness negates. These and other works in my “Sampling Patterns” series are snapshots from interactive real-time animations where the geometric points of the distribution are used to sample functions that control color, scale, shape, and other visual attributes. The snapshots are further edited to produce prints.

In Ponente, blue noise grids determine the locations of distorted circular shapes in different scales and granularities. Low frequency wave functions control variations in scale and simple coloring rules distinguish different layers of shapes or populations within each layer. In Shimmer, a distribution is partitioned into three populations that are distinguished by algorithmically determined colors. Each population has its own shape-generation rule. A global rule for shape orientation (a wave function) creates swirling motions over the visual field.

Surprised Party

A new Voronoi-based computer print by Paul Hertz, Surprised Party. Paul suggests that this print registers his giddy mood upon being welcomed to a surprise birthday party, a plot hatched by his wife, sister, and son and very successfully executed. The party was surprised.

Surprised Party

Surprised Party

The image was generated with multiple passes of Michael Balzer’s code for Capacity-Constrained Voronoi Tesselations. Basically, the CCVT algorithm generates random dot patterns where the dots are evenly distributed. The CCVT algorithm has the particularity of greatly reducing geometric artifacts, such as hexagonal grids,  that may appear in other generation methods. The artifacts can easily be detected just by looking, from which one might deduce that the human visual system is very good at detecting order within randomness.

Detail of Surprised Party

Detail of Surprised Party

Like a perfect gray tone, CCVT-generated dot patterns seem to have a aesthetic appeal that has a statistical correlate. Using them to produce art seems rather natural, in the tradition of “all-over” abstract painting. Their lack of order has the somewhat paradoxical effect of enabling one to see all sorts of orders–trails and swirls of dots where the fundamental rules are, roughly, for dots to keep their distance and avoid regimentation.

The Fibonacci Series and some shuffling were instrumental in selecting and assigning the colors. I leave it to the curious to decipher the numerical game. It should not be difficult. Like a good friend, you can count on the Fibonacci series.

/**
* Shuffles an array of integers into random order
* @param intArray   an array of ints
*/
public void shuffle(int[] intArray) {
  for (int lastPlace = intArray.length - 1; lastPlace > 0; lastPlace--) {
    // Choose a random location from 0..lastPlace
    int randLoc = (int)( randGenerator().nextInt(lastPlace + 1) );
    // Swap items in locations randLoc and lastPlace
    int temp = intArray[randLoc];
    intArray[randLoc] = intArray[lastPlace];
    intArray[lastPlace] = temp;
  }
}

Bezier Circle

Approximate a circle with cubic Bezier curves: here’s a simple method, written in Processing. The key to approximating the circle is a constant, kappa, that will help us calculate the distance from a Bezier anchor point on the circle to its associated control point, off the circle. Kappa is the distance between the anchor point and the control point divided by the circle radius, when the circle is divided into 4 sectors of 90 degrees. See these notes by G. Adam Stanislav for the math.

Circle approximated by five Bezier curves. Click to view applet.

Notes: Kappa is scaled by the number of sectors into which the circle is divided (k = 4 * kappa / sectors). Four sectors is the minimum required to get a good approximation. With a little bit of work it should be possible to create a circle with unequal sectors, scaling kappa by the portion of the circle occupied by each sector. From there, one could make various sorts of blobs by scaling the the control points and anchor points around the center of the original circle.

Fresnel Ring Moires

This Processing applet shows how overlapping Fresnel rings create moiré patterns that are either straight lines or Fresnel rings. The animation moves the two Fresnel rings together and apart at a constant rate, but the moiré patterns accelerate and decelerate. Animation works best when your browser isn’t doing a lot of other tasks that interrupt the applet–download it for best results.



Click in the applet and type “m” to use the mouse to drag the rings left and right. Type “a” to animate again. Source Code: moire. Made with Processing.

The Fresnel rings are drawn with circles using different stroke widths and no fill. The stroke widths derived by subtracting the diameters of a series of circles proportional to successive square roots of a sequence of integers 1..N.

  for (int i = 0; i < rings; i++) {
    diameters[i] = (float) Math.sqrt(i + 1) * max_diameter;
  }

Fresnel lenses are composed of prisms arrayed in Fresnel rings. In the 50s, plastic lens that you could slap onto your teevee to magnify the picture were popular. Large ones are used in solar cookers. The advantage over regular lenses is that Fresnels can be much lighter. They can also be built of modules that fit into a frame--this made them very efficient for focusing lighthouse lights, as they could be transported in sections and assembled on site.

Incidentally, putting a Java applet (from Processing) into a WordPress post was not simple. Following advice in the Processing forum, I resorted to the (deprecated) <applet> tag instead of using the markup generated by Processing. If anyone knows how to use that more current markup (or something similar), please post a comment. I had to do my final edits in the HTML editor and insert the <applet> tag with no linebreaks. Do not go back the visual editor if you do this--it will clobber the applet markup (you could probably fine tune MCEdit to get around this).

You can see this applet its own page, generated by Processing, here.