Lab 1: Introduction to Processing
CS145: Images and Imagination, Fall 2010

Readings and Online Tutorials

• Text: Chps 1-3, up to p.35
• Note, the following online tutorials somewhat overlap with what is in the text:
  • Getting Started
  • Overview: Read through the opening paragraphs as well as the sections "Sketching with Processing", "Hello World", "Creating images from your work", "Examples and reference", "More about size()". Skip the other sections.
  • Coordinate System and Shapes
  • Color
  • If you are interested, other information on color can be found at Brown and Understanding Color .

Summary of Goals

• Become familiar with the Processing Development Environment (PDE).
• Become familiar with the basic Processing drawing commands.
• Create 2-3 theme-based images using the basic Processing drawing commands.
• Learn how to submit your work via WISE.

Assessment

The first lab is most confusing since so much is new. Therefore, it will be leniently graded as pass/fail. Your job is to make a good faith effort to follow the instructions and to turn in at least 2 images via WISE. Do the best you can and have fun experimenting! If you have problems and are a day or two late, you will not be penalized. However, it is your responsibility to get the submission process figured out by the time the second lab is due.

Activities

Becoming Familiar with Processing:

On your H-drive, create a folder called CS145. Within this folder, create a subfolder called Lab1. Save all of your Processing sketches for this lab, into this folder.

In class, we will go over the Processing environment as well as some of the syntax and behavior of a number of the commands in Processing. Your job is to work through the readings and online tutorials (see above). As you go, try out the examples that are given.

At a minimum, be certain that you are familiar with the following basic commands:

• Window setup: size(), background()
• Shapes: line(), point(), rect(), ellipse(), triangle()
• Styles: fill(), noFill(), stroke(), strokeWeight(), smooth(), noSmooth,
• Comments
• Saving an image: save()

Creating Several Images to Turn in:

Pick any theme you like. It could be along the lines of: music, nature, bicycles, etc. Or it could be something more abstract such as wind, chaos, or solitude. Use the Processing commands you have learned to create 2-3 images related to this theme. Think about design elements and principles. These images may be abstract or representational. Be prepared to discuss your thought processes.

Preparing the files for submitting to WISE:

Folder Structure: Each Processing sketch will be in its own folder. Each of these folders should be in your CS145/Lab1 folder. Each sketch folder should contain your Processing code (*.pde) and an image (*.png).

Saving an Image: For each Processing sketch, make sure that you also save an image into the sketch folder by using the Processing save() command. Use the png image format. Please name the images using the lab number, your last name, and a word describing the image. For example, if I had several images containing circles, I would name the images: Lab1_orr_circles1.png and Lab1_orr_circles2.png

Cleaning up the Code: For each sketch, make sure that you have cleaned up the Processing code as follows (this is important!):

• Delete any unused sections of code.
• At the top of the code, add comments containing your name, the lab number, the course number, and a one sentence description of what the code does. Add additional comments, if ncessary, so that someone else looking at the code can follow what the code does. This will become more useful as your programs get longer and more complex.
• Run the Auto-format command by going to the Processing menu: Tools→AutoFormat. You may have to do some additional formatting by hand.

Zipping: When you are done doing all of the above, zip together your entire Lab1 folder into a single zip file. (We will go over this in class)

Submitting to WISE:

By midnight of Sept 8 submit the single zipped file via WISE as an attachment.

Since the first lab is always the most confusing, don't worry if you have problems with the submission process. We will go over it again in class for those who have problems. For lab 2, it will be assumed that you know what to do.