Concept
Since the assignment needed us to use loop – I thought of creating a simple pattern so that I can update the x and y variables with each iteration. I created two if conditions under the loop using random(1) function. If the random() function picks a number more than 0.5, the code creates a line from the top left to bottom right. Else – it creates a line from bottom left to top right.
let x = 0; let y = 0; function drawLines(){ stroke(255); delta=10; stroke(random(255),random(255),random(255)); strokeWeight(5); if(random(1)>0.5){ line(x,y,x+10,y+delta); } else{ line(x,y+delta,x+delta,y); } x = x+delta; if(x>width){ x=0; y=y+delta; } if(y>height/2){ delta = 0; } }
Since there is simple probability at play here – it created a maze-like pattern. I simply added colour to it. Furthermore, I wrote another function which uses the same algorithm, but from bottom right corner and it works its way up – to add a little more life to it.
Reflections
This was relatively simple yet fun to make. I would, however, have liked to add some element of interactivity. Possibly something that affects colours and speed based on the movement of mouse. I tried incorporating other visuals after this pattern finishes – but faced some issues. I would definitely love to incorporate that in this sketch.
Simple but effective! Please add more comments in your code.