Practical: Working with p5js

Aims

• Familiarisation with JavaScript and p5 functionality
• Looking at examples of creative coding

Tasks

1. Look at the tutorials for p5. Follow through at least the getting started tutorial, with reference to the lecture notes too if things are not clear.

2. Also follow through the tutorials on colour, shape and curves. For more advanced features you might like to look at 3D or some of the libraries.

3. Have a look at some examples at creative coding. Follow the explore sketches link to see what others have been up to. For your coursework you will have to choose one of these and adapt it, so find one that you like and figure out how the code works. Note that some of these sketches use Java-like syntax, which is then translated into JavaScript by the library. You can tell this is the case if it has the function definition void draw() rather than function draw(). You can still work with one of these examples if you wish, but you will have to change the way that variables and functions are declared.