PROCESSING
WORKSHOP
CHANGING BACKGROUND COLOUR
CONSTRUCTING A HOUSE
Defining the variables;
data input to create a proportionate house sketch using a square and lines. Adjusting the variables to create a triangle for the roof out of lines.
WORKING WITH PRE-EXISTING CODE
Using references on the Processing website, adjusting background colour using code "background (0,400,200)" where numerals are reflective of "(R,G,B)".
Values create a turquoise colour, with red set to 0, green 400 and blue 200.
Using code acquired from Processing online reference, an image set as the background creates a scene for the sketch.
1
2
3
4
As lines can't be filled, a triangle was created behind the roof lines with stroke = 0 and then colour filled in this way to fill in the roof.
Alternative colours achieved by manipulating the 'fill' section of code for each object in the sketch.
Original code take from OpenProcessing, downloaded the code and then tweaked the code to create variations of new sketches.
This shows the code I created for the left arm to move and the right arm that was moving in original code does not move, it stays stationary.
This is the code to make both arms move up and down but in the opposite direction to each other to create a see-saw effect.
1
2
3
This is the code to make both left and right arm, and left and right leg move. They all move in the opposite direction to their pair, so when the right leg moves left the left leg moves right, this applies to the arms also, the outcome i wanted was a dancing stick man.
Below see original code and sketch sample, when the cursor moves across the box the rabbit follows and changes colour depending on where in the box it is situated.
WORKING WITH PRE-EXISTING CODE
I deleted the shape of the rabbit and started the creation of a fish. The idea being "RAINBOW FISH" as it moves around the box it changes colour.
You can see here, the fish is located in a different area of the sketch box and it is a different colour than above.
WORKING WITH PRE-EXISTING CODE
CONTINUED
(click here)
(click here)
A sketch of a house-

seeing as i began by trying to create a house in 'processing' i thought this example would e relevant in showing what can be achieved with the correct knowledge.
This image looks simple but in fact it's very detailed and accurate in terms of the brickwork that has been added to the house, there is a portrayal of perspective with the angle of the pathway. It's a really successful sketch of a house that exceeds what i managed to produce in my experiments.


Moving imagery -

This explores the concept of scale and perception with the appeal of a hypnotic optical illusion. The spiral starts from nothing and continues to expand and fill the canvas entirely, this use of code if something i haven't explore myself, it is almost like a GIF animation. Although i explored with some movement with the 'rainbow fish' manipulation this is a moving animation which requires no information generation from the viewer.
(click here)
This example works in a similar way to the 'rainbow fish' manipulation. Unlike the above example where the sketch requires no interaction from the user to generate information, this sketch requires the movement of the mouse, this leaves a multicoloured trail. It allows manipulation from any viewer making it a much more open piece of design in comparison to some of the others.
I really like this idea that a viewer can create what they wish from this sketch. This 'open design' is very interactive, it is simple, yet intriguing, because no outcome will ever be identical, making it a unique sketch!
Source:
Source:
Source:
GO TO HOME
Using data in Processing-

Using fictional data (see left) that i created and them translating this to a brief data visualisation. Unfortunately the data set seemed too small for it to be effective in communicating.
(code from here)
(click here)