I <3 SVG | Skillshare Projects

I <3 SVG

As a computer science student, my interest in this class has been in experimenting creatively, while exercising my technical skills.  Although Processing and the HYPE framework are great tools, I opted to work in the browser with Snap.svg so that my work can later be served live on my personal website.

The code for the experiments in this class can be found at https://github.com/Oneman2feet/generated-art

I started out by making a simple triangle onscreen and tested how I could change its color, size, rotation, and position.  From there I tried making a large number of triangles, all with random values for each of these parameters.  I kept the hue of all triangles the same, and vaired the saturation instead.

This looked okay, and seved as a good test of drawing things onscreen and manipulating them.

I then moved on to importing my own SVG assets to manipulate, rather than hard-coding the shapes used (like the triangles above).  I spent some time looking for inspiration, trying to find something relatively simple to start with that also excited me.  After a while, I stumbled upon the idea of using mayan glyphs as my assets.  I found a great image with clear line drawings of several glyphs.

I then got to work tracing a couple of them in Inkscape, and ended up with two SVG files to use as my assets.

For now I've just gotten the SVGs loaded and randomly assigned each group a fill color.  It looks pretty snazzy and my next hope is to figure out how Joshua does some of his more advanced generative works, such as the ones that look like a kaleidoscope made out of the assets.  I realize he may not want to reveal any trade secrets, but it'd be great to see a walkthrough of how he made some of his more complicated pieces.


Please sign in or sign up to comment.