O'Reilly logo

Getting Started with Processing by Ben Fry, Casey Reas

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Chapter 1. Hello

Processing is for writing software to make images, animations, and interactions. The idea is to write a single line of code, and have a circle show up on the screen. Add a few more lines of code, and the circle follows the mouse. Another line of code, and the circle changes color when the mouse is pressed. We call this sketching with code. You write one line, then add another, then another, and so on. The result is a program created one piece at a time.

Programming courses typically focus on structure and theory first. Anything visual—an interface, an animation—is considered a dessert to be enjoyed only after finishing your vegetables, usually several weeks of studying algorithms and methods. Over the years, we've watched many friends try to take such courses and drop out after the first lecture or after a long, frustrating night before the first assignment deadline. What initial curiosity they had about making the computer work for them was lost because they couldn't see a path from what they had to learn first to what they wanted to create.

Processing offers a way to learn programming through creating interactive graphics. There are many possible ways to teach coding, but students often find encouragement and motivation in immediate visual feedback. Processing's capacity for providing that feedback has made it a popular way to approach programming, and its emphasis on images, sketching, and community is discussed in the next few pages.

Sketching and Prototyping

Sketching is a way of thinking; it's playful and quick. The basic goal is to explore many ideas in a short amount of time. In our own work, we usually start by sketching on paper and then moving the results into code. Ideas for animation and interactions are usually sketched as storyboards with notations. After making some software sketches, the best ideas are selected and combined into prototypes (Figure 1-1). It's a cyclical process of making, testing, and improving that moves back and forth between paper and screen.

As drawings move from sketchbook to screen, new possibilities emerge.

Figure 1-1. As drawings move from sketchbook to screen, new possibilities emerge.

Flexibility

Like a software utility belt, Processing consists of many tools that work together in different combinations. As a result, it can be used for quick hacks or for in-depth research. Because a Processing program can be as short as one line or as long as thousands, there's room for growth and variation. More than 100 libraries extend Processing even further into domains including sound, computer vision, and digital fabrication (Figure 1-2).

Many types of information can flow in and out of Processing.

Figure 1-2. Many types of information can flow in and out of Processing.

Giants

People have been making pictures with computers since the 1960s, and there's much to be learned from this history (Figure 1-3). In life, we all stand on the shoulders of giants, and the titans for Processing include thinkers from design, computer graphics, art, architecture, statistics, and the spaces between. Have a look at Ivan Sutherland's Sketchpad (1963), Alan Kay's Dynabook (1968), and the many artists featured in Ruth Leavitt's Artist and Computer[1] (Harmony Books, 1976). The ACM SIGGRAPH archives provide a fascinating glimpse into the history of graphics and software.

Processing was inspired by great ideas and individuals over the last four decades.

Figure 1-3. Processing was inspired by great ideas and individuals over the last four decades.

Family Tree

Like human languages, programming languages belong to families of related languages. Processing is a dialect of a programming language called Java; the language syntax is almost identical, but Processing adds custom features related to graphics and interaction (Figure 1-4). The graphic elements of Processing are related to PostScript (a foundation of PDF) and OpenGL (a 3D graphics specification). Because of these shared features, learning Processing is an entry-level step to programming in other languages and using different software tools.

Processing has a large family of related languages and programming environments.

Figure 1-4. Processing has a large family of related languages and programming environments.

Join In

Thousands of people use Processing every day. Like them, you can download Processing without cost. You even have the option to modify the Processing code to suit your needs. Processing is a FLOSS project (that is, free/libre/open source software), and in the spirit of community, we encourage you to participate by sharing your projects and knowledge online at Processing.org and at the many social networking sites that host Processing content (Figure 1-5). These sites are linked from the Processing.org website.

Processing is fueled by thousands of people contributing through the Internet. This is our rendition of how they all relate to one another.

Figure 1-5. Processing is fueled by thousands of people contributing through the Internet. This is our rendition of how they all relate to one another.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required