-
Notifications
You must be signed in to change notification settings - Fork 5
Homework John Henry
ICM Section 02 • Meeting Wednesday 6:40pm - 9:10pm ET in Room 410
- Contacting John Henry
- About Our Course
- Week 1 Introduction and Drawing
- Week 2 Animation: Variables
- Week 3 Interaction: Conditionals
- Week 4 Repetition: Loops
- Week 5 Functions Objects Arrays
- Week 6 Classes
- Week 7 The DOM and Review
Here is my calendar to sign up for office hours
My email is [email protected].
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 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.
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 video tutorials to watch 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.
Your are encouraged to reach out to me outside of class to ask questions, share ideas/feedback, and discuss topics in detail.
Before class, watch the video tutorials about the fundamental coding concepts that we will practice together when we meet.
There are also weekly programming assignments that are relevant to the material from previous classes. Assignments are due on Tuesday at 11:59pm the day before our 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, and you should be prepared to show and talk about them in class. If you anticipate any challenges meeting the deadline, please reach out to me so that we can consider your options together.
A big part of learning at ITP is learning from each other. Share your work and in return you'll see everyone else's!
- Weekly Practice Questions. There are questions (linked below) to practice the concepts introduced in this course. You are expected to add links to your p5 sketches directly to our weekly exercise documents. Log in to your NYU account to access the documents.
- Weekly Creative Exercise and Blog Post. Each week there is an open-ended, freestyle creative exercise to apply the concepts that we practice. You are expected to submit links to your blog posts and sketches in this form.
If you are struggling with your weekly exercise sketches, 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. Writing a blog post helps to remember and synthesize what you did and tried to do. Think of it as writing a reference guide for your future self.
- ICM Code syllabus (overview, grading and attendance policies, and statements)
- p5 Resources
- p5 creative coding library: Reference | Web Editor
- Video tutorials
- Written tutorials
- Allison Parrish’s Creative Coding Notes
- Lauren Lee McCarthy's Getting Started with p5.js online at NYU Library | Amazon
- HappyCoding.io
- Digital Harbor's Creative Programming Course
- Coding for Designers Demystifying Code and Learning JavaScript
- If you find yourself struggling, there are many forms of support at ITP:
- Look out for the residents' office hours and help sessions.
- Visit The Coding Lab to ask ITP student mentors about your code.
- Here are some examples of how to ask code-related questions.
Meeting Wednesday, September 8
In class:
- Welcome! and introductions
- Safety precautions and communicating in class
- Course overview
- What is p5?
- p5 web editor
- Syllabus / schedule
Homework assignment due Tuesday, Sept 14, at 11:59pm:
- video 1.1 Introduction (~13 min)
- video 1.2 p5.js Web Editor (~8 min)
- video 1.3 Shapes and Drawing (~26 min)
- video 1.4 Color (~18 min)
- video 1.5 Errors and Console (~7 min)
- video 1.6 Code Comments (~7 min)
-
Complete the practice questions and Creative exercise in this Week 1 Exercises document.
-
Submit links to post and sketches in this form.
- video 2.1: Variables in p5.js (mouseX, mouseY) (~11 min)
- video 2.2: Variables in p5.js (Make your own) (~11 min)
- video 2.3: Incrementation Operations (~5 min)
- video 2.4: random() (~11 min)
- video 2.5: map() (~11 min)
In class:
- Why so many coding languages?
- Questions
- Homework review
- Variables and Functions
- p5 functions
setup()
anddraw()
- Introduction to variables
- Create our own variables
- Introduction to object literals
- p5 system variables
Resources:
Examples:
- Scope: global and local variables
- Object literal
- Responsive rect
- Ellen's portrait animated using
random()
andmap()
Homework assignment due Tuesday, Sept 21, at 11:59pm:
-
Complete the Practice questions and Creative exercise in this Week 2 Exercises document.
-
Submit links to post and sketches in this form.
-
video 3.2: Bouncing Ball (~8 min)
-
video 3.3: else, else if, and, or (~17 min)
-
video 3.4: Boolean variables (~20 min)
-
video 16.1: about keywords let, var (~13 min)
-
video 16.1: about keyword const (~8 min)
-
video 9.1: translate (~ 22min)
-
video 9.2: scale (~ 9 min)
-
video 9.3: More on transformations (~ 9 min)
-
Coding Train Coding Challenge #163 on Bézier curves ~23 min
Resources:
Homework assignment due Tuesday, Sept 28, at 11:59pm:
-
Complete the Practice questions and Creative exercise in this Week 3 Exercises document.
-
Submit links to post and sketches in this form.
-
video 4.1:
while
andfor
(~14 min) - video 4.2: nested loops (~10 min)
Resources:
Homework assignment due Tuesday, Oct 6, at 11:59pm:
-
Complete the Practice questions and Creative exercise in this Week 4 Exercises document.
-
Submit links to post and sketches in this form.
-
video 5.1: Function Basics (~13 min)
-
video 7.1 What is an array? (~14 min)
-
video 7.2 Arrays and loops (~9 min)
Resources:
Homework assignment due Tuesday, Oct 12, at 11:59pm: Correction was Oct 13
-
Complete the Practice questions and Creative exercise in this Week 5 Exercises document.
-
Submit links to post and sketches in this form.
-
video - 6.2 Writing a Class (~20 min)
-
video - 6.3 Constructor Arguments (~8 min)
-
video - 7.3 Arrays of objects (~15 min)
-
video - 7.5 Removing objects from arrays (~19 min)
-
video - 7.6: Object Communication Part 1 (~14 min)
-
video - 7.7: Object Communication Part 2 (~19 min)
-
video - 6.4: Adding JavaScript Files in p5.js Web Editor (~6 min)
Resources:
Homework assignment due Tuesday, Oct 19, at 11:59pm:
-
Complete the Practice questions and Creative exercise in this Week 6 Exercises document. Note the Creative exercise is a two week assignment.
-
Submit links to post and sketches in this form.
-
Method 1 • Coding Train Video 8.1 on creating HTML elements on a webpage with HTML tags ~13min
-
Method 2 • Videos 8.2 and 8.4 on creating HTML elements with p5 ~20min
-
(OPTIONAL) Videos 8.3 and 8.5-8.10 for more on HTML and CSS with p5 ~1hr 45min
Resources:
Homework assignment due Tuesday, Oct 26, at 11:59pm:
-
Complete the Practice questions in this Week 7 Exercises document
-
Complete the Creative Exercise for the design you presented in class.
-
Submit links to post and sketches in this form.
- READ • Allison Parrish's Media: Images
- WATCH
- Coding Train Video on Uploading Media Files in the p5.js web editor
- Video 7.8 on adding images to objects
- Video 11.3 on the pixel array sketch
Resources: