Week 3: Drawing Bauhaus Patterns

Screen Shot 2016-10-11 at 11.19.30 AM.png

This week we paired up in groups of two and used p5.js to create graphical patterns that involves both random elements and a controller that changes the performance of the piece.

We first began by testing with random lines and random colors, within a restricted canvas. In this case, the “line” function is used to create each individual line. The start point (x1,y1) and end point (x2,y2) are random values taken from within the range of canvas width and canvas height. The “stroke” function also involves random RGB value, though with a greater emphasize on blue, and allows each line drawn to have a different color.

Screen Shot 2016-10-11 at 11.07.40 AM.png

We then experimented further with the “line” function. Instead of drawing one per draw loop, we decide to draw two lines each time, and the (x1,y1) and (x2,y2) of the two lines should share some common parameters.

14502111_10210983598010141_485909198_n.png

Eventually we combined those aforementioned features, along side a scaling bar that controls the size of the “canvas”, and thus controlling the generated pattern.

https://alpha.editor.p5js.org/embed/SJmA92r6

Screen Shot 2016-10-11 at 11.19.17 AM.png

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s