Next Assignment

Week 3

• RESOURCES FROM CLASS:

  • Move line-rect towards mouse
  • 3 columns
  • Bouncing Ball - Doesn't Work
  • Bouncing Ball - Works

• TEST YOURSELF: Complete Worksheet 3

• DO: Two roads diverged in a yellow wood, And sorry I could not travel both... Life is full of difficult choices, use conditional statements to control the flow of your programs. Create a sketch that asks people to make difficult choices that have surprising consequences.

  • Which choices are easier, harder? Which choices are false choices?
  • What internal or external factors influence the choice? How do others’ choices affect your choices?
  • What choices surprise you with unexpected outcomes?
  • Can you combine choices to create hard-to-predict results? (Hint: Use && and ||)
  • Work in Pairs Can you divide an idea into two parts and combine those parts? (e.g. One of you codes the input behaviors (if statement) and the other one codes the output behaviors (what to do if it’s true.) Can you swap sketches and riff off of your partner's work? Provide 1 sketch link per pair, however clearly describe who did what in the code.

• READ / WATCH

  • Videos 4.1-4.2(~25min) in the learning p5.js series. | Code
  • Chapter 4.5-4.13 of Getting Started with p5.js book | Ebook (free with NYU Library login) | Code

• ASK

  • Post at least 1 question below. Examples of good questions...

Homework Links: 1 Sketch Per Pair

• Your Name -- [Title of Blog Post](Link to Blog Post), [Title of Sketch](Link to Code) -- any other comments

---

Week 2

• RESOURCES FROM CLASS:

  • width-2-height corners

• TEST YOURSELF: Worksheet Post a url to your answers on the Google Doc.

• DO:

  • Consider the following cliches / pearls of wisdom: No man is an island. There is no such thing as a new idea. Everything is related to everything else. It’s all relative. The world is defined through relationships and those relationships shape our perspectives. Use variables to build in some relationships between two or more elements in your sketch and think about how the perception of what’s happening is different depending on which element's perspective you take on. Think about:
    • What’s related to what?
    • How are they related?
      • Is it a positive or negative relationship? Example sketch.
      • Is it an amplifying or diminishing relationship? Example sketch.
  • You should definitely take a mathematical approach to answering these questions but you can also take a figurative, metaphorical approach.
  • The elements common to all of your sketches are: position, dimensions, stroke thickness, color values. Can you relate one or more of these elements to:
    • itself over time (so it changes over time)
    • a different element in your sketch
    • frameCount (which frame of animation is now)
    • mouseX or mouseY or the combined (mouseX, mouseY) mouse position
    • or something else!
  • You can revisit your self-portrait to build relationships (link the eyeballs together!) or create something new.

• WATCH, READ, RUN CODE:

  • Watch Conditionals 3.1 - 3.4 ~1hr
  • Getting Started with p5: Chapter 5 (Response). | Chapter 5 Code
  • Go further with Transformations (Optional)
    • Transformations Video Tutorials
    • Getting Started with p5: Chapters 6 (Transformations) and 8.10-8.15 (More complex motion)

• ASK

  • Post at least 1 question below. Examples of good questions...

Homework Links

• Boaty McBoatface -- [blog post](url to blog), [zoog]

---

Week 1

• RESOURCES FROM CLASS:

  • p5 Editor
  • p5 Reference
  • Order of Operations Example

• SET UP:

  • Sign up for a Github Account. You need it to edit this wiki page.
  • Log into a p5.js web editor account with your github account.

• DO:

  • Complete this worksheet. Our weekly worksheet become the basis for the next class. You must be logged in with your NYU account to access the worksheet.
  • Create a "self" portrait using 2D primitive shapes. Play with symmetry in your portrait. Shapes include – arc(), curve(), ellipse(), line(), point(), quad(), rect(), triangle() – and basic color functions – background(), colorMode(), fill(), noFill(), noStroke(), stroke(). Remember to use createCanvas() to specify the dimensions of your window and wrap all of your code inside a setup() function. Here's an example: Zoog
  • Write a blog post about how computation applies to your interests, due 24 hours before the next class. This could be a subject you've studied, a job you've worked, a personal hobby, or a cause you care about. What projects do you imagine making this term? What projects do you love? (You can review and contribute to the ICM Inspiration Wiki page). In the same post (or a new one), document the process of creating your sketch. What pitfalls did you run into? What could you not figure out how to do? How was the experience of using the web editor? Did you post any issues to github?

• READ AND WATCH:

  • Follow the TO THE LESSON Link:
    • Watch before HW: Videos 1.1 - 1.6(~1h 15m)
    • Watch after HW: Videos 2.1 - 2.3(~30m)
  • If you prefer books, Chapters 1-3 of Getting Started with p5.js cover the same material. Log into the NYU network to read it for free.

• ASK

  • Post at least 1 question below. Examples of good questions...
  • Name (optional) -- Question: Why is it that this is like this and that is like that?