Skip to content

Homework Mimi 04

Jump to bottom Edit New page
yj3612 edited this page Oct 3, 2026 · 115 revisions

Week 5

Homework Links

Week 4

  • RESOURCES FROM CLASS:

  • TEST YOURSELF: Complete Worksheet 4

  • DO: Our ability to see patterns is what makes us human. However we also see patterns where none exist because our brains are biased towards detecting certain kinds of patterns over others (e.g. faces). Create a pattern by making something with a lot of repetition. Is the resulting pattern easy to see or hard to see? What would it mean to create the illusion of pattern? Can you predict what the pattern will be when you run your code or does it surprise you? You could take something you've already done where there was a lot of repetition in the code (e.g. your self-portrait) and see if you can re-write it using a loop so that instead of 28 lines of code that call rect(), you have 1 line of code calls rect() inside of a loop that goes around 28 times. How do you need to rework the way you position that rect() in order to make it work in a loop? Try creating an algorithmic design with simple parameters. (One example is 10PRINT, example code).

  • READ / WATCH

    • Videos 5.1-5.3(~40min) in the learning p5.js series.
    • Getting Started with p5.js chapters 9-10

  • RUN CODE

  • ASK * Post at least 1 question here. Need help on asking a question?

    • Name (optional): Question
    • Shelby: For the 'while' loop, why did I have to put the c variable's initial value where I did (line 35), instead of where I originally thought I should put it (in the setup loop on line 26)? https://editor.p5js.org/sa-ITP/sketches/tocpUSo5X
    • Kate: I have a question on my blog about which way of writing code is better
    • Yuyuan: For worksheet Q2(a), I was trying to skip column #7. I expected the 7th row to be skipped when columnN == 7 and on == false, but instead, nothing was displayed. Here is my incorrect code .

    *Doha: If shapes follow a clear pattern, you can easily arrange them with a loop. But what if you want to create an irregular arrangement? You can use random(), but then you don't have much control over the composition. Is there a way to use a loop to create irregular positions or shapes while still having control over the result?

    • Colin: A fill effect happens when I change addition to multiplication in line 21 of my FOR Loop link (if(mouseX>=C20 && mouseX<=C20+20) -> if(mouseX>=C20 && mouseX<=C20*20)) (https://editor.p5js.org/ColinTP/sketches/Vsj2AHJ2a) why does this happen?
    • Siyin: Question: 1. When I want shapes/behaviors to change according to both mouseX and mouseY, how to divide up the conditionals? currently I have if (x<400) { if (y<400){do A}; if (y>400){do B} }; else if (x>400) { if (y<400){do C}; if (y>400){do D} }; which feels redundant. Is there a way to simplify this logic? This question is related to my creative assignment. 2. As our functions become more complicated, could we clarify when to console.log? eg. inside/ outside a loop, inside/ outside a conditionals.

Homework Links

-- any other comments

Week 3

in one attempt, I declared and initialized a variable in two lines: let ON; let ON=false. there's a false notification saying "this variable is already been declared". Why is that so?

Yuyuan- For worksheet Q2 I use reset = !reset, the state keeps toggling every frame while the mouse stays over the column, causing flickering. Is there a way to make it change only once each time the mouse enters the area?

  • Colin - What's the difference between using "var x = 0" and "let x = 0"? Both "var" and "let" seem to function very similarly.

-Doha : Is it possible to include a clickable hyperlink in a code comment? I like to leave references in my homework so I can remember where I learned a particular part of the code. It would be helpful if I could click the URL in the comment and go directly to the source.

Homework Links: 1 Sketch Per Pair

Week 2

  • RESOURCES FROM CLASS:

  • TEST YOURSELF: (Only use what we've learned so far: calling p5 functions and variables.) Worksheet ONLY POST WORK YOU WANT ME TO LOOK AT

  • 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?
    • 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 between features OR create something new.

  • WATCH, READ, RUN CODE:

  • ASK

    • Post at least 1 question below. Examples of good questions...
    • Kate: when I set width of rect to correlate to sin, why is it not a smooth change, but stepped (I figured out)
image - Shelby: Is there a "dist();" for angles? OR can "dist" work with angles? (I have a feeling I still have a fundamental misunderstanding about PI and ellipses, lol.) Basically, I'm wondering if there's a simple way to calculate the locations of the intersections of the two ellipses here: [https://editor.p5js.org/sa-ITP/sketches/urIh2_VfE](https://editor.p5js.org/sa-ITP/sketches/urIh2_VfE)
  • Colin: What's the purpose for having the 5th or 8th arguments in a rect() function? Furthermore, the triangle() function moves weirdly compared to ellipse() and even more so than rect(), why is that?

*Doha — In the tutorial videos, I noticed that sometimes let is used to declare a variable, while other times var is used. Is there an important difference between them? The videos seemed to suggest that they work slightly differently, but I am still not sure exactly how they are different or when I should use each one.

  • Hanna — Why does my transparent light look different when background() is in draw() instead of setup()?
  • Yulan - When a circle moves diagonally by changing both its x and y positions, why does it appear to move faster than a circle moving only horizontally or vertically? How can I make all the circles move at the same actual speed?
  • Siyin: How do I create a line rotating according to the direction of the mouse while not changing the length of that object?

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. ONLY POST WORK YOU WANT ME TO LOOK AT
    • 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 no more than 5 sentences about how computation applies to your interests, due 24 hours before the next class. Pick one of the following to address (a,b, or c):
      1. Something you studied, a job, a hobby, or a cause you care about.
      2. Describe a project you want to make. Why do you want to make it?
      3. Describe a project your love. What do you appreciate about it that others don't always immediately get? (You can review and contribute to the ICM Inspiration Wiki page).
    • In the same post (or a new one), point to one thing in your code that you'd like us to talk about in class. Cite the line number(s). Be prepared to talk about why it's interesting to you.

  • 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?
    • Kate -- What's the difference of putting "let x = 50;" inside and outside of draw()?
    • Colin -- What commands can be typed to rotate a shape, or an image?
    • Doha -- Is there a way to group multiple shapes together so that you can move or resize the entire object at once instead of changing each shape individually?
    • Shelby -- Why does the "arc" function use radians and not degrees?
    • Steven -- Why does putting x++; in a different place cause the square to stop moving?
    • Yulan -- Why does the square seem to disappear when I move the if (mouseX > x && mouseX < x + 50) statement before rect(x, 200, 50, 50), but reappear when the mouse reaches it?
    • Hanna --Why does a transparent color become darker over time when I use fill(R, G, B, alpha)

Please make sure your posts are publicly accessible by testing them in an Incognito (Chrome) or Private Browser (Safari).

Add a custom footer
Add a custom sidebar

Clone this wiki locally