creatyde-Interruptions

Here is my exploration of Vera Molnar’s intriguing work:

 

Observations:

  1. Background is white and square.
  2. Lines are black, short (about 1/30 the height of square), of the same width.
  3. The lines are at different angles in a random sort of way.
  4. There are some holes within the piece, where fewer lines reside.
  5. There is an interesting grid-like structure to the piece, as if the lines all center at the points of some grid, roughly 60 spaces wide in both directions.
  6. The lines are longer than the grid-space, being that they are able to intersect each other, at most halfway.  This suggests the length of the line is about half the number of grid-spaces.
  7. Holes are roughly square or circular.  They are usually infrequent, and when they appear, it is usually closer together.  Some are quite large.
  8. There is a general trend of most lines pointing up.  This occurs for three out of the four shown images.  In one, the lines are mostly horizontal.  It appears the artist biased the lines to prefer one direction.
  9. The width of the line is less than about 1/10 the length.
  10. Around the main piece, there is a border, roughly 2-3 grid-spaces wide.

 
I would like to start off by saying that this was not easy to do at all. The images may look simple, but in the process of trying to code them, I realize how much Vera Molnar must have thought about her work in order to make it feel as sublime as possible. The hardest part was trying to make the holes look interesting. The first approach I tried was using random ellipses as holes…but doing it like so didn’t capture the alien, box-like quality of Molnar’s holes. Then I thought, what if the lines “talked” to each other? So some “creative” lines go rogue, and they convince others to follow. So I made a few rogue lines, and after several iterations of “conversation,” some of the lines went over to the dark side. I think doing it the second way produced results more akin to Molnar’s work.

You can take a look at my code below:

var canvasSize = 720;
var gridSize = 60; // # of rows/cols
var border = 2;
var lineLength = 1.75;

function getLine(x, y, theta, length) {
    var xLen = cos(theta) * length/2;
    var yLen = sin(theta) * length/2;
    return [x - xLen, y - yLen, x + xLen, y + yLen];
}

// make array that determines if gridpoint exists
function existArray(prob, iter) {
    var existsArr = new Array();
    for (var i = 0; i < gridSize; i++) {
        existsArr[i] = new Array();
        for (var j = 0; j < gridSize; j++) { existsArr[i][j] = 0; // initialize probability if (random(0, 1) > prob) {
                existsArr[i][j] = 1;
            }
        }
    }

    for (var it = 0; it < iter; it++) {
        for (var i = 0; i < gridSize; i++) {
            for (var j = 0; j < gridSize; j++) { var sum = 0; if (i - 1 > 0 && existsArr[i-1][j] == 1)
                    sum++;
                if (i + 1 < gridSize && existsArr[i+1][j] == 1) sum++; if (j - 1 > 0 && existsArr[i][j-1] == 1)
                    sum++;
                if (j + 1 < gridSize && existsArr[i][j+1] == 1) sum++; if (random(0, sum) > 1) existsArr[i][j] = 1;
            }
        }
    }

    return existsArr;
}

function click() {
    background('white'); // reset
    var gridSpace = canvasSize/(2*border+gridSize);
    var length = lineLength * gridSpace;
    var maxIter = random(0, 20);
    var existsArr = existArray(0.96, maxIter);

    var x = border * gridSpace + gridSpace/2;
    var y = border * gridSpace + gridSpace/2;
    for (var i = 0; i < gridSize; i++) {
        var y = border * gridSpace + gridSpace/2;
        for (var j = 0; j < gridSize; j++) {
            var theta = (random(0, PI) + random(0, PI/3))/2;
            var lineEnds = getLine(x, y, theta, length); 

            if (existsArr[i][j] == 0)
                line(lineEnds[0], lineEnds[1], lineEnds[2], lineEnds[3]);
            y += gridSpace;
        }
        x += gridSpace;
    }
    
}

function setup() {
    createCanvas(canvasSize, canvasSize);
    background('white');
    stroke('black');
    strokeWeight(1);
}

function draw() {
    if (mouseIsPressed) click();
}