Intro to Processing
Rationale
Today we shift focus to a kind of programming paradigm that uses a much more typical for of computer graphics control. We’ll look at the basics of procedural control, and the way that the drawing ‘engine’ inside processing interprets these controls. Some of this will be familiar (BUT DIFFERENT) to experience you have of Arduino coding from last term.
Processing is a tool created for artists and designers, so it has a good deal of stuff hidden from view – but it’s a ‘full’ programming language, don’t kid yourself. You can use it with standard developer tools if you wish. The main ‘limitations’ of processing are that it can be a bit sluggish if you’re not careful how what you code, and that it runs on top of another piece of software (JAVA) that can have its own little idiosyncrasies. Once you have mastered Processing to some degree, you may find yourself limited by these issues, at which point you move on to a somewhat more ‘low level’ programming language like openFrameworks.
What do we stand to gain from learning Processing and learning it well? A new way of approaching problems, another metaphor for computing media, and a new tool in the arsenal. What can you do with it?:
some examples from the processing install:
asciiVideo
from libraries:
fluidDynamics
and from the web:
[vimeo]http://vimeo.com/4583713[/vimeo]
Elements of Code
All programming languages, regardless of specific syntax, will have something akin to the following:
_01_Libraries
_02_Variables – system variables (built in) and user defined (yours!)
_03_Commands and Functions (ways of defining your own commands)
_04_Conditionals (if this –> then do this) and Operators (add, subtract, compare, etc.)
_05_Comments
_06_Debugging or “tracing” outputs (console printing)
LETS DO IT!
The Processing IDE
Basic (not simple) Data Types
Integers vs Floats (addition example, casting)
Strings (arrays of chars – we will look at arrays properly next time) use double quotes “String”
Chars (characters) use single quotes: ‘c’
Booleans
Structure
Globals
Setup
Draw
MousePressed and other listeners
Intro to processing functions – what are arguments?
scope
Simple drawing
size() and its arguments
line()
stroke () & fill()
rect()
ellipse()
Operators and conditionals()
and now for
A really real example where you can really do something
A box what disappears and comes back again
After session practice bits – your chance for lots of one to one help at this critical stage!
A bouncing box – change the code we just made to reverse the direction of the box when it reaches the edge of the screen.
Using key presses to control the box movement – now programme a box which moves left right up or down on different keypresses – use the processing reference to help you
Adding Randomness – make the box move around randomly while staying inside the confines of the screen. EXTENSION – make the box change colour if it moves more than a threshold amount (which you decide).
At home
- Modify the example to add mouse interaction – how would you change the code so that a mouse click on the box causes it to change colour or shape?
- You now have all the tools you need to recreate the arcade classic ‘Pong’. Make a 2 player Pong game for the next class and we can have a Pong off.
