IFD:All Hail The Pixels/Patterns: Difference between revisions

From Medien Wiki
(Created page with "==ASSIGNMENT 1== ''' '' "Create three different patterns on paper and formulate these in code with properties using processing" '' ''' Please paste your images and processing s...")
 
Line 5: Line 5:
Please paste your images and processing sketches below:
Please paste your images and processing sketches below:


=== YOUR NAME ===
=== Rubab Paracha ===


* Pattern A
* Pattern A
//pattern of sqaures overlapping each other.  i tried to use colour and opacity to experiment how layers work in processsing
void setup() {
  size(600, 600);
  smooth();
}
 
 
void draw()
{
  background(0,102,102);
 
  stroke (255);
  strokeWeight (1.5);
 
  noFill();
  rect (30,200, 100,100);
 
  fill (150);
  rect (100,220, 100,100);
 
  fill (80, 100);
  rect (170,240, 100,100);
 
  fill (255,237, 188);
  rect (240,260, 100, 100);
 
  fill (167, 82, 101, 150);
  rect (310,280, 100, 100);
 
  fill (254, 190, 126);
  rect (380,300, 100,100);
 
  fill (254, 190, 126, 120);
  rect (450,320, 100,100);
 
}
* Pattern B
* Pattern B
* Pattern C
void setup() {
  size(900, 600);
  background(216,124,124);
}
 
void draw() {
  variableRect(mouseX, mouseY, pmouseX, pmouseY);
}
 
//abs() calculates the absolute value (magnitude) of a number. The absolute value of a number is always positive
// and draws a small rectangle if the mouse is moving slowly
// and draws a large rectangle if the mouse is moving quickly
// random(255) calls the random colours from 0-255 for the different squares
//working with opacity to show layering
 
void variableRect(int x, int y, int px, int py) {
  float speed = abs(x-px) + abs(y-py);
  stroke(0);
  fill(random(255),random(255),random(255), 190);
  rect(x, y, speed, speed);
}

Revision as of 14:38, 5 November 2014

ASSIGNMENT 1

"Create three different patterns on paper and formulate these in code with properties using processing"

Please paste your images and processing sketches below:

Rubab Paracha

  • Pattern A

//pattern of sqaures overlapping each other. i tried to use colour and opacity to experiment how layers work in processsing

void setup() {

 size(600, 600);
 smooth();

}


void draw() {

 background(0,102,102);
  
 stroke (255);
 strokeWeight (1.5);
  
 noFill();
 rect (30,200, 100,100);
  
 fill (150);
 rect (100,220, 100,100);
  
 fill (80, 100);
 rect (170,240, 100,100);
  
 fill (255,237, 188);
 rect (240,260, 100, 100);
  
 fill (167, 82, 101, 150);
 rect (310,280, 100, 100);
  
 fill (254, 190, 126);
 rect (380,300, 100,100);
  
 fill (254, 190, 126, 120);
 rect (450,320, 100,100);
  
}


  • Pattern B

void setup() {

 size(900, 600);
 background(216,124,124);

}

void draw() {

 variableRect(mouseX, mouseY, pmouseX, pmouseY);

}

//abs() calculates the absolute value (magnitude) of a number. The absolute value of a number is always positive // and draws a small rectangle if the mouse is moving slowly // and draws a large rectangle if the mouse is moving quickly // random(255) calls the random colours from 0-255 for the different squares //working with opacity to show layering

void variableRect(int x, int y, int px, int py) {

 float speed = abs(x-px) + abs(y-py);
 stroke(0);
 fill(random(255),random(255),random(255), 190);
 rect(x, y, speed, speed);

}