Generative Isometric Generations

I started back into messing with P5.js this week, this time working on trying to translate what I’ve been working on by hand in Illustrator to a generative form.

I found the hardest thing for me to get my head around was how to work out the math to make the basic isometric cube. I ended up using Illustrator to help me figure out the dimensions. From the grid I already created for my Deadly Towers I started to create I was able to figure out the spacing of the vectors to create the three parallelograms needed for the cube shape. I took the x & y from A-G to create each shape.

The first step was to try and render the cube and stretch it in the cardinal directions.

After working on it a bit more I tried to get the ends of the shapes to “connect”, then if the path ever hits the margin of the canvas then start a new path. These started to look like veins or a nervous system to me.

Here’s the code if you want to check it out.