Skip to content
bit of vesp edited this page Oct 26, 2021 · 187 revisions

Week 7

RESOURCES FROM CLASS

TEST YOURSELF

ASK

Questions (example questions)

  • Josephine: (From Week 6) When using for (let each of array) or for (let other of array), how can we identify an item's index number? Do we have to use for (let i = 0; i < array.length; i++) to do so?
  • Cat: I am not sure why my first question code (grid that changes colors when clicked on) is not working properly
  • Vesper: how to manipulate the .js file on a webpage console?

READ / WATCH


Week 6

  • RESOURCES FROM CLASS

  • TEST YOURSELF

    • Optional Worksheet - You can complete it for Week 8 if you'd like.
  • DO:

    • Next week you will be presenting your own assignments. Duration: 5 minutes. Focus on what's happening in your sketch computationally. Write out what you're going to say and prepare any diagrams that will help you explain what's going on. See my demo video (It is much longer than the time you will have!)
      • Give yourself time to properly demo 1 aspect of your sketch.
      • Explain 1 thing you learned in making your sketch. Talk about what programming concept(s) you are using (e.g. objects and arrays, nested for loops, toggle logic, portable functions)
      • Write down what you're going to say ahead of time. Prepare diagrams to help get your point across!
    • OPTIONS FOR WHAT TO DO:
      • Mash up a couple of your past assignments.
      • Re-factor a past sketch and make it better.
      • Design a sketch that has lots of something (balls, sheep, eyes) using either arrays or arrays and objects.
      • IF you are already working with classes/objects and arrays:
        1. Re-organize / break-down your classes into the "smallest functional units" possible.
        2. Try different ways to have your objects "communicate" with each other in some way.
      • In the end the goal is to have code in draw() that only makes calls to objects. Something like:
function draw() {
  background(0);
  
  // A single object
  apple.chop();
  // Another object
  orange.peel();
  
  // Calling a function on all of the objects in an array
  for (var i = 0; i < grapes.length; i++) {
    grapes[i].pluck();
  }
}

Week 5

Homework Links


Week 4

Homework Links


Week 3

Homework Links: 1 Sketch Per Pair


Week 2

  • RESOURCES FROM CLASS:

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

  • DO:

    • Create a sketch that includes (all of these):
      • 1 element controlled by the mouse.
      • 1 element that changes over time, independent of the mouse.
      • 1 element that is different every time you run the sketch.
    • e.g. Try refactoring your Week 1 HW by removing all the hard-coded numbers except for createCanvas(). Have some of the elements follow the mouse. Have some move independently. Have some move at random.
    • e.g. Do the above but change color, alpha, and/or strokeWeight instead of position.
    • Or make something new!
  • WATCH, READ, RUN CODE:

    • Watch Conditionals 3.1 - 3.4 ~1hr | Get Code
    • Getting Started with p5: Chapter 5 (Response). | Get Code
    • Go further with Transformations (Optional)
      • Video Tutorials 9.1-9.3
      • 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...
    • How to use conditionals to see if my mouse is off canvas?
    • How to change the refresh rate of draw()?
    • How to fix the quivering circle that follows my cursor...? (question by vesper and here is the p5js link)
    • Do lines such as noStroke() apply to only the first shape underneath it or all shapes written underneath it?
    • Is it possible to slow down the circles (using random();)?

Homework Links


Week 1

  • RESOURCES FROM CLASS:

  • SET UP:

  • 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 – 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. 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:

  • 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?
    • In what situations do you initialize a variable as you are declaring it, i.e., let circleX = 0; function setup() {?
    • How to see my curser's real-time coordinates on my canvas?

Add Your Homework