Assignment Set 1

Drawing

1.0 Exercise — Posting a p5.js Sketch

Create a simple drawing in p5.js using between 5 and 10 lines. Use the reference to help you use a shape function we didn't go over in class (e.g. arc, quad, triangle). The exercise is primarily designed to make sure you can correctly compile a processing program, and post it to your website.

1.1 Exercise — Abstract Composition

Create an abstract composition that includes the following:

• A canvas with a width at least two times its height
• A circle with a thick stroke
• A thin line that lies below the circle
• At least two parallel lines that are perpendicular to the line that lies underneath the circle
• Four small semi-transparent rectangles arranged in a brick-like pattern

1.2 Project — Self Portrait or Clock

Choose ONE of the following options:

---

Option 1: Portrait

Use the drawing primitives that we've gone over in class and others from the p5.js reference, create a simplified self-portrait in p5.js. Try to limit yourself to 10-15 shapes. It can be a cartoon, it can be representational, it can be abstract. Be creative. See the images below (made in p5.js) for inspiration.

---

Option 2: Creative Clock

Use p5.js' time functions to creatively visualize time. You can use the following functions: hour(), minute(), second(), and millis(). Try to think of a unique graphic representation of the concept of time... something you haven't seen before. Find some inspiration below:

To hand in your work get the URL from the editor and link to it from your index.html page. To receive credit, it must be uploaded by class on the date specified. Label it clearly. Here is help if you need it.

Projects will be graded on both creativity and implementation.