The Learning Community Group

"Processing is a programming language and environment built for the electronic arts and visual design communities. It was created to teach fundamentals of computer programming within a visual context and to serve as an electronic sketchbook." - excerpt from processing.org.

As part of the LCG's ongoing commitment to stay on the leading edge of New Media, we have joined the rapidly growing Processing community. Processing is a unique teaching tool that can be readily integrated across a wide range of core curricular subjects. Processing is especially well suited to integrating mathematics with the visual and performing arts. The purpose of this gallery is to document the LCG's foray into Processing and to stimulate discussion about how to best maximize Processing's potential as an arts and math integration tool.

LCG offers Processing courses at The Boston Museum of Science, as well as workshops on how to implement a course using Processing in a school or community center. Click here to learn more about our Processing workshops.

Note: Processing exports java applets, which require Java Virtual Machine, a free plug-in available from Sun Microsystems. Click here to download the plug-in. The videos are encoded in Windows Media 9 format and require the latest version of Window Media Player.

Slit Cam

In use for more than 150 years, slit cameras produced the first panoramic imagery. Traditional mechanical slit cameras used a clockwork mechanism to move photographic plates or film across a silted lens assembly, thereby gradually exposing the entire negative. The linear motion of the negative was usually combined with a mechanism which rotated the camera itself. This technique was used to produce panoramic images as wide as 360°. Processing's unique ability to interpret live video signals makes it perfect for producing slit-camera-style imagery. These images are made by simply "stacking" vertical rows of pixels along side of each other over time. To "draw" an image you must ether pan the camera slowly across the subject, or move the subject itself across the camera's field of view.

Click here to view more images.

Source code

3d Video

This sketch takes video's traditional 3rd dimension, time, and translates it into a 3rd spatial dimension. The pixels of the incoming video signal are evaluated according to brightness. If they're bright enough their color information is then fed into a multi-dimensional array, which is rendered as a collection of cubes in 3d space. The array is updated and animated with each new frame of video. In the screen shot to the left you can just make out a hand.

Click here to view a video of this project.

Source code

Perlin Noise Terrain Generator

This example demonstrates Processing's built in Perlin Noise function, which is used to generate semi-random numbers that gradually change, over two dimensions. This effect is achieved by interpolating values between truly random numbers, thereby producing coherent noise. This technique was pioneered by computer science professor Ken Perlin. The numbers generated by the function are placed into an array, which is then drawn on the screen as a series of points, each consisting of an X, Y, and Z component. In addition, the height, or Y component, is used to determine the color of the point. The result is an impressive terrarium simulation.

Click here to launch the applet.

Source code

3d Flower

This is an exercise in 3d geometry creation. The flower's form is defined entirely with code. Polygons and curves are defined with Cartesian coordinates and positioned using vector math. You can rotate the entire model by moving the mouse side-to-side.

Click here to launch the applet.

Source code

Time-lapse Video

Processing makes producing time-lapse videos amazingly easy. All you need is a web cam (or a regular firewire camera that won't turn off by itself) and a few free gigabytes. We produced quite a few videos using this technique (Click the link below to view a montage). We also made the motorized camera mount pictured on the left. It is built with LEGOs and uses a series of gears with a total ratio of ~1/390625 to reduce the motor's speed to an invisible crawl. It was used for just one shot in the montage, but the effect was well worth the effort.

Note: The shots that include the sun were made with a cheap web cam that rendered the sun itself as a black dot. (We decided not to risk pointing our better cameras at the sun for extended periods of time.)

Click here to watch a montage

Source code

Better Living Through Trigonometry

This sketch was is an experiment that uses Processing's built in trig functions. It is simply a row of points whose Y position (height) is a function of three overlapping sine waves, the frequency of which is determined by the users mouse movements. We were thrilled to discover that this simple program can produce a wide variety of complex animated patterns, such as those pictured to the left. Many of these are interference patterns (a concept related to quantum physics and integral to holography) produced via the complex interactions between the sine waves and the actual pixel grid of the screen.

Note: The most complex patterns are produced when the mouse is near the center of the applet's window.

Click here to launch the applet.

Source code

Elastic Collision Simulation

Realistic real-time physics simulation is the hallmark of many cutting edge video game engines. Most people don't realize how difficult these effects are to achieve. Even with the simplest possible geometry, circles, realistic collisions require the use of calculus. It is also a challenge for video game programmers to balance reliable collision detection with system resources. Our example is pretty pedestrian compared to others. Often the balls "stick" together instead of bouncing off of each other, however it also produces realistic collisions on occasion.

Note: This sketch is fairly processor-intensive and may not run smoothly on slower systems.

Click here to launch the applet.

Source code

©2004 The Learning Community Group: All rights reserved. Terms of Use: Conditions of Sale:

TheLCG Research Network

~