Ubuntu 12.04: How to Install Processing

Processing can be downloaded and installed from Processing.org. As the supported platforms page in the Processing Wiki indicates, installation on Linux can be complicated.

In the following instructions, I’m going to assume you have a basic acquaintance with the Terminal and command lines, at least enough to get around the operating system. This is a really useful skill to acquire in Linux (and MacOS) and can improve your abilities as a programmer. In any case, if you can open a Terminal, you can probably get through the instructions here and on the pages I link to. You will need admin access to run some of the commands, specifically those that begin with sudo.

First, download Processing. On Ubuntu 12.04, the 64-bit architecture is appropriate. It downloads as a .tgz archive, typically into the Downloads folder in your Home folder. You can extract the archive by double-clicking in Ubuntu’s file system browser or extract it from the command line in a Terminal with tar -xf processing-2.2.1-linux64.tgz. Once you have extracted the folder processing-2.2.1, you’ll need to decide where to locate it. I created a new directory, Developer, in my Home Folder, and moved Processing to it just by dragging and dropping. You could also install Processing in the /opt/ folder, though this requires an admin account and use of the Terminal.

If Processing just ran out of the box, you could double-click and run the processing script in the processing-2.2.1 folder or point a Terminal to the folder and type ./processing and hit return (the latter is the approach I recommend). That is unlikely to work because of incompatibilities with the downloaded version of Java in Processing and the default Java environment on Ubuntu. You can resolve the incompatibilities in two steps: installing a new version of Java and adjusting Processing’s directory structure. After reading the supported platforms page in the Processing Wiki, I decided that it made the most sense to install Oracle Java 7.

Installing Oracle Java 7

Information on issues with Java can be found in Ubuntu Help. Take a moment to read the section on Oracle Java 7. Because of licensing issues, Java has to be downloaded and installed from Oracle. Fortunately, there is a tool to simplify this process at webupd8.org. The documentation is clear and simple, and I leave you to it. Once you’ve installed Java, run the Java environment variables installer, too. FWIW, here is my command history for this process:

35 java -version
36 sudo add-apt-repository ppa:webupd8team/java
37 sudo apt-get update
38 sudo apt-get install oracle-java7-installer
39 java -version
40 sudo apt-get install oracle-java7-set-default
41 update-alternatives --display java

Adjustments to Processing

Once you have Oracle Java 7 installed and set as the default version of Java in Ubuntu, you’ll still need to modify Processing to use the newly installed version instead of its own. First, copy Processing’s fonts to the newly installed version of Java. You’ll have to change the command lines to reflect the directory structure for your particular installation of Processing. Oracle Java 7 directories should be the same.

cd /usr/lib/jvm/java-7-oracle/jre
sudo cp -R '/home/ignotus_mago/Developer/processing-2.2.1/java/lib/fonts' lib

Next, in your Processing directory, rename the java folder.

cd '/home/ignotus_mago/Developer/processing-2.2.1'
mv java java_old

Now create a symbolic link (symlink) to Oracle 7 Java’s java binary:

ln -s /usr/lib/jvm/java-7-oracle/jre java

At this point, you should be able to run Processing from the Terminal with ./processing. It works for me. YMMV, but I suspect that it should work in most cases. Getting all of Processing’s libraries up and running and getting Processing to run in the Eclipse IDE in Ubuntu are topics I expect to tackle later.

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.

Bitmap to Surface to Model

Bitmaps can be used as height fields for a 3D terrain. Typically, the brighter the pixel value, the higher the terrain at the location mapped to the pixel. A 3D grid such as a terrain model can be output as cross-sections and created in any convenient material. The Processing app included with this post will do the whole process for you: open a bitmap, display it as a terrain model, and output cross-section profiles to a PDF file. The profiles include slot marks. Once you cut out the profiles and the slots, you can fit everything together into a model. The model can be used to construct a mold for the surface.

Let me explain this with pictures. First, here’s what the assembled model looks like:

The assembled model

The assembled model

Continue reading ‘Bitmap to Surface to Model’

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.