3 Speeds:
If you were feeling a little lost in class you might watch all the videos in the first clump. If you were comfortable in class, you can jump over the built-in variables that reflect user input and move right to the second group of videos about finding variables in your own fictional world on screen. (eg horizonal position, direction of movement). You should watch the video about “for loops” and the function videos before class. If everything is pretty clear so far you should try turning the graphical things moving around the screen into “objects.”
1) Review (If you understood everything in class you might skip these)
- Intro: What is p5.j / Why p5.js
- Flow
- Setup, draw, and drawing basics — You guys kind of know this already. The main loop function is called “loop” in Arduino but is called “draw” processing
- Color & Counting — we did this in class
- Built-in variables (mouseX, mouseY) — we did this in class
- Variables & Incrementation— This should be review
- Javascript Objects
- 3.2: Events (mousePressed, keyPressed) — we did this in class
- random()
- map()
- Using print— Instead of coming back into the serial monitor, println put text in the window under your sketch.
- Intro to Conditional Statements and Boolean expressions — ALSO CONTAINS LOGICAL OPERATORS ( <=, >=, ==) — Review
- if, else if, else — Also contains AND/ OR operators (&& , || )Review
- Boolean variables — ALSO CONTAINS mouse events — Review
- Bouncing Ball
- Examples: The flow: code blocks, setup, draw, and events: https://github.com/ITPNYU/ICM-2015/tree/master/01_drawing
- Examples: Variables: Declare, Initialize, Use: https://github.com/ITPNYU/ICM-2015/tree/master/02_animations
2) Make the Ball Bounce (get this to work and make something interesting with it)
- Incrementing a variable
- Intro to Conditional Statements and Boolean expressions
- Bouncing Ball — Riff on this for an assignment
3) Watch as much as you can stand before class (Definitely watch loops and functions ).
- For and While Loops
- Nested Loops In Loops
- Examples Loops: https://github.com/ITPNYU/ICM-2015/tree/master/03_interaction
- Functions & Objects & Arrays
- Javascript Objects
- Intro To Functions And Objects
- Function Basics — Parameters and Arguments
- Functions and Returns
- Functions in Objects
- Examples: https://github.com/ITPNYU/ICM-2015/tree/master/04_functionshttps://github.com/ITPNYU/ICM-2015/tree/master/05_objects_arrays
- What Is An Array?
- Arrays and loops
- Arrays Of Objects
- Object Constructor
- Resizable Arrays
- Multiple js files
- Clicking on Objects
- Deleting Objects
- Intersecting Objects Pt. 1
- Intersecting Objects Pt. 2
- Objects & Images
- Examples:Arrays: https://github.com/shiffman/LearningProcessing/tree/master/chp09_arrays
Homework
Create an animated application. Start over from scratch and build something with a very simple design. Focus on the logic of variables and avoid using hard-coded values. Play with making and incrementing your own variables. Try putting in some if statements to some rules to your world.
Get Together
Work in groups. Look at each other’s code. Help each other out.