03/09/2019
Today Chris has given us all tasks to do within Processing. The first task was to create a moving cross that follows your mouse when you move it. Below I’ve a screenshot of the code and the cross moving with the mouse.
Cross moving with mouse
After playing with the code I added in so when you click the mouse the cross changes colour. Screenshots below. I added in so it can change colour because it gives it that more interest and not just a plan white cross, I wanted more things to do within the code.
New tasks from Matt
Task one is to research camouflage development and its usage on people and objects. Outline how it works in principal By creating a visual mood board. Annotate you images and comment on the design of each pattern.
You need to select at least three different types of camouflage from the First World War to now.
Task two is to identify 3 more artists such as Bridget Riley who have used optical art to create a sense of movement or disruption. Compare and contrast is your visual findings in a WordPress blog.
You will need to deconstructs the elements of the artwork and use this to inform your own design which can be used in projection mapping.
Task three develop your own camouflage design which can be in photoshop or on paper you will then use this design develop a Processing sketch or projectable image for a video mapping project. Your design should be investigating how you can disguise a form through disruptive geometry make sure you annotate what your concept is and how you have realised this visually in your design
Task one.
Here are three types of camouflage that were used from World War 1. (pictures below)
Here are some facts about camouflage in the world war.
- Camouflage was mostly used on guns and vehicles.
- Each nation developed their own styles of camouflage.
Click Here for a link to a website explaining the truth about the camouflage used on helmets during the wars.
Dazzle camouflage
Camouflage is usually about blending in, but some of the most unusual camouflage during World War I wasn’t designed to do that.
Dazzle camouflage was a popular camouflage method, as the above video shows. Instead of attempting to hide a ship, the goal was to conceal the ship’s course through flashy misdirection. These colorful ships had artistically adventurous patterns that, due to the limitations of U-boat periscopes and torpedoes, were surprisingly effective at keeping ships safe.
Click Here for a YouTube video explaining why they used Dazzle camouflage in the war.
Task Two
Bridget Riley was educated as a classical figurative artist, but inspired by the American abstract expressionists, the Italian Futurists and the pointillism of Georges Seurat (1859-1891).
Bridget Riley
Below are some of Bridget Riley’s artwork. Her work gives your eyes an illusion and makes the picture like it’s moving whereas it’s a flat picture.
Pictures like this (below) can be used for camouflage, as you can see below the hand has the same effects as the background and it makes it inadvisable.
Georges Seurat
Georges-Pierre Seurat born on 2nd December 1859 – 29 March 1891) was a French post-Impressionist artist. He is best known for devising the painting techniques known as chromoluminarism and pointillism. (below) is one of his art pictures.
4/09/2019
Today Chris has given us a task to all do while at home, the task is to create a Processing Sketch of your choice (maybe a link to an interest of yours, favourite football team colours, EKC logo colours etc).
I’m going to create where you run the code one colour is there and then when you click the mouse the colour changes. So I support Chelsea FC so I’m going to do blue (as their home kit) and white as their away kit. (Pictures below)
I found a video (Click Here) where you have a moving rect and when you click the left mouse button the rect changes colour. It starts with White and changes to Blue for the Chelsea FC kits. (screenshots below)
My code:
Here’s what happens when you run the code.
It starts with a black background and starts with a white rect which is moveable and when you move it leaves a trail of the rect as shown above. When you click your left button on your mouse it changes colour (pictures below)
But to make it stay the seconds colour you have to click and hold the left mouse button and when you let go it changes back to the first colour.
Code:
void setup()
{
size (500,500);
background (0);
}
void draw ()
{
fill(255);
rect (mouseX, mouseY, 50, 50);
if (mousePressed && (mouseButton == LEFT))
fill (0,0,255);
rect (mouseX, mouseY, 50, 50);
}
I think this is a really good idea to do with the different colour kits and to bring them into my own idea in a code and to make the rect change to the colours of the football team I support. I could make this more wow by adding the Chelsea FC logo in as the rect and have the logo changing colour, that would be a cool idea.
We had to watch and learn about variables through this video that Chris had given us.
Below I’ve found an example of a variable.
Variables.
Variables are used for storing values. In this example, change the values of variables to affect the composition.
size(640, 360);
background(0);
stroke(153);
strokeWeight(4);
strokeCap(SQUARE);
int a = 50;
int b = 120;
int c = 180;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
a = a + c;
b = height-b;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
a = a + c;
b = height-b;
line(a, b, a+c, b);
line(a, b+10, a+c, b+10);
line(a, b+20, a+c, b+20);
line(a, b+30, a+c, b+30);
After running the code this is what it looks like (picture below)
09/09/2019
Today Chris has given all a task to do, we’ve to write up a code using processor to gradually change the canvas background colour from black to white with a click of the mouse when pressed.
I found a code online and used that, for the link (click here) and all I had done is change some of the code to make the colours change from black throughout the grey-scale to white. (picture below) is the code I’ve now.
When I run the code it starts with white colour and when you click the mouse it changes to black and then goes through the grey scale to white and ends in white, then resets back to withe (pictures below)
Code:
void setup() {
size(600,400);
smooth();
colorMode(RGB);
}
int col = 255;
void draw() {
background(col);
}
void mousePressed(){
col+=20;
col%=255;
println(col);
}
After going through the code I managed to tweak the code and made the colour black appear on startup when you run the program and not white.
Updated Code:
void setup() {
size(600,400);
smooth();
colorMode(RGB);
}
int col = 0;
void draw() {
background(col);
}
void mousePressed(){
col+=20;
col%=255;
println(col);
}
New Task
In the new task we’ve to find a logo of our choice can do with something we like (could be a logo of the football team you support, for example) and import the logo/picture into Photoshop. And in Photoshop using the eye dropper tool note down the RGB for all the colours used within the picture/logo. After we have all that we have to create an interactive processing sketch that uses the colours from your picture/logo.
For mine I’ll be using my dads business logo “Louise Jane Charters” (picture of logo below)
All RGB values used within the logo. (pictures below)
The main colours you can see by looking at the logo is blue and white but if you have a good look you can see the other colours that are used.
I’ll try and make a code where you have a rectangle and when you click the mouse the rectangle changes to each of one of them colours that is used within the logo.
23/09/2019
07/10/2019
Today Chris had given us all a task to do with perlin noise.
What is perlin noise?
Perlin noise is a type of gradient noise developed by Ken Perlin in 1983 as a result of his frustration with the “machine-like” look of computer graphics at the time. He formally described his findings in a SIGGRAPH paper in 1985 called An image Synthesizer.
We had a code given to us all and we had to mess around with the code to make it different colour, shapes and just to mess around with the code. Below is a video I recorded of my code after messing around with it.
we followed a tutorial on “Pointillism” with this code it will load the picture with sized pixels . Below you can see two pictures one is when you run the code and the second one is when you leave it running for few minutes.
You can also change the size of the pixels too within the code.
08/10/2019
Today Chris had given us all a task to do with audio within processing, we had to install “minim” in processing, that lets us able to play audio within the program.
We got given an simple code (below) and we had to download an mp3 song from the internet and then drag and drop into processing and when you do that the song gets put into a folder in the program.
If this is done correctly when you run the code the song should play.
As you can see below after dragging and renaming the song it’s in a folder inside processing.
And when running the song should play with a circle move along with the song.
After doing some research I manged to change the background with loads of shapes and a flashing background, I’ll leave a YouTube video below but there wont be any audio.
The website I found the code for flashing background and shapes.
14/10/2019
Today Chris gave us a task to do and in the task we had to make cars move across/forward by following a tutorial Chris had given us. (link below)
After following the tutorial I now have 7 cars moving forward from left to right across the canvas. (I’ll leave a video below of what happens when I run the code). When I run the code the shapes move forward and when I add in another bit of code I can make the shapes go backwards.
Adams Blogs 
Leave a comment