WNM498/699 Module 02

Friday, January 18th, 2019 | Module

In this module, we will be learning how to set up our basic environment for coding, using the basic draw commands in p5js, and reviewing the research paper using a Bivariate analysis framework.

Lecture Slides — bivariate framework, art and design, exhibition and interaction


Demo Files

Demo Files on GitHub


Demo Videos

Watch videos 2.1–2.5 at The Coding Train.

Daniel Shiffman will cover the following code concepts

  • Variables
  • an introduction to objects
  • map()
  • random()

Who was Sol LeWitt? Watch the video from Tate London.


Recreate a “Forgery”

As useful exercise to familiarize yourself with the drawing tools, calls, commands, and objects of p5, you will be re-creating a work of art from a historical creator. These artists, primarily painters, often worked with similar procedural systems to create abstract geometries for specific purposes. Your job is to recreate one of their works in the browser using the tools of p5. 

Additionally, you should be familiar with your chosen artist and be prepared to briefly discuss their biography, era/movement association, and philosophical perspective. 


  • Sol LeWitt
  • El Lissitsky
  • Agnes Martin
  • Piet Mondrian
  • Wassily Kandinsky
  • Josef Albers

Make sure your aspect ratio of your work is matched in your canvas. You may either make graphics calls in the setup() or draw() functions, but don’t worry about animation or interactivity for the time being. You will need to research the color, shape, and rendering sections of the API in the p5js reference to recreate your work. You may use the translation properties in conjunction with push() and pop().

You may use functions, variables, conditions and loops if you are familiar with their implementation in javascript. Otherwise, rely on the simple function calls found within p5, as these technical topics will be covered later in the course. 

Submission Directions

Please submit all requisite source files and assets in a folder, ready to be viewed in a browser or server.

Due Date

This assignment is due next module.

< back to course home