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

Installing Finding the files Website: www. processing.org – click Download Blackboard: Files, Tools folder Version 1.0.7 is the most current Download the ‘full’ version (68MB) processing-1.0.7.zip If you already have Java installed: Install the Windows (Without Java) expert version instead processing-1.0.7-expert.zip - From www.processing.org 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 Installs an icon on your desktop Learning Processing: Slides by Don Smith

Processing Source code 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 Processing Source code Processing Library Processing Java Compiler Java Library Portable Java Program Learning Processing: Slides by Don Smith

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) Portable Java Program PC Mac Cell Phone Java VM Java VM Java VM Windows OS X Phone OS JRE x86 G3/4/5 CPU Running Java Program Running Java Program Running Java Program

Sketch Menu Options Processing has an ‘PDE’ 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

PDE To run: Menu Sketch, Run, Ctrl-R or Toolbar Run button Menu Sketch Tabs Text Editor Message Line Text Area Current Line# RUN Display Window 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

Toolbar buttons Learning Processing: Slides by Don Smith

Getting Started Help, 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 Learning Processing: Slides by Don Smith

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

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

Your First Program Open a new sketch Run it… If no errors, 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

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

Help, Find In Reference Does not work if word is mis-spelled 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

Lab 5: Zoog Headstand Draw your alien – Upside Down! Save your sketch Use grayscale White head Black eyes Gray body Add a comment with your name at the top Add: print(“Zoog Headstand by <Your name>”); Save your sketch To your flash drive Submit your sketch (pde) via Blackbloard Learning Processing: Slides by Don Smith

Summary Processing requires (runs on) Java You can download both at the same time and install easily Processing provides a simple IDE Called PDE 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 Learning Processing: Slides by Don Smith