Tutorials in class

These are all the tutorials that Seb demonstrated with us during class. with all these tutorials I know all the basics to coding with processing.

This is using a simple function which adds 1 to the x any y position on every frame drawn. this causes the rectangle to move down the page diagonally. once it reaches the the bottom corner an if statement is used to reposition the x and y back to 0.

This uses and if statement which makes the ellipse show on mouse pressed. the position for x and y is controlled by the mouse position. because the background colour is inside the setup function it only draws the background once. this gives the affect of lots of ellipses being drawn.

This uses a combination of a class and an array. the class holds all the properties of the rectangle ( x and y position, width and height). the array list is then used to call up the rectangle class and draw it in different x positions 3 times. A Boolean statement is then used to define whether the mouse is inside the rectangle width and height.  if true the colour will change, if false it will stay as it is.


These particles are drawn with an array. the particle size are generated at random sizes between 0 and 2. velocity is applied to the x and y positions to make the particles move. the velocity is generated at random speeds too to make them look more natural. An array is cycled through generating a new particle every frame. there is a maximum number of particles generated before they are deleted, this stops processing slowing down from to much data. the maximum amount for these particles is 5000.


This example is using a for loop to create an ellipse through a range of HSB (hue, saturation, brightness) colours. It uses the map function to cause the ellipses to increase in size when the mouse rolls over them. we use 'dist' (distance) to work out how far away the mouse is away from each ellipse.


This is using a class to contain the data for the particles. It has gravity, fade and shrink added to it. Gravity causes's the particles to float up, fade causes the opacity to fade out and shrink causes them to get smaller in size. the particles class is called up with an array which counts through all the particles to draw them and apply the effects to every particle.


This is using the same particle technique as about but with the x and y positions controlled by the mouse position. It is them activated by the mouse press. With the properties tweaked it gives the affect of an explosion.


This is using float variables to hold the properties of the shape. It adds  the grow property to the width and height to make it get larger on every frame. it uses a counter to keep it between  0 and 600.


This is using the float variables to store the properties in.  an if statement is used to choose between red and blue. the if statement say it the rectangle reaches a set size then shrink. then when it reaches the next set size, grow.


This is using an array to draw out the rectangles with a different x position each time. it then uses the if statement to cycle through the array and decide whether the mouse is inside or outside each rectangle. if the mouse is inside the width and height of the current rectangle then the set colour will change.


This is using easing by multiplying the speed by a percent. this means that when the speed reaches the mouse position it will slow down by a little bit each time it passes. this will happen until the number reaches zero then the trail will end.


This uses an if statement with else if. it detects whether the mouse position is in the top corner then if its not it cycles through each corner to find where the mouse is. depending on which corner the mouse is in the colour of the rectangle will change.


This i an example of a basic pong game. it is using float variables to hold the properties for the ball. The speed is added onto the position in both x and y to make it move around the screen. An if statement is then used to make the ball bounce back in the opposite direction if it hit the edge of the screen. this is done by saying if the ball position plus the radius is equal to width or height, -speed away from position.
the bat it just a rectangle with the x and y position added to the mouse x and y. An if statement is then used to   to find whether the ball is inside the width and height of the bat. if it is bounce off, if not it will go outside the edge of the screen.