Assignment 2 – AakifR

Concept:
I wanted to use the Urdu word عشق or Ishq and create a fun pattern with it while also involving some level of animation in it. I created a function that would make the word and then I called it in the draw function to repeatedly draw the word on the canvas and create a repetitive pattern. I changed how the word looks each time it is called by using random(). If you want the animation to restart, you can click your mouse.

Highlight:
Not technically too exciting, but I’m kind of proud of creating the word عشق through programming. It was a slightly tedious process and I’m also interested in learning how to streamline that process.

Sketch:

Reflection:
I really wanted each عشق to rotate around a point, but it turned out that it was harder than I thought and it’s something I still need to figure out.

let angle = 0; 

function setup() {
  
  
  createCanvas(1200, 1200);
  background(250, 141, 141);
  
  // let's draw ishq
}
  
//   function executeishq(){
    
//    for (let xchange = 0; xchange < width; xchange = xchange +30){
//     for (let ychange = 0; ychange < height ; ychange = ychange +30){
    
//     noStroke();
//     fill(random(100,105),random(10,55),random(25,55));
//     rotate(random(1,90));
      
//   drawishq(xchange + random (1, 100),ychange + random(1,100), random(1,5));
//     }
// }

// }


function drawishq(xpos,ypos, size){ //the xpos, ypos change the position of ishq on screen
  
  //first letter
  
  
  square(16 + xpos,20 + ypos,size,2);
  square(22 + xpos,20 + ypos,size,2);
  square(28 + xpos,20 + ypos,size,2);
  square(34 + xpos,25 + ypos,size,2);
  square(16 + xpos,26 + ypos,size,2);
  square(16 + xpos,32 + ypos,size,2);
  square(16 + xpos,38 + ypos,size,2);
  square(22 + xpos,38 + ypos,size,2);
  square(28 + xpos,38 + ypos,size,2);
  square(34 + xpos,38 + ypos,size,2);
  square(40 + xpos,38 + ypos,size,2);
  square(10 + xpos,38 + ypos,size,2);
  square(4 + xpos,38 + ypos,size,2);
  
  
  //2nd letter
  
  square(-2 + xpos,38 + ypos,size,2);
  square(-2 + xpos,32 + ypos,size,2);
  square(-8 + xpos,38 + ypos,size,2);
  square(-14 + xpos,32 + ypos,size,2);
  square(-14 + xpos,38 + ypos,size,2);
  square(-20 + xpos,38 + ypos,size,2);
  square(-26 + xpos,38 + ypos,size,2);
  square(-26 + xpos,32 + ypos,size,2);
  square(-32 + xpos,38 + ypos,size,2);
  square(-38 + xpos,38 + ypos,size,2);
  
  //dots
  
  square(-14 + xpos,14 + ypos,size,2);
  square(-20 + xpos,20 + ypos,size,2);
  square(-8 + xpos,20 + ypos,size,2);
  
  //third letter
  
   square(-44 + xpos,38 + ypos,size,2);
   square(-50 + xpos,38 + ypos,size,2);
   square(-50 + xpos,32 + ypos,size,2);
   square(-50 + xpos,26 + ypos,size,2);
   square(-50 + xpos,20 + ypos,size,2);
   square(-56 + xpos,26 + ypos,size,2);
   square(-56 + xpos,20 + ypos,size,2);
   square(-50 + xpos,44 + ypos,size,2);
   square(-50 + xpos,50 + ypos,size,2);
   square(-50 + xpos,56 + ypos,size,2);
   square(-50 + xpos,62 + ypos,size,2);
   square(-56 + xpos,62 + ypos,size,2);
  square(-62 + xpos,62 + ypos,size,2);
  square(-68 + xpos,62 + ypos,size,2);
  square(-74 + xpos,62 + ypos,size,2);
  square(-80 + xpos,62 + ypos,size,2);
  square(-86 + xpos,62 + ypos,size,2);
  square(-92 + xpos,62 + ypos,size,2);
  square(-92 + xpos,56 + ypos,size,2);
  square(-92 + xpos,50 + ypos,size,2);
  square(-92 + xpos,44 + ypos,size,2);
  
  // dots
  square(-50 + xpos,8 + ypos,size,2);
  square(-62 + xpos,8 + ypos,size,2);
  
  
  
  
}

function draw() {
  
  rotate(angle); 
  
  
  drawishq(random(0,width),random(0,height),random(1,5));
 
  angle += radians(2);
  
  if(mouseIsPressed){
    background(250, 141, 141);
  }
  

  
  print(mouseX + "," + mouseY);

}

 

Leave a Reply