/

/

/

/

Processing is a free program that people use to design and create their own applicstions. It can be used to display data interactively on the computer. Different codes are used to generate different sketches and graphics that can enhance the look and interaction on a website or inteface with the user.

In my 'Processing' tutorials I learnt how to use the program and coding to creare a variety of different interactive graphics. I refered to the reference section from the Processing.org website, for the different codes in creating new shapes, objects, lines and renderings for the sketches.

Processing Website:

First things that I learnt to do was how to insert and change different background and fill colours, and create different simple shapes, such as eclipses and rectangles in the program. We looked into the basic set ups of the required codes as well.

I moved on to learn more about the ways of creating interactive graphics. In these two case, when the user hoovers their mouse across the sketch, a continuos trail of circles or dots (depending on whether the circle you created has a colour fill) would be made, forming very decorative designs.

To make the trail of circles look even more appealing and interactive, the colour and the size of the circles can be set to increase or decrease and darken or lighten, as the user moves their mouse across the sketch. In this case, I started off with small black filled circles, which gradually grew into bigger grey circles.

The circles grows bigger and bigger in size, as the user hoovers mouse over sketch. The user can stop this movement by moving their mouse pointer out of the sketch, once they have their desired designs.

After, learning how to create different shapes that would enlarge and shrink over a certain time period, I inserted sound (music) to my sketch. The circle would cetect the sound level and would enlarge and shrink accordingly to how loud or soft a certain part in the song was. To create a more interesting design, I created a few of these shapes on the same sketch. A very active and moving design was created.

In a similar way, I used the webcam from the computer, to detect the light level in the room and used text and changing numbers, instead of shapes to show the data. I inserted a picture into the sketch to experiment with positioning text.

To make the design even more interactive, I combined the use of two different images that represent light and dark into a sketch. Whenever there is a high light level in the room the camera would sense it and show the picture representing light and whenever it is dark in the room the picture representing dark would appear. I inserted relevant text and light level values to the sketch, the numbers change, as the light level increases and decreases.

_______

/