Art from Code: Modulated Synthesis

My attitude towards this assignment was radically different from my attitude towards the previous assignment. I was inspired by our classroom experiments in combining both for-loops and the mod function. I was also inspired by Josef Albers’ usage of colors and tiling to make a statement about both shape and color. The for-loop and mod functions lend themselves to accomplishing something similar to Albers’ goals.

sample of Albers' work

I spent several hours just experimenting with different shapes, colors, and insertions of randomness and determination in my code. At first I had a background with ellipses that moved within columns, remained similar colors, and seemed to shimmer (due to the addition of an overlay of darker ellipses floating through the screen.) This really reminded me of my childhood bedroom, which had a beaded curtain over the doorway and a shimmer curtain by the window. It seemed like I had created a synthesis of the two.

Screen Shot 2017-10-26 at 12.08.07 AM
first experiments

I decided to experiment with the circular motion assignments we were given in class, while still utilizing the color scheme and grid concepts I had established in my first sketch. This way, I was able to get a band of ellipses radiating in a circular way from a central foci. And I was even able to control the color of the ellipses, depending on where in the grid they were falling into.

Screen Shot 2017-10-29 at 6.56.56 PM
adding a JS object that utilizes circular motion

I realized that where the horizontal bands and vertical bands intersected, I got an unpredictably cool pattern, so I decided to have the bands overlap uniformly. While doing this, I realized I could modify the color (again, using mod, hence producing a gradient.) The circular_circles object remained in this iteration of the code, but I realized that it was aesthetically unpleasant to have 2 radically different shapes (ellipses and rects) overlap in an non-meaningful way.

Screen Shot 2017-10-29 at 7.06.40 PM
inserting a tiled background

So, for the moment, I forwent the inclusion of the circular-circles and instead played with the tiling background more. I added another function to my tile constructor, that allowed the gradient itself to change over time. And, through experimentation, I was able to have it so that the manner in which the gradient changed mimicked tiling itself. The picture below demonstrates multiple quadrants of graduated tiling. At this point in the process, I thought my work resembled a bit of Mondrian’s work, because of the juxtaposition of differently-colored ’tiles’. It especially resembled the work of other students’ in the class after they completed the animated Mondrian assignment. Screen Shot 2017-10-31 at 12.18.10 AMAt this point, the fact that the assignment encourages using a JS object that has a parameter passed through it, I decided to abstract even the size of the tiles. Below is an image showing the result of modifying the size of the tiles. At this point, the repetitive element determined by the dark-purple background is completely omitted, which has its own implications. I think this is beautiful and smooth in its own right; but I did appreciate the repetitive nature of the purple color, as it gives the entire wallpaper its own sense of continuity.

changing the size of the tiles
changing the size of the tiles after adding changing colors to the tiles

Since I was not so pleased with this outcome, I decided to re-introduce the circular motion aspect into the tiles I decided I had liked, except instead of using ellipses, I used rectangles (as this would better fit with the current scheme.) This is my final product for now, but I could definitely use revisions. And with better understanding of coding, I could do a lot more.

final product for now
current “final”
Author: Shreeda Segan