Week 2 Assignment_Loops

My concept

This week after learning about loops, for my design I wanted to explore how I could use different shapes and in some way combine or merge them to create different patterns.

For this assignment I created two designs after experimenting the use of loops and shapes. The first one as shown below is composed of a “for ()” loop including two sets of  lines and two sets of ellipses. As shown in the second design, the first layer is a set of lines underneath one set of ellipses which produce a pattern that matches that of scales such of a fish. After this, I explored the use of a second layer of ellipses with a different size for the height and width, thus creating a pattern as shown in the first design.

Highlight code

One of the codes I was most proud of were the loops I used to make the scales. These consisted of lines that followed the code we did in class, but with a slight change in the width, height and their size. The second code was for the scales themselves, consisting of ellipses placed on top of the lines.

 

/// green lines
   stroke(200,200,200);
  for(let x = 0; x <= width; x += 60){
    for(let y = 0; y <= height; y += 60){    
     line(x, y, x+75, y+75);  
      fill( 235, 0, 255);
    }
  }
  
  
  /// Scales
  for(let x = 0; x <= width; x += 30){
    for(let y = 0; y <= height; y += 30){    
     ellipse( x, y, 50, 50);  
      fill( 225, 100, 230);
    }
  }

 

Embedded sketch

 

Reflection and ideas for future work or improvements

One of the things I struggled the most with was getting the loop code right for the lines. At first, I thought it would be the same as we did for the ellipses, however, after testing it out I realized this did not work. Nonetheless, after discussing my situation with the professor, I was able to understand my mistake, and how the code for the lines was different when it came to the variables after the (x, y,), which, unlike the code for the ellipse, required a plus sign to adapt an accurate width and height, resulting in this:

line (x, y, x + 75, y + 75);

For my next project, I will look at more tutorials beforehand to have more preparation and to have a better understanding of the codes I will be using in order to have a more precise result. I will also produce multiple sketches of what I want my final product to be so I can aim towards a specific design in case I don’t have the time to explore different outcomes. Lastly, I would also love to add more animations and movement to my sketches.