Generative Design Variations M.3.1 Creating a grid

Creating a grid is not a spectacular job but it is very helpful to design things which have to look functional. I use grids all the time. So this example should be familiar to me. The Generative Design book explains it a follows: ‘Before a three-dimensional object can be created, we need a grid of points in a two-dimensional plane to be ‘bent’ to form closed areas. The easiest way to do this is to arrange the points in a regular grid. The first step is to find the most flexible way to draw such a grid. Processing enables tiles to be drawn with QUAD_STRIP or TRIANGLE_STRIP. This is a reasonable choice since the grid points should be individually movable later on.’ You can find the original program here:

All the images I have made during this assignment I gathered in a Flickr album. And (some) JavaScript and code can be found on my loftmatic page.

When I first ran the program I got a totally different image than the attached pict-file in the programs folder showed me. Lines were extremely thick. So I checked if there was a strokeWeight involved. And that was not the case. Then I checked if there was something wrong with the QUAD_STRIP parameters. But everything seemed to be fine. I checked the next program (M.3.2). And it had the same extremely thick lines in it. But here there was a strokeWeight involved. So I changed the strokeWeight to 0.01 pixels. And than it seemed ok. So back to M.3.1 I added a strokeWeight of 0.01 pixels too. Changed the global variable names for readability and understanding purposes. Switched the background to black and the lines to white. Added functionality to the s-key for making screen grabs. Started with a .png. But the image quality was poor. Imported Marius Watz ImageTiler. But the image was still not very good. I think that saving as a pdf might help. It helps but it does not render the background black. So I have to restore everything in Photoshop. TileSaver works. Pdf doesn’t. After cranking up the horizontal and vertical tiles to 20 pdf gives me am indexoutofboundserror. So .pdf is no option. Continued with the TileSaver class.

The origin is now in the middle of the display window. That is where the coördinate system begins. It evolves down and to the right. But I find it a difficult to handle the grid. It is connected to the top left of the grid-mesh. So I copied the existing for loop with a translation to the left and with the same amount of horizontal and vertical tiles.

I have now 4 grids of 40 x 40. To make that clear I added 1 grid-unit in between.

I could make the 4 grids of a different size. And put them together as if it was one object. I have to apologize for the terrible image quality JavaScript delivers. In Processing it looks better.

JavaScript stopped working after the previous file. From now on you only see the Processing code in the links. And because I can now fill the grids in as if it were 4 different grids I have the idea to make different objects that use the grid as a base. Very simple object of course. I have drawn 16 variations of this system on paper. Would it be possible to import those light settings from M_2_4 again? That sure is possible. It is now just a matter of making those variations. And maybe I find any new ideas during that work. For the rest of the programs go to my loftmatic page. And click on the previews for the Processing code.

I found some more ideas. But I think it is better to continue to the next example instead of making more variations on the grid theme.


Comments? Leave a reply.

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

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

Google photo

You are commenting using your Google 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 )

Connecting to %s