## Creative Coding: Assignment 1 Specifications

## Instructions

● Due: Friday, 23th August 2019 at 11:59pm (Brisbane time)

● Marks: 32% of your overall grade

● Late Submissions: Late submission is allowed but Penalty applies.

The penalty is defined as is the reduction of the mark allocated to the assessment item by 5% of the total weighted mark for the assessment item, for each working day that the item is late. A working day will be defined as Monday to Friday. Assessment items submitted more than five working days after the due date will be awarded zero marks.

● Extensions: You can request for an extension of time on one of two grounds, as follows: ○ medical ○ other (e.g., family or personal circumstances, employment-related circumstances, unavoidable commitments).

● Individual Work: You must complete this assignment individually.

## Overview

The purpose of the assignment is to assess your ability to implement simple interactions, shapes and objects using JavaScript and p5.js. You need to finish four following questions.

### 1. Question 1 (8 marks)

Using the following data and p5js to draw a pie chart about favorite types of movie.

Type Count Comedy 4 Action 5 Romance 6 Drama 1 SciFi 4

### 2. Question 2 (8 marks)

Sol LeWitt is a famous American artist. He came to fame in the late 1960s with his wall drawings and “structures” (a term he preferred instead of “sculptures”) but was prolific in a wide range of media including drawing, printmaking, photography, painting, installation, and artist’s books (https://en.wikipedia.org/wiki/Sol_LeWitt). In this exercise, you are asked to recreate the works of So LeWitt using p5js as following.

a. Six-part drawing. The wall is divided horizontally and vertically into six equal parts. 1st part: On red, blue horizontal parallel lines, and in the center, a circle within which are yellow vertical parallel lines; 2nd part: On yellow, red horizontal parallel lines, and in the center, a square within which are blue vertical parallel lines; 3rd part: On blue, yellow horizontal parallel lines, and in the center, a triangle within which are red vertical parallel lines; 4th part: On red, yellow horizontal parallel lines, and in the center, a rectangle within which are blue vertical parallel lines; 5th part: On yellow, blue horizontal parallel lines, and in the center, a trapezoid within which are red vertical parallel lines; 6th part: On blue, red horizontal parallel lines, and in the center, a parallelogram within which are yellow vertical parallel lines. The horizontal lines do not enter the figures. (4 marks) b. Draw a wall with “irregular wavy color bands”. Hint: you can use curveVertex and random functions in p5js library. (4 marks)

### 3. Question 3 (8 marks)

In mathematics, a Lissajous curve, also known as Bowditch curve, is the graph of a system of parametric equations which describe the complex harmonic motion (http://mathworld.wolfram.com/LissajousCurve.html). In this exercise, you need:

a. Write a p5.js program to draw a grid like following image. (4 marks)

b. Add animation for the curve like the sample in this link. (4 marks)

4. Question 4 (8 marks)

In order to attract new students, we need your helps to design a banner to promote the course and p5js. You are free to choose shapes, colors, animations … but your implementation needs to satisfy these following constraints:

a. Implement using p5js. b. Include at least 2 custom functions. c. Include at least 1 loop. d. Include animation. e. Harmony in design.