Skip to content

Homework Ellen

Jump to bottom Edit New page
Ellen Nickles edited this page Oct 25, 2022 · 30 revisions
Section 06 Info
Meeting Time Tues 9:30am - 12:00pm ET
Location Room 412
Contact [email protected]
On weekdays I aim to respond within 24 hours
Office Hours Mon 2:30pm – 4:30pm
Tue 1:00pm – 3:00pm
Sign up here for Zoom or in person (near Design Lab)
Support Resident office hours (schedule)
The Coding Lab (schedule or drop-in help)
How to ask code-related questions: examples
Additional Materials Submit creative assignments
Assignment responses
Our Miro board
Course syllabus
p5.js Reference / Web Editor
The Coding Train's Intro to p5.js
Allison Parrish’s Creative Coding Notes
xin xin's Intro to p5.js
Qtv's Creative Coding tutorials in Chinese (also on bilibili)
HappyCoding.io

Contents

About Our Course

Description and Goals

Here is the description for ICM from the ITP Schedule. Upon completion of the first half of the ICM course, Code, we will be able to:

  • describe possibilities of computational thinking and coding for creative applications;
  • recognize p5.js (p5) as a Javascript framework for drawing graphics and working with media on the HTML Canvas element of a web page;
  • identify fundamental coding concepts, such as variables, conditionals, iteration (loops), arrays, functions, and objects;
  • identify approaches to debug errors in our code, including how to interpret error messages and print messages to the Console of the p5.js web editor;
  • practice and apply these coding concepts and debugging approaches in our creative work using p5.js.

Format

ICM Code is a seven-week course that meets once a week in person at the scheduled time. (After Code, ICM Media meets for another seven weeks at the same time and place.) We will have assignments to do before each Code class, and these assignments will build towards a final exercise to share at the end of the seven weeks.

This course embraces an active-learning approach with the belief that programming is best understood by doing. In keeping with this approach, class time will be structured as a workshop and seminar instead of a lecture, relying heavily on group discussion and participation. Weekly tutorials before class sessions will introduce fundamental coding concepts. During class, supplemental code examples will be presented and discussed before hands-on work together. Time will also be allotted to share our weekly assignments. Examples and assignments will iteratively build upon lessons learned in preceding classes.

I encourage you to reach out to me outside of class to ask questions, share ideas/feedback, and discuss topics in detail.

Weekly Assignment Guidelines

All assignments will be posted on this page, and all are required. Unless otherwise stated, assignments are due the night before class so that I have a chance to review your questions before we meet. All assignments are expected to be submitted by the stated deadline. If you anticipate any challenges meeting the deadline, please reach out to me so that we can consider your options together.

Reading and Video Tutorials

Before class, read and/or watch the assigned tutorials about fundamental coding concepts and creative programming techniques to practice together when we meet in class.

Weekly Worksheet

There are worksheets* (linked below) to practice the concepts introduced in this course. You are expected to add links to your p5 sketches directly in these documents.

Weekly Creative Assignment and Documentation**

Each week there is an open-ended exercise to apply the concepts that we practice. You are expected to document your process, include a link to your p5 sketch, and answer these questions:

  • What did you do?
  • What worked?
  • What didn’t work, and what steps did you take to try to solve the issue?
  • Did any code-related questions come up for you?
  • Be sure to cite (link to) any sources that you used, including and especially any code.

Submit these assignments using our homework form*.

Here is the spreadsheet with everyone's responses*.

A big part of learning at ITP is learning from each other. Share your work and in return you'll see everyone else's!

*Log in to your NYU account to access the document.

**If you are struggling with the weekly assignments, put your energy into writing about what didn't work and how you tried to solve it. It is totally okay to vent your frustrations. Document your work to reference later and to help you synthesize what you did and tried to do.

Week 1 • Sept 6 • Introduction and Drawing in p5.js

In class:

  • Welcome! and introductions
  • Course overview
  • What is p5?
  • p5 web editor
  • p5 functions
  • Tips for learning to code
  • Syllabus / schedule
  • What can we do with creative coding?

Examples:

Assignment due the night before our next class:

  • DO
    • Create a p5 web editor account.
    • Have a place online to document your creative assignments. This could be a website/blog, Notion page, or even a Google document. If you’re not sure what to use, please reach out to me for help.
  • READ • Learning to Learn (to program) by Paul Curzon
  • WATCH (BEFORE EXERCISES) • Coding Train videos 1.1-1.6 ~1hr 20min
  • PRACTICE • Week 1 Worksheet
  • CREATE • SELF-PORTRAIT
    • Think about what a self-portrait means to you. Is it a depiction of what you look like? A bridge between your private and public regard? Or a collection of your lived experiences?
    • Consult the p5 Reference. Add comments to your code to describe the different parts.
    • Submit your documentation on our homework form.
  • WATCH (AFTER EXERCISES) • Coding Train Videos 2.1-2.5 about variables, random(), and map() ~1hr

Week 2 • Sept 13 • Animation with Variables

In class:

  • Share our homework
  • Logging values to the Console
  • Introduction to variables
  • setup() vs draw()
  • Animating shapes
  • p5's system variables

Examples:

Assignment due the night before our next class:

  • WATCH (OPTIONAL) • Coding Train Videos 16.1-16.2 about keywords let, var, and const ~20 min
  • PRACTICE • Week 2 Worksheet
  • CREATE • OPPOSITES
    • Choose a pair of words with opposite meanings, such as “order” and “chaos,” “ascend” and “descend,” “empty” and “full.” Create one sketch to represent the pair of your choice.
    • Consider illustrating the opposite meanings through composition of elements, selection of colors, or any time-based change or movement.
    • Think about what you can do to make your audience sense or think of the two words without having to spell them out.
    • Submit on our homework form.
  • WATCH • Coding Train Videos 3.1-3.4 about conditional statements ~1hr

Week 3 • Sept 20 • Interaction with Conditionals

In class:

  • Share our homework
  • Relational expressions and conditional statements
  • Boolean variables
  • Combining expressions

Examples:

Assignment due the night before our next class:

  • PRACTICE • Week 3 Worksheet
  • CREATE • CHOICES
    • This week introduced how to write conditional statements to control the flow of our programs. Create a sketch that represents a choice/s that impact/s your life or others on a day-to-day or long-term basis.
    • Which choices are easy? impossible?
    • What internal or external factors influence decisions? How do others' choices affect you?
    • What choices surprise you with unexpected outcomes?
    • What choices don't you have?
    • Submit on our homework form.
  • WATCH • Coding Train Videos 4.1-4.2 about loops ~25min

Week 4 • Sept 27 • Repetition with Loops

In class:

  • Share our homework
  • Review conditional statements
  • Introduction to loops
  • Creative coding examples
  • Anonymous check-in survey

Examples:

Assignment due the night before our next class:

  • PRACTICE • Week 4 Worksheet
  • CREATE • PATTERNS
    • We humans have a tendency to look for patterns everywhere. We see patterns in nature and on the urban streets of New York. We rely on patterns we’ve detected in life to make predictions and acquire knowledge. Computation is all about patterns.
    • Observe, both outside (your surroundings) and inside (your history of thoughts and feelings), make a sketch about a specific pattern you find.
    • Get creative. Think about how you can tell the unique story of the pattern using code.
    • Submit on our homework form.
  • WATCH
  • READ • p5 Tutorial: A Field Guide to Debugging

Week 5 • Oct 4 • Organization with Functions

In class:

  • Introduction to arrays
  • Share our homework (1/2 class)
  • Define functions to perform tasks
  • Call functions with and without arguments
  • Functions that calculate values for us

Examples:

Assignment due the night before our next class (in two weeks):

  • PRACTICE • Week 5 Worksheet
  • CREATE • TIME
    • This week’s computational theme is organization. In what ways do we conceive of and organize time? Create a sketch to represent “time”. Think about what quality of time you would like to portray. A few ideas to consider:
      • The passing of time through change, motion, or accumulation of elements
      • The relativity of time
      • Time twisted
      • Capturing time
      • The stillness of time
      • …what else?
    • Submit your documentation on our homework form.
  • WATCH • Coding Train Videos 6.2-6.3 and 7.3-7.7 about writing classes to create many objects, mouse interacting with those objects, and objects communicating with each other ~1hr 40min

Week 6 • Oct 18 • More Repetition with Classes

In class:

  • Survey results
  • Share our homework (1/2 class)
  • Introduction to classes to make objects
  • Objects with arrays and loops
  • Adding objects with mouse press
  • Mouse interaction with objects (and class methods that return values)

Examples:

Assignment due the night before our next class:

  • PRACTICE • Week 6 Worksheet
  • CREATE • SIMULATION
    • The idea this week is to explore the topic of simulation with computation. Now that we can scale our programs with many more objects to behave independently of one another, in what ways can we model the world around us? To get started, consider how simulations might be used to:
      • Practice a procedure
      • Test a strategy
      • Visualize a system (natural? biological? social?)
      • Study a situation to predict or retell an event
    • Submit your documentation on our homework form.
    • Prepare a 4-minute presentation to share with the class to introduce your sketch, choose one interaction to demo (which one is the most interesting to you?), and walk us through the related code. Use your documentation as an outline to help you plan out everything you want to share. This is an opportunity to practice the technical language introduced in this course.
  • READ / INTERACT • Allison Parrish’s tutorial on Browser Controls
  • WATCH

Week 7 • Oct 25 • The DOM: HTML and CSS / Present Final Assignment

In class:

  • Intro to the Document Object Model (DOM)
  • Adding HTML elements, tags vs. p5
  • Present ICM Code final assignment

Examples:

Assignment due the night before class

Starting Week 9 (Nov 1) we'll use the ICM-2022-Media Homework Ellen Wiki

Dipika Titus--Blog

Add a custom sidebar
Clone this wiki locally