01_pixels.md

Introduction to ICM: Media

Question

Why are we interested in computing media?

Pixels: Pixels as Data

Some of the videos in this section were created using a different editor for p5.js. All of the concepts should still apply, however, there are some minor changes. Most notably in JavaScript let is now the preferred way to declare a variable over var. If you would like to learn more about this you can watch this video about let vs var.

Question

What can we express through algorithms?

Video Tutorials

Basics

• 11.1: Live Video and createCapture()
• 11.3: The Pixel Array

Ways to play with pixels

• 11.4: Brightness Mirror
• 11.5: Checkbox Mirror
• 11.6: Painting with Pixels—The particle objects in this video are using an older syntax for JavaScript that is different from classes. The accompanying code example is updated with a Particle class.

Fun way to animate

• 11.2: Video Photobooth / Muybridge Style Animation
• 11.7 Slit-Scan Video

Mixing video

• p5VideoKit - a dashboard for mixing video in the browser

Code

• Code for video tutorials in p5 editor
• Code for video tutorials on github
• Chapter 15 (images and pixels) from Learning Processing ported to p5.js
• Chapter 16 (video) from Learning Processing ported to p5.js

Getting Started with p5.js book

• Chapter 7 through Ex. 7-9 of Getting Started with p5.js book - Ebook (free with NYU Library login)

Reference

• p5 reference: pixels
• p5 reference: get()
• p5 reference: set()
• p5 reference: copy()
• p5 reference: filter()
• p5 reference: createVideo()
• p5 reference: createCapture()
• p5 reference: p5.MediaElement