{"id":359,"date":"2021-09-07T20:47:48","date_gmt":"2021-09-08T00:47:48","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/?p=359"},"modified":"2021-09-07T20:47:48","modified_gmt":"2021-09-08T00:47:48","slug":"grape-molnarrecode","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/grape\/09\/07\/grape-molnarrecode\/","title":{"rendered":"grape &#8211; MolnarRecode"},"content":{"rendered":"<p><a href=\"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/paul-klee-molnar-1.svg\"><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-361\" src=\"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/paul-klee-molnar-1.svg\" alt=\"\" width=\"640\" height=\"480\" \/><\/a><\/p>\n<p>Closeup:<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\"alignnone size-medium wp-image-362\" src=\"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-479x480.png\" alt=\"\" width=\"479\" height=\"480\" srcset=\"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-479x480.png 479w, https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-1022x1024.png 1022w, https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-150x150.png 150w, https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-768x769.png 768w, https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM-1200x1202.png 1200w, https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-content\/uploads\/2021\/09\/Screen-Shot-2021-09-07-at-8.32.46-PM.png 1218w\" sizes=\"(max-width: 479px) 85vw, 479px\" \/><\/p>\n<p>My observations:<\/p>\n<ol class=\"ol1\">\n<li class=\"li1\">The painting is 68 x 68 grid of square cubes.<\/li>\n<li class=\"li1\">There are three-four tiers of line drawings, one that spans the 68&#215;68 grid, and one that spans the 34&#215;34 grid, drawing over the grid of smaller cubes<\/li>\n<li class=\"li1\">There are at most three types of lines on any square in the grid<\/li>\n<li class=\"li1\">One \u201clining\u201d either occupies a 1&#215;1, 2&#215;1, 1&#215;2, 1&#215;3 or 2&#215;2 rectangle<\/li>\n<li class=\"li1\">the 1&#215;1 cubes are a line from one corner to the center of the square<\/li>\n<li class=\"li1\">1&#215;3 rectangles can be one of two patterns. The first of which is composed of two identical 1&#215;1 squares, the left of which has (up to) 4 lines from the top-most side which connect halfway up the adjacent right side of the square. There is also probability of the presence or absence of a single 1\/2 length line on the right side. The right square diagonally mirrors the pattern of the left square. Between these identical squares is a 1&#215;1 square which, (for the half to the left of the diagonal) depending on the n number of lines used in the left and right squares maps n equidistant lines from the bottom 1\/2 of the square to the to the top of the square, giving<span class=\"Apple-converted-space\">\u00a0 <\/span>a tilted appearance. The lines in the middle square are always diagonal lines reaching from the bottom left corner to the upper right. The second pattern is composed of an obtuse triangle, whose obtuse angle is located in between the middle and rightmost square. the shortest side is along a diagonal on the rightmost square while the longest side connects the bottom left corner of the leftmost square with the top right corner of the rightmost square. There are lines running parallel to the longest leg varying from 1 to 10 (i think\u2026but it\u2019s blurry) that exclude the diagonal.<\/li>\n<li class=\"li1\">2&#215;1 and 1&#215;2 rectangles can be parallel lines that take up the entire rectangle, parallel lines that take up a right triangle\/diagonal half of the rectangle, or only an isosceles triangle amount of the rectangle (where the single side of non equal length is 2) and can vary in number of lines from 1 to 12, though some of these 1&#215;2 or 2&#215;1 rectangles are left blank.<\/li>\n<li class=\"li1\">Similar to rule 7, 2&#215;2 rectangles are either parallel lines that take up the entire rectangle or parallel lines that take up a diagonal half of the rectangle, with lines that vary from 1 to 11. 2&#215;2 rectangles that cover the entire rectangle are completely unobstructed(or at least have a lower probability of being covered up) &#8211; they don\u2019t have additional lines over top (other than probability for larger stroke weight for the middle diagonal line), but 2&#215;2 rectangles that only cover a diagonal half can have additional lines.<\/li>\n<li class=\"li1\">To keep in line with the previous rules regarding pattern size, I amend my first observation; the piece is actually 68&#215;70 squares, but the leftmost and rightmost columns have been cut out, such that there appears to be two 68&#215;1 patterns on the edge. There is no such rule for the top and bottom rows, and 2&#215;2 and 1&#215;2 square patterns can be seen in its entirety on the top and bottom rows (excluding the leftmost and rightmost entries)<\/li>\n<li class=\"li1\">Some of the diagonals through 2&#215;1, 1&#215;2, and 2&#215;2 regions look thicker, indicating a possible fifth tier to add in a larger stroke weight\u2026and there\u2019s no white border.<\/li>\n<\/ol>\n<p>Code:<\/p>\n<p>Overall this experience was pretty annoying because there were so many different types of shapes. Also, even though I had counted the number of lines per shape in the original work, I inevitably had to scale down the number of lines in each shape because they blended together in the resulting svg (e.g. 12 lines down to 7). I think the components are similar to Molnar&#8217;s work but I just gave up tweaking the probabilities to make it super accurate. I spent 5 ish hours (which is way too long) on this assignment because I was too obsessed with getting all the shapes. smh.<\/p>\n<pre><code>\r\nimport processing.svg.*;\r\n\r\nint dim = 768;\r\nint xCells = 36;\r\nint yCells = 35;\r\n\/\/ dimension of a single 1x1 square\r\nfloat sDim = dim\/(34 * 2);\r\nint[] square;\r\n\r\nvoid settings() {\r\n  size(dim, dim);\r\n}\r\n\r\nvoid setup() {\r\n  square = new int[5];\r\n  noLoop(); \/\/ Just execute once!\r\n}\r\n\r\nvoid draw() {\r\n  background(255);\r\n  beginRecord(SVG, \"paul-klee-molnar.svg\");\r\n\r\n  stroke(0);\r\n  noFill(); \/\/ Don't create duplicate shapes!\r\n  for (int row =0; row&lt;xCells; row++) {\r\n    for (int col =0; col&lt;yCells; col++) {\r\n      float section = random(1.0);\r\n      if(section&lt;0.2){ \/\/zero items\r\n         \/\/ do nothing\r\n      }else if(section &lt;0.2){ \/\/ one item\r\n        drawRand(row, col, 1);\r\n      }else if(section &lt; 0.8){ \/\/ two items drawRand(row, col, 2); }else{ \/\/ three items drawRand(row, col, 3); } if(random(1,0)&gt;0.5){\r\n        if(random(1.0) &lt; 0.5){\r\n          drawDiag(1, row, col,1,2,int(random(0, 2)));\r\n        }else{\r\n          drawDiag(1, row, col,2,int(random(1,3)),int(random(0, 2)));\r\n        }\r\n      }\r\n    }\r\n  }\r\n  endRecord();\r\n}\r\n\r\n\r\nvoid drawUniqueDiag(int posX, int posY, int items){\r\n  int x = int(random(1, 3));\r\n  float bias = 0.4;\r\n  if(items ==1) bias = 0.0;\r\n  if(random(1.0)&lt; 0.33){\r\n    int dir = int(random(0, 2));\r\n    if(square[dir] ==0){\r\n      drawDiag(int(random(1, 9)), posX, posY, 1, 2, dir);\r\n      square[dir] = 1;\r\n    }else drawUniqueDiag(posX,posY,items);\r\n  }else {\r\n    if((random(1.0) + bias) &lt; 0.5){\r\n      drawDiag(int(random(1, 9)), posX, posY, 2, 2, int(random(0, 2)));\r\n    }else{\r\n      int dir = int(random(2, 4));\r\n      if(square[dir] ==0){\r\n        drawDiag(int(random(1, 9)), posX, posY, 2, 1, dir-2);\r\n        square[dir] = 1;\r\n      }else drawUniqueDiag(posX,posY,items);\r\n    }\r\n  }\r\n}\r\n\r\n\r\nvoid drawRand(int posX, int posY, int items){\r\n  for(int i = 0; i&lt;5; i++){\r\n    square[i] = 0;\r\n  }\r\n  for(int i = 0; i&lt;items;i++){\r\n    float shape = random(1.0);\r\n    if(shape&lt;0.04){ \/\/Obtuse Triangle\r\n      drawObtuse(posX, posY, int(random(1,6)));\r\n    }else if(shape &lt;0.08){ \/\/ Fan Thingy\r\n      drawFan(posX, posY, int(random(1,4)));\r\n    }else if(shape &lt; 0.75){ \/\/ Diagonal, Half &amp; Full \r\n      drawUniqueDiag(posX, posY, items);\r\n    }else if(shape &lt; 0.96){ \/\/ Isoceles Triangle\r\n      drawTriangle(posX, posY, int(random(1, 7)));\r\n    }else{ \/\/ Chord\r\n      drawChord(posX,posY);\r\n    }\r\n  }\r\n}\r\n\r\n\r\nvoid drawLine(float posXa, float posYa, float posXb, float posYb) {\r\n  \/\/ assert that posXa &lt; posXb\r\n  float xa = posXa - sDim;\r\n  float ya = posYa;\r\n  float xb = posXb - sDim;\r\n  float yb = posYb;\r\n  if(xb &lt; 0 || xa &gt;= width){\r\n    \/\/do nothing\r\n  }else{\r\n    if(xa &lt; 0){ float slope = (posYb-posYa)\/(posXb-posXa); ya = ya + slope*(-xa); xa = 0; } if(xb &gt; width){\r\n      float slope = (posYb-posYa)\/(posXb-posXa);\r\n      yb = yb - slope*(xb-width);\r\n      xb = width;\r\n    }\r\n    line(xa,ya,xb,yb);\r\n  }\r\n}\r\n\r\n\r\nvoid drawDiag(int numLines, int posX, int posY, int w, int h, int quad) {\r\n  \/* draws diagonal lines for some contraints hxw box\r\n   *\r\n   * numLines are the max number of lines touching a side of the rect\r\n   * posX and poxY indicate square in grid\r\n   *\/\r\n  float wDist = sDim * w;\r\n  float hDist = sDim * h;\r\n  float wInc = wDist\/numLines;\r\n  float hInc = hDist\/numLines;\r\n  float baseX = posX*sDim*2;\r\n  float baseY = posY*sDim*2;\r\n  if(h == 1 &amp;&amp; quad==1) baseY = baseY + sDim;\r\n  if(w == 1 &amp;&amp; quad==1) baseX = baseX + sDim;\r\n  \/\/ if dir ==1, then diag goes from bottom left to top right\r\n  boolean dir = boolean(int(random(0, 2)));\r\n  int shape = int(random(0,3));\r\n  if (dir) { \/\/ bottom left to top right\r\n    for (int i=0; i&lt;numLines; i++) {\r\n      if(shape == 0){\r\n        \/\/ bottom triangle\r\n        drawLine(baseX+(i*wInc), baseY+hDist, baseX+wDist, baseY + (i*hInc));\r\n      }else if(shape ==1){\r\n        \/\/ top triangle\r\n        drawLine(baseX, baseY+((i+1)*hInc), baseX+((i+1)*wInc), baseY);\r\n      }else{\r\n        \/\/ bottom triangle\r\n        drawLine(baseX+(i*wInc), baseY+hDist, baseX+wDist, baseY + (i*hInc));\r\n        \/\/ top triangle\r\n        drawLine(baseX, baseY+((i+1)*hInc), baseX+((i+1)*wInc), baseY);\r\n      }\r\n      \r\n    }\r\n  } else { \/\/ top left to bottom right\r\n    for (int i=0; i&lt;numLines; i++) {\r\n      if(shape ==0){\r\n        \/\/ top triangle\r\n        drawLine(baseX+(i*wInc), baseY, baseX + wDist, baseY + (hDist - (i*hInc)));\r\n      }else if(shape ==1){\r\n        \/\/ bottom triangle\r\n        drawLine(baseX, baseY + (i*hInc), baseX+(wDist - (i*wInc)), baseY + hDist);\r\n      }else{\r\n        \/\/ top triangle\r\n        drawLine(baseX+(i*wInc), baseY, baseX + wDist, baseY + (hDist - (i*hInc)));\r\n        \/\/ bottom triangle\r\n        drawLine(baseX, baseY + (i*hInc), baseX+(wDist - (i*wInc)), baseY + hDist);\r\n      }  \r\n    }\r\n  }\r\n}\r\n\r\n\r\nvoid drawObtuse(int posX, int posY, int numLines) {\r\n  int divider = numLines+1;\r\n  float wInc = (sDim * 2)\/divider;\r\n  float hInc = sDim\/divider;\r\n  float baseX = posX*sDim*2;\r\n  float baseY = posY*sDim*2;\r\n  for (int i = 1; i &lt;= numLines; i++) {\r\n    drawLine(baseX + (wInc*i), baseY + (sDim*2), baseX+(sDim * 3) - (hInc*i), baseY + sDim + (hInc*i));\r\n  }\r\n}\r\n\r\n\r\nvoid drawFan(int posX, int posY, int numLines) {\r\n  int divider = numLines+1;\r\n  float horizSpace = sDim\/divider;\r\n  float vertSpace = horizSpace\/2;\r\n  float baseX = posX*sDim*2;\r\n  float baseY = posY*sDim*2;\r\n  \/\/ terrible code, but I have to separate the three components to satisfy the assert in drawLine\r\n  for (int i = 1; i &lt;= numLines; i++) {\r\n    drawLine(baseX + (horizSpace * i), baseY, baseX + sDim, baseY + (vertSpace * i));\r\n    drawLine(baseX + (2*sDim), baseY + sDim - (i * vertSpace), baseX + (3*sDim) - (i* horizSpace), baseY + sDim);\r\n  }\r\n  for (int i = 1; i&lt;=numLines; i++) {\r\n    drawLine(baseX+sDim, baseY + (sDim\/2) + (i*vertSpace), baseX + sDim + (i*horizSpace), baseY);\r\n    drawLine(baseX + sDim + (i*horizSpace), baseY + sDim, baseX + (2* sDim), baseY + (i*vertSpace));\r\n  }\r\n  \/\/ diagonal\r\n  drawLine(baseX + sDim, baseY + sDim, baseX + (2*sDim), baseY);\r\n  if (int(random(0, 2)) &lt; 1) {\r\n    drawLine(baseX + sDim, baseY, baseX + sDim, baseY+(sDim\/2));\r\n    drawLine(baseX + (2*sDim), baseY + (sDim\/2), baseX + (2*sDim), baseY + sDim);\r\n  }\r\n}\r\n\r\n\r\nvoid drawChord(int posX, int posY){\r\n  float baseX = posX*sDim*2;\r\n  float baseY = posY*sDim*2;\r\n  if(random(1.0)&lt;0.5){\r\n    drawLine(baseX, baseY + sDim, baseX+(sDim\/2), baseY + ((sDim*3)\/2));\r\n  }else{\r\n    drawLine(baseX+ ((sDim*3)\/2), baseY + ((sDim*3)\/2), baseX+(2*sDim), baseY + sDim);\r\n  }\r\n}\r\n\r\n\r\nvoid drawTriangle(int posX, int posY, int numLines) {\r\n  int divider = numLines + 1;\r\n  float hInc = (sDim*2)\/divider; \/\/ hypotenuse, over length 2*sdim\r\n  float dInc = sDim\/divider; \/\/ shorter legs that rest on the diagonal of the grid\r\n  float baseX = posX*sDim*2;\r\n  float baseY = posY*sDim*2;\r\n  int position = int(random(0, 4));\r\n  if (position==0) { \/\/up down triangles\r\n    int dir = int(random(0, 2));\r\n    for (int i = 1; i &lt;= numLines; i++) {\/\/ 0 top, 1 bottom\r\n      float ax = i*hInc;\r\n      float ay = dir*2*sDim;\r\n      float bx = sDim + (i*dInc);\r\n      float by = sDim + (((2*dir)-1)*dInc*i);\r\n      drawLine(baseX + ax, baseY + ay, baseX + bx, baseY + by);\r\n    }\r\n  } else if (position==1) { \/\/up down triangles\r\n    int dir = int(random(0, 2));\r\n    for (int i = 1; i &lt;= numLines; i++) {\/\/ 0 top, 1 bottom\r\n      float ax = i*dInc;\r\n      float ay = sDim + ((2*dir)-1)*(sDim -(dInc*i));\r\n      float bx = i*hInc;\r\n      float by = dir*2*sDim;\r\n      drawLine(baseX + ax, baseY +ay, baseX + bx, baseY + by);\r\n    }\r\n  } else if (position==2) { \/\/left right triangles\r\n    int dir = int(random(0, 2));\r\n    for (int i = 1; i &lt;= numLines; i++) { \/\/ 0 left, 1 right\r\n      float ax = dir * (sDim + (i*dInc));\r\n      float ay = (-dir+1)*i*hInc + dir*(sDim+(i*dInc));\r\n      float bx = (-dir+1)*(sDim - (i*dInc)) + dir*2*sDim;\r\n      float by = (-dir+1)*(sDim + (i*dInc)) + dir*i*hInc;\r\n      drawLine(baseX + ax, baseY + ay, baseX + bx, baseY + by);\r\n    }\r\n  } else { \/\/ left right triangles\r\n    int dir = int(random(0, 2));\r\n    for (int i = 1; i &lt;= numLines; i++) { \/\/ 0 left, 1 right\r\n      float ax = dir*(sDim + (i*dInc));\r\n      float ay = (-dir+1)*i*hInc + (dir*(sDim+(i*dInc)));\r\n      float bx = (-dir+1)*i*dInc + dir*2*sDim;\r\n      float by = (-dir+1)*i*dInc + dir*i*hInc;\r\n      drawLine(baseX + ax, baseY + ay, baseX + bx, baseY + by);\r\n    }\r\n  }\r\n}\r\n<\/code><\/pre>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Closeup: My observations: The painting is 68 x 68 grid of square cubes. There are three-four tiers of line drawings, one that spans the 68&#215;68 grid, and one that spans the 34&#215;34 grid, drawing over the grid of smaller cubes There are at most three types of lines on any square in the grid One &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/grape\/09\/07\/grape-molnarrecode\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;grape &#8211; MolnarRecode&#8221;<\/span><\/a><\/p>\n","protected":false},"author":17,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[5],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/posts\/359"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/users\/17"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/comments?post=359"}],"version-history":[{"count":1,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/posts\/359\/revisions"}],"predecessor-version":[{"id":363,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/posts\/359\/revisions\/363"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/media?parent=359"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/categories?post=359"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/60-428\/f2021\/wp-json\/wp\/v2\/tags?post=359"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}