Lesson One: The Beginning Chapter 2: Processing Learning Processing Daniel Shiffman Presentation by Donald W. Smith Graphics from built-in help reference folder after install

Lesson One: The Beginning 1: Pixels 2: Processing Installing Processing Menu Options Writing Code Errors The Processing Reference (and website) The “Play” button Your first sketch 3: Interaction Learning Processing: Slides by Don Smith 2

Installing You will need to have processing downloaded to your USB and not the lab machines. Finding the files Website: www. processing.org – click Download Version is the most stable Download the ‘standard’ version to USB Unzip, or open and extract files Let it choose defaults (location…) Installs Java SDK automatically and examples Puts Java files in a folder under Processing Works with XP and Vista Learning Processing: Slides by Don Smith 3

Where does Java fit in? Processing provides a simple ‘front end’ to Java. Processing requires Java SDK to be installed Software Development Kit Processing has it’s own library for graphics Java’s library (API) can also be used in Processing Learning Processing: Slides by Don Smith 4 Processing Source code Processing Library Java Compiler Portable Java Program Java Library

The Java Virtual Machine (JVM) Java was designed to run on embedded systems, it was designed around a virtual machine “Write once, run everywhere” Called the JRE (Java Runtime Environment) x86 Windows OS X G3/4/5 CPU Phone OS Java VM PCMacCell Phone Portable Java Program Running Java Program Running Java Program Running Java Program JRE

Sketch Menu Options Processing has an ‘PDE’ “ Processing Development Environment ” called Sketch File: New, Open, Quit, Examples! Edit: Copy, Paste, Select, Indent, Comment… Sketch: Run, Stop, Show Sketch folder… Tools: Auto format, Color chooser… Help: Getting Started, Reference, Find in Reference… Learning Processing: Slides by Don Smith 6

PDE To run: Menu Sketch, Run, Ctrl-R or Toolbar Run button You either get a display window (all’s well) or an error in Message Area Learning Processing: Slides by Don Smith 7 Menu Toolbar Sketch Tabs Text Editor Message Line Text Area Current Line# RUN Display Window

Toolbar buttons Learning Processing: Slides by Don Smith 8

Getting Started Learning Processing: Slides by Don Smith 9 Help menu, Getting Started goes to processing website and explains:  Processing Development Environment (PDE)  All menu options, hot keys  Sketchbook  Tabs, Multiple Files, and Classes  Coordinates  Programming Modes  Rendering Modes

Sketch Files and Folders… The folder where you store your sketches is called your ‘Sketchbook’ Sketch stores files under where Processing was installed May not be where you want. Use File, Save As to select a folder on your flash drive Processing remembers where you last saved Each sketch has it’s own folder File extension ‘PDE’ is a Processing Development Environment file Double click on PDE file to open Sketch for that folder Learning Processing: Slides by Don Smith 10

Where are your files? Choose File, Preferences Select new location for default Not flash drive (not always there) Learning Processing: Slides by Don Smith 11

Your First Program Open a new sketch Default name is based on date/time In the Text window, type: // My first Program Print(“Hello World by me”); rect(10, 10, 50, 50); One comment and two lines of code Run it… If no errors, What is in the Message/Text Area? What is in the Display window? Learning Processing: Slides by Don Smith 12

Errors The brown line tells you what is wrong Editor window: The line with the error is highlighted RECT should be lower case (rect) Learning Processing: Slides by Don Smith 13 Note: Processing only shows one error at a time

Help, Find In Reference Double click key word (highlights in yellow) Menu: Help, Find in Reference: (or Ctrl-Shift-F) Does not work if word is mis-spelled Normally goes directly to detailed page (local) Usually provides an example Learning Processing: Slides by Don Smith 14

Summary Processing requires (runs on) Java You can download both at the same time and install easily Processing provides a simple IDE (Integrated Development Environment) Called PDE (Processing development Environment) Sketches can be saved and copied Defaults to saving in your ‘install’ folder Use Save As to copy to flash drive Processing provides help Reference (all keywords) Find In Reference (help on one thing) Finds the first error and highlights the line above It only takes a little practice to get the hang of Processing. Make sure to understand these basics and it will avoid confusion down the road. Learning Processing: Slides by Don Smith 15

Assignment Take some time now to review some of the ways Processing is being used by looking at the Processing website Feed:Processing website Feed Under File in the main PDE menu click on “example” and a huge assortment of example code will be given to you to run. Check them all out. It’s fascinating. From those examples, choose three examples that you really like and be ready to share with the class. Learning Processing: Slides by Don Smith 16