p5.js Moire Project

This project involves the creation of a number of p5.js sketches that produce moire effects.

System overview

This repository contains resources to get started with this activity. Generally, we will refer to this repository each meeting to download and install necessary software, access multimedia content related to our project, and store our project files.

Meeting 1: Introduction, Software Setup, and Code Commenting Activity

Introduction

We'll start out by familiarizing ourselves with moire effects and random dot patterns by exploring the following content:

• Freaky Dot Patterns - Numberphile with Dr. Tadashi Tokieda
• Quanta Magazine Article: Moire Patterns

Software Setup

• Create a GitHub account
• Install Atom editor
• Install Teletype package in Atom:
  • Preferences > Install
  • Portal > Authenticate with GitHub account > Get Token

Code Commenting Activity

To start using deictic code commenting, we'll first conduct an activity that introduces deictic comments before implementing them in a pre-existing p5.js sketch.

• Visit my example p5.js sketch with deictic comments
• Visit the Comment Codebook page for getting started with using deictic comments.
• Download the p5.js sketch files in the vertex_spinner_sketch folder
  • Task: Imagine your in-code comments must serve to explain this sketch to a future reader. Review this code together, and using the Comment Codebook, comment the following sketch.

Wrapup

Let's discuss the commenting activity and schedule meeting 2.

Meeting 2: Defining the problem, Starting to sketch

Defining the problem

How can we use p5.js to simulate dot patterns and moire effects?

• Refresh of Dr. Tokieda's examples
• How might we approach creating the multiple examples outlined by Dr. Tokieda?
• How might we organize the tasks necessary to complete this project?

Starting to sketch

Let's start collaboratively sketching in p5.js using deictic comments as needed.

• Download the p5.js library files
• Open Atom
• Start Teletype
  • Portal > Authenticate with GitHub account > Get Token
• Refer to the Comment Codebook for commenting

Wrapup

Let's debrief and schedule meeting 3.

Meeting 3: Collaboratively Sketching

We'll use this meeting to continue with your p5.js sketches, referring to Dr. Tokieda's examples as needed.

Also refer to the Comment Codebook for commenting, as needed.

Wrapup

Let's debrief and schedule meeting 4.

Meeting 4: Continuing Collaboration, Audiencing Discussion

We'll use this meeting to continue with your p5.js sketches, and discuss how we might share our work with others.

How might we share our p5.js code with an interested audience?

• Refer to Dr. Tokieda's examples as needed.
• Also refer to the Comment Codebook for commenting, as needed.

Wrapup

Let's debrief and schedule meeting 4.

Meeting 5: Pen Plotting

We'll use this meeting to discuss pen plotting.

Pen Plotting example