1. Introduction to Programming with Processing

In these notes you will learn:

  • What this course is about.
  • The pre-requisites for taking this course.
  • The basic components of a computer.
  • The definition of a programming language.
  • Some examples of popular programming languages.

1.1. Computer Programming

Computers are everywhere, and they all run programs. A program is a sequence of instructions that tell the computer what to do, and a programmers job is to create and arrange these instructions. Software refers to a collection of programs.

Programs are usually written to solve a particular problem. For example, a word processor solves the problem of creating documents, while a web browser solves the problem of conveniently accessing files on other computers.

In this course we are mainly interested in writing programs that solve problems in graphics and animation. We’ll take time to explore various special effects that you might see in video games or graphical user interfaces.

We’ll start with very basic programs, and work our way up to basic object-oriented programming (OOP). OOP is a popular programming technique that works very nicely with animation and graphics programming.

After this course, you should be ready to make simple games or animated demo programs.

1.2. Prerequisites

We’re making a few assumptions about you as a student. In particular, we assume that you have:

  • Never taken a programming course before. We will start from the beginning with small (but interesting!) examples.
  • An interest in learning how to program. If you are, say, interested in digital art, then there at least two main reasons to learn how to program:
    1. Most professional digital art tools can be scripted, i.e. they can be programmed to do things automatically. The essential principles of programming are the same in any programming language, and so learning how to program will help you master these sorts of tools.
    2. Computation is an incredibly flexible tool for artistic exploration. If you want complete control over your computer, i.e. if you want to truly master the “digital canvas”, then you need to learn how to write programs.
  • An interest in graphics and animation. Almost all the examples in this course are about animation and images, and so if that bores you to tears, you won’t like this course. While an interest in images and animation is required, no special knowledge of, or ability in, art is expected or needed.

1.3. What is a Computer?

Lets talk about what a computer is. While computers are relatively complex machines in practice, they all have, in some form, the following basic components:

Block diagram of a computer
  • A central processing unit, known as the CPU. The CPU is the so-called “brain” of the computer that makes decisions, does arithmetic, and manipulates the computer’s memory.

    These days, many PCs have more than one CPU. Programming multiple-CPU computers is much more challenging than programming single-CPU computers because the difficulty of coordinating the CPUs. We will stick to single-CPU programming in this course.

  • Random-access memory, known as RAM. RAM is where computers can store and retrieve data. Computers store information in RAM as sequences of 0s and 1s (bits), although in this course we will rarely worry about such low-level details. Instead, we will imagine that the computer stores data as numbers and strings of characters.

    An important feature of RAM is its speed: RAM data can be stored and retrieved very efficiently.

  • Input and output devices, know as I/O devices. Input devices — such as mice, keyboards, touchscreens, disk drives, and video cameras — let us put data into a computer. Output devices — such as monitors, speakers, printers, and disk drives — extract data from the computer.

    Some devices allow for both input and output, e.g. a disk drive allows for both input and output.

Actual computers have varying configurations of these three elements, and in practice that can make a big difference in how you program it.

A desktop computer

For instance, a typical desktop computer might have these features:

  • A fast CPU. A desktop CPU might do, say, 2.5 billion low-level operations (such as additions or multiplications) per second. Generally speaking, if a CPU runs at 1 gigahertz, then it does about 1 billion low-level operations per second.
  • Lots of RAM, e.g. 4 gigabytes of RAM can simultaneously store about 8000 color images. A gigabyte is one billion bytes, and a byte is 8 bits (where a bit is a 0 or a 1).
  • Input devices: keyboard, mouse, large and fast hard disk.
  • Output devices: (large) graphical monitor, large and fast hard disk, printer.
A hand holding an Arduino microcontroller.

Compare this to a very different kind of computer, the Arduino micro-controller:

  • One slow CPU that can do about 16 million low-level operations per second. While 16 million is certainly a big number, this is about 150 times slower than a desktop CPU running at 2.6 gigahertz.

    In other words, you would have to let the Arduino run for more than two and a half minutes for it to do the same amount of work a 2.6 gigahertz CPU could do in one second.

  • About 32 kilobytes of memory. This is enough to store, maybe, one small color image. Maybe.

  • No input/output devices: instead, the Arduino is designed to control other devices. For instance, you could use an Arduino to control an array of blinking lights.

Interestingly, Processing is a popular language for programming the Arduino, and so what you learn in this course can be applied to it.


According to the website www.top500.org, the world’s fastest computer as of May 2012 is the K computer housed in the RIKEN Advanced Institute for Computational Science. It is currently half-built and has over 85,000 CPUs (each with 8 cores) that enable to perform over 10 quadrillion floating-point operations per second on standard scientific computing benchmarks.

1.4. What is a Programming Language?

To program a computer, you need to give it a sequence of instructions to follow, and these instructions must be written in some sort of language. Since the 1940s when electronic digital computers first appeared, thousands of different programming languages have been created.

The simplest — and usually most difficult — way of programming a computer is to use assembly language (or just assembly, or assembler, for short). Assembly language programs directly control the CPU and RAM. For example, this assembly language program prints “Hello, World” on the screen on a PC computer:

ORG 100h

MOV AH,09h
INT 21h
MOV AX,4C00h
INT 21h

DB "Hello, World$"

END Main

As you can see, this is rather cryptic, and is not meant for casual programmers. On the plus side, assembly language programs are often quite fast, and take up relatively little memory space.

Very few programmers write programs directly in assembly language. The main problem is that such programs very quickly become long and complex, even for simple tasks. Furthermore, different CPUs will have different assembly languages. So instead, most programmers use high-level programming languages that can look a little more like English.

Duke, Java's mascot. Duke, Java's mascot.

In this course, we will use Processing, a high-level programming language (it’s logo is on the right). Processing is really just the Java programming language (whose original mascot, Duke, is just below on the right) combined with a library of useful graphical and animation functions. So by learning Processing, you are really learning Java (remember this when you write your resume!).

Java, and thus Processing, is a high-level language designed for applications programming. Processing is particularly good for creating small interactive graphical programs, and so it is a good way to learn to program.

1.5. Some Other Programming Languages

It is useful to know the names and uses of some other programming languages besides Processing. Here is a very brief summary of a few well-known programming languages:

Language Created Purpose
FORTRAN 1957 numerics, e.g. scientific computing
LISP 1958 symbolics, e.g. artificial intelligence
C 1972 systems
SmallTalk 1972 education
C++ 1983 systems/applications
Perl 1987 scripting/applications
Python 1991 scripting/applications
Java 1995 applications
JavaScript 1996 web browser language
C# 2001 applications
Scratch 2006 beginners language

While these are all high-level programming languages, they were designed with different goals in mind. For example, C and C++ are best for systems programming, that is, for writing the low-level programs that make up a computer’s operating system. For instance, all computers need a program to copy a file from RAM to disk, and C/C++ is a good choice for writing that sort of program.

In contrast, application-oriented languages, such as Java and C#, are designed more for programs that will be directly used by people. For instance, Java or C# would be good languages for writing a graphical user interface, or an email client. Generally speaking, application-oriented languages tend to be a easier to use than systems programming language because you don’t need to understand so many low-level details about the computer.

The Python logo.

One other style of programming language that is quite common is scripting. Languages like Python were designed primarily for writing relatively short and simple programs that automate common repetitive tasks. For instance, suppose your photo collection is stored across 500 different folders in a top-level folder called Pictures. All the photo files happen to be JPEG files that end with the extension .jpeg. Using, say, Python, you could write a program to scan through all these files and folders replacing the .jpeg extension with .jpg, e.g. boat.jpeg is renamed to boat.jpg. Of course, you could do such a thing with any programming language, but it is probably easier to do using Python (or some similar scripting language, such as Ruby or Perl) since it provides so many useful functions designed exactly for handling this sort of task.

1.6. Questions

  1. What is a program? What is software?
  2. What are two reasons why a digital artist might want to learn to program?
  3. Draw, and label, a diagram that shows the three main components of a computer system and how they relate.
  4. What do the following stand for?
    • CPU
    • RAM
    • I/O
  5. About how many low-level operations can a 2 gigahertz CPU do per second?
  6. Give an example of an I/O device that is:
    • input only
    • output only
    • both input and output
  7. What is assembly language?
  8. What is one good thing about assembly language? What is one bad thing about it?
  9. True or false: Processing is an example of a high-level programming language.
  10. How is Processing related to Java?
  11. What is systems programming? What is applications programming? What is scripting?
  12. Name two different programming languages often used for writing low-level programs such as operating systems.
  13. Name two different programming languages often used for scripting.