design challenge

Use a grid system in Rune.js to create a book cover

the design plan

I wanted to create the book cover for Dogs and Demons: The Fall of Modern Japan, a book that changed my understanding and perception of a sentiment I had for Japan. Author Alex Kerr, identifies, clarifies and gets to the heart of this feeling as he brings the post-war Japan’s modernization under the microscope.

 

 

In the midst of modernizing and plowing through its industrial revolution, Japan slowly began to blanket land and hills in cement. As one major aspect that Kerr touches on, I wanted to bring this to life on the cover of the book. The center of the Japanese flag, fallen, with a cement mixer casing it in.

the code

The only generative part of the code is the cement, which changes slightly with each refresh.

Access the sketch here.

challenges

How does one find the x,y of the bottom of a curveTo point?
In trying to draw the cement mixer, I began to make this as one path. However, as visible in the image on the left, the area on the outside would not fill. So I decided to draw a second path to make the right side fill in. This left me with the lingering questions of:
1) How can you find the x,y of the curveTo point?
2) How can one trace a path?

 

 

 

 

 

 

 

 

 

 

Hierarchy of Modules
In a grid system of 2 x 3, there seems to be a hierarchy of which module on top versus bottom. The 1, 1 module is the furthest back, and the 2, 3 module is the up front. If the goal was for something in a middle module to spill into a lower module, how can one manipulate the hierarchy?

 

 

 

 

 

 

 

 

 

 

How to move a path to polygon to polys object to the grid
I tried many ways to place this on the grid using grid.add and move, from the path to the polygon version to the polys version. However, none of it worked. In order to get the “Dogs and Demons” title in the grid, I did a work-around where I used the global variables to line it up with the parent object.