Note this section is for students with prior programming experience and has its own syllabus separate from all other sections
- General ICM Page: includes links to helpful resources, work from other sections, and instructions on how to upload your homework.
- Main Processing page
- book: www.learningprocessing.com
- Other Processing books available
- Processing site tutorials
- Shiffman, Tuesday, 12:05-3:00pm: Section Info, Section Homework
- Why are we here? What is computational media? What is programming? What is it good for? What kinds of programming languages are there?
- Algorithmic Thinking
- What is Processing? Why Processing?
- Server-side vs. client programming
- Things made with Processing
- Drawing with numbers
- Processing's screen coordinates
- Processing's drawing and color functions
- Processing reference
- Running your application
- Abstract Modern Art for inspiration -Piet Mondrian -Ron Gang -Sol Lewitt
- Watch
- Casey Reas Eyeo 2012 talk on Chance Operations
- Video Lessons 0.0-2.1 duplicate what we will cover in class. Watch 3.0-4.3 to preview next week's content.
- Related Reading
- Chapters 1-2 from Learning Processing.
- Chapters 1-3 from Getting Started with Processing
- Downloading Processing
- Download Processing 2.0
- Breakout
- Homework
- Sign up for the ITP ICM Google Group: https://groups.google.com/a/itp.nyu.edu/group/icm (also sign up for your section's group)
- Sign up for Tuesday google group Shiffman ICM google group -- this will be used for administrative announcements for our section only.
- Create your own screen drawing: self-portrait, alien, monster, etc. Use only 2D primitive shapes – arc(), curve(), ellipse(), line(), point(), quad(), rect(), triangle() – and basic color functions – background(), colorMode(), fill(), noFill(), noStroke(), stroke(). Remember to use size() to specify the dimensions of your window. Feel free to use your prior programming experience using variables, loops, etc. where necessary. But embrace the constraint of a static drawing for this week.
- Post a link to your work on the wiki. You'll have to sign up for a github account to edit. Follow the guidelines provided on the wiki.
- Examples: https://github.com/shiffman/LearningProcessing -- take a look at Chapter 1 and 2 (3 if you are feeling ambitious).
- The flow: code blocks, setup, draw, and events: https://github.com/shiffman/LearningProcessing/tree/master/chp03_flow
- Variation: mouseX,mouseY
- Variables: Declare, Initialize, Use: https://github.com/shiffman/LearningProcessing/tree/master/chp04_variables
- random()
- transformations
- Conditionals: https://github.com/shiffman/LearningProcessing/tree/master/chp05_conditionals
- If, else if, else
- Boolean variables
- Relational Operators, Logical Operators
- Buttons, rollovers, switches
- Loops: http://www.learningprocessing.com/examples/chapter-6/
- while
- for
- map()
- Additional examples from Chris Kairalla
- Related Reading
- Chapters 3-6 from Learning Processing.
- Chapters 4-5 from Getting Started with Processing
- Supplemental Reading
- "Hackers and Painters" by Paul Graham
- Watch
- Commodore 64: 10 PRINT CHR$(205.5+RND(1)); : GOTO 10
- You can preview next week's functions and objects content by watching videos 7.0 - 8.3.
- Homework: In general this week, you should work with rule-based animation, motion, and interaction. You can use the ideas below or invent your own assignment. Start by working in pairs according to the wiki. Can you divide an idea into two parts and combine those parts? You can post together or break off and complete the assignment individually.
- Experiment with motion using a single simple shape. Create a bouncing ball or a randomly jittering "nervous" square. Can you invent your own physics?
- Create an algorithmic design with simple parameters. A good model is 10PRINT based on the examples provided here. There is also a nice discussion on the Processing forum. You can also read the 10 Print book online as a PDF.
- As an exercise, try making a rollover, button, or slider from scratch. Compare your code to the examples on github. Moving beyond the exercise, can you invent new GUI elements beyond buttons, sliders, rollovers, etc.?
- Consider tying the above two together and have a GUI control your 10PRINT visualization or motion sketch.
- Invent your own exercise related to animation and interaction.
- The Theory of Object Oriented Programming
- Functions: https://github.com/shiffman/LearningProcessing/tree/master/chp07_functions
- Re-usability
- Modularity
- Calling vs. Defining
- Parameter Passing
- Return types
- Recursion
- Objects: http://www.learningprocessing.com/examples/chapter-8/
- Principles and Theory (Encapsulation)
- How-to
- lerp()
- transformations
- Related Reading
- Chapters 7-8 from Learning Processing.
- Chapters 8-9 from Getting Started with Processing
- Homework
- Re-organize the code of a previous assignment or example (or invent something new if you prefer) using object-oriented programming. Try to eliminate all code from the main tab (setup() and draw()) except for the core requirements (size(), background(), etc.) and calls to objects. If you are stuck for an idea consider taking the first step towards building a particle system. Particle system can be used to simulate rain, snow, fireworks, explosions, smoke, etc. Create a Particle class to describe a single particle and try to get a few particles on the screen using separate variables. (Later, with arrays and ArrayLists, we'll look at how to visualize many particles on the screen.)
- E-mail the code for a class to your assigned partner on the wiki. You'll get one from them too. Try incorporating the class sent to you into your sketch. Write some thoughts about this process on your blog -- Did anything not work? Could you follow your partner's code? Were comments helpful? (If you are feeling saucy, you could try to use github for this collaboration.)
- More OOP
- Constructor arguments
- Inheritance
- Objects talking to objects
- pass by copy, pass by reference
- using Processing classes (PFont, PImage, PVector, etc.)
- Related Reading
- Chapters 7-8 from Learning Processing.
- Chapters 8-9 from Getting Started with Processing
- Homework
- Review loops: http://www.learningprocessing.com/examples/chapter-6/
- Arrays: http://www.learningprocessing.com/examples/chapter-9/
- A String is like an array of characters: http://processing.org/learning/text/
- An image is like an array of pixels: http://processing.org/learning/pixels/
- What is an ArrayList?
- Related Reading
- Chapters 6 and 9, from Learning Processing.
- Chapter 10 from Getting Started with Processing
- Homework
- Using arrays and loops, write a program that creates multiple instances of an object (feel free to use an object you developed previously or create something new). You can consider continuing the "particle system" thread and try modeling something like rain, snow, bubbles, etc. You can also look ahead to images and data and think about how an image is an "array of pixels" an a String is an "array of characters."
- PVector tutorial
- The Nature of Code
- The Nature of Code Exampes
- Homework: TBA
- Images
- Load and display
- Sequence
- Image Processing and the Pixel Array
- Video:
- Live video input
- Movie playback
- Examples:
- In class: https://github.com/ITPNYU/ICM/tree/master/in-class-examples/week7
- Updated chapter 15: https://github.com/ITPNYU/ICM/tree/master/LearningProcessing/chp15
- Updated chapter 16: https://github.com/ITPNYU/ICM/tree/master/LearningProcessing/chp16
- Dano's examples: https://github.com/ITPNYU/Comperas
- Contributed Processing Libraries
- Kinect: http://code.google.com/p/simple-openni/, http://www.shiffman.net/p5/kinect/ (possibly out of date)
- OpenCV: http://www.mon-club-elec.fr/pmwiki_reference_lib_javacvPro/pmwiki.php -- new OpenCV library for Processing 2.0! In french. Also, see: http://codeanticode.wordpress.com/2011/11/21/opencv-2-in-processing/
- BlobDetection: http://www.v3ga.net/processing/BlobDetection/
- CCV + TUIO: http://ccv.nuigroup.com/, http://www.tuio.org/?processing
- Related reading:
- Learning Processing, Chapters 15-16
- Homework: Pixels Project
- Develop a project that uses images and pixels. For this project you should document your work in a blog post in addition to creating the Processing sketch. Note that examples that use Capture of Movie will not work in JavaScript mode. You can present in class using your laptop or put your sketch into dropbox. Here are some ideas:
- Create a software mirror by designing an abstract drawing machine which you color according to pixels from live video.
- Create a video player. Consider combining your pcomp media controller assignment and build a Processing sketch that allows you to switch between videos, process pixels of a video, scrub a video, etc.
- Use the kinect to track a skeleton. Can you "puppeteer" an avatar/animation with the kinect?
- Note that only the names in bold (1/2 of the class) on the wiki will present next week. The second half will present the "data" assignment the following week. You should all complete both assignments, however, and of course you can present both weeks if you have a question or something you really want to get feedback on. Feel free to switch with each other or e-mail me if you would like to switch.
- Develop a project that uses images and pixels. For this project you should document your work in a blog post in addition to creating the Processing sketch. Note that examples that use Capture of Movie will not work in JavaScript mode. You can present in class using your laptop or put your sketch into dropbox. Here are some ideas:
- Pixel project presentations.
- Basics of working with Strings
- Loading (and saving) external data to local files
- Loading from URL
- XML
- Threads
- Discussion of APIs and Databases
- Web security in JS mode, sandbox, etc.
- Connecting with CommLab web
- Chris Kairalla's Joke Demo: http://itp.nyu.edu/~ck987/sinatra/joke-repo
- Joke Repo Web App source code
- Joke Client in Processing -XML VERSION
- Joke Client in Processing -JSON VERSION
- You can read Chapters 17-18 from Learning Processing but chapter 18 is especially out of date.
- Data / Text projects and resources
- Homework: Data Project
- Develop a project that uses an external data source. For this project you should document your work in a blog post (and link below) in addition to creating the Processing sketch. Note that certain methods for grabbing data will not work in JavaScript mode. You can present in class using your laptop or put your sketch into dropbox. Here are some ideas:
- Create a game that saves a high score list to a text file.
- Track personal data over the course of a few days (exercise, sleep, computer use, eating, etc.). Enter the data into a CSV file and visualize.
- Count word frequencies in two different text sources (i.e. two different authors, two different newspapers, two different political speeches) and visualize the concordance.
- Visualize weather data (http://developer.yahoo.com/weather/)
- Connect a Processing sketch to a web app that you create (applicable if you are taking ICM web).
- If you do not present your pixels assignment, you will present you data assignment next week.
- Develop a project that uses an external data source. For this project you should document your work in a blog post (and link below) in addition to creating the Processing sketch. Note that certain methods for grabbing data will not work in JavaScript mode. You can present in class using your laptop or put your sketch into dropbox. Here are some ideas:
-
Translate, Rotate, Scale: http://processing.org/learning/transform2d/
- Examples from Chris Kairalla
- Godzilla
- Danny Rozin's Clock
- Danny Rozin's 3D Box Grid
- Solar System - Advanced Level Demo
- Examples from Chris Kairalla
-
P3D: http://processing.org/learning/p3d/
- 3D shapes, vertices
- textures
- lighting
- shaders
-
PGraphics
- Examples from Chris Kairalla
-
ArrayList
-
Java
- Robot Class example, Robot Java Documentation
- Try/Catch, Exceptions
- Processing in Eclipse
- Processing in Sublime
- Processing.js embedded in webpage
-
Homework: Prepare a final project proposal. Create a web page or blog post with title, description, sample imagery, diagrams, Processing code, etc. Be prepared to present your proposal to the class next week.
- ** See your individual section's proposal schedule on your wiki **
- This week you will "user test" your project with fellow classmates. You must have some implementation that you can test completed by this time. User testing can mean different things for different projects. For a game, it can mean that the user tries to play it. For an art piece, it could mean showing it to a classmate and asking for them to say what they think it is about or how it made them feel. We'll show projects in a "one on one" / round robin / speed dating-style session. 5 minutes then switch. You cannot not explain your project, just show and let the user try it and give you feedback. Then you can answer questions. User testing schedule will be provided on a wiki.
- Please add your link to your final project documentation on your section's wiki.