Processing Workshop #1

Within this workshop we were able to understand the meaning of conditional statements and nested loops.

This session allowed me to understand the basics of using integers and floats work at a beginners level and how to combine this with the colour mode which is written in my example at the top just after VOID SETUP and within the colour mode I was able to manipulate the Hue, Saturation and Brightness within the canvas of my work (colormode (HSB,100)).

Continuing from this I was able to separate different commands of the mouse buttons within the LEFT CLICK and RIGHT CLICK making each button do a different function however in this term I was able to make the left click randomize colour to create a rainbow effect with rapid and continuous circles being filled using different sizes by typing the code:

if(mouseButton == LEFT){
fill (random(100),100,100);

where as with the RIGHT CLICK i managed to allow a specific colour of only red to show but slowing the duration of when the red circles appear by 20% additionally with randomizing the size of the circle with making the RIGHT CLICK to save a preview of the canvas to a specified folder. The code:

else if(mouseButton == RIGHT){
fill (0,100,100);

Below are some examples of what has been done splitting both the LEFT and RIGHT click on each side of the canvas:

2nd Processing

After learning this I moved onto learning how to make basic shapes going across in a horizontal line as well as vertical to demonstrate the understanding of the nested loops and conditional statements. I began with learning how to make the pixels of a colour spread throughout the canvas using the function random(255) within the fill feature:

3rd Processing

Then I experimented the shapes to become bigger within each square by change the size of the rectangle to the same variables of the integer of 130:

4th Processing

From here I moved back to using the HSB and seeing how it would work if I was to randomize all the square sizes and colours by determining there shape size and fill to create a GIF to see if the experiment works:


 After this experimentation we went deeper into seeing how the shapes could create a image art form by rotating one shape continuously until a symmetrical piece of work could be implemented. By doing so i had to learn to use the rotation function. I also manage to create a piece where the fill was empty so the outlines of the square were diagonally rotating creating the piece below:



Learning all these functions I will be adapting both my skills in coding as well as my thought process into my interactive piece when the brief is set allowing me to come quicker to terms in what i want to do with experimenting what works well and what doesn’t by instantly knowing what code goes on what line and in-between what brackets giving me more time to implement more tests.



Processing (2014). Processing [online] Available from:[Accessed 16 October 2014].