Thursday, 17 May 2012

The Process

I started off with a precedent image, a close up of an eyeball. My aims an objectives of the project are to create something similar using tools in Processing, and to come up with a changeable, interactive image which bears something almost identical to my precedent image


 


 

The process continues with my design in Processing. Asyou can see there are many variations within my form. These are made by using the mousePressed and mouseReleased tools to create the interaction with the eyeball. As you can se, it's far from complete, as there is a lack of colour and symmetry.


 

Stage 1


 


 

Stage 2


 


 

 Stage 3


 

Stage 4


 

Stage 5


 

A re-edited colour version of my form. Notice it is more symmetrical and has more life and noise to it. It is not structured, but contains the form of an eyeball more clearly. I plan to make this form a little more digital and 3D


 


 

Stage 1


 


 

Stage 2


 

Stage 3


 


 

 Stage 4


 

Below I have created a recolour of the image and the form. I have also taken away some of the variables to remove the outside lines


 

From this image I plan to be able to grow and shrink the black hole in the middle


 


 

Below are some concept images of how I've managed to 'do this' and the coding is displayed below the images


 

float eyeSize = 1;

float it = 0;

int slow = 0;

int slowitdown = 0;

void setup(){

 

  size(400, 400);

  background(0);

  smooth();

}

void draw(){


 

  translate(200, 200);

  scale(eyeSize);

  that();

  it = it + 0.15;

  if(it > 100);

  it = 0;

 

  eyeSize = mouseX/400.0 + 0.7;

 

  if(slowitdown == 1) {

    slow = slow -1;

    println(slow/10);

    frameRate(slow/10);

    if(slow <= 0) {

      slowitdown = 0;

    }

  }

}

float r = 2.0;

void that(){

 

  rotate(random(-1,r));

  int x = 0;

  while(x < 50){

   strokeWeight(1);

   stroke(255, 155, 0);

 

  line(20, 50, 75, 60);

  stroke(200, 100, 0);

  line(50, 50, 75, 60);

  stroke(200, 55, 0);

  line(80, 50, 75, 60);

 

 

  stroke(0, 255, 200);

  line(110, 50, 75, 60);

  stroke(0, 200, 155);

  line(140, 50, 75, 60);

  stroke(0, 155, 100);

  line(170, 50, 75, 60);

 

  rotate(random(-r,r));

 

 

 noStroke();

 fill(0);

 

 

  strokeWeight(0);

  line(mouseX, 70, 75, 60);

rotate(random(r+1));

  x = x + 10;

  }

}

void mousePressed(){

  //loop();

 

  slowitdown = 0;

  slow = 600;

  frameRate(slow);

}

void mouseReleased(){

  //noLoop();

  slowitdown = 1;

}

void keyPressed(){

  if(key == 's') {

    save("image1/"+frameCount+".png");

  }

}


 


 


 

Within the process of my coding, I have added assorted colours to give an electric feel to the picture. As shown in the previous photos, the lines all rotate in the same direction. However, using loops and altering the line parameters and colours, I have created a more messy atmosphere. Now the image appears to be more lifelike. Here are some concept images in their stages. The grow and shrink tool is still evident.


 

Stage 1

Stage 2

Stage 3

 


 


 

 

No comments:

Post a Comment