Collage Generator!!! | Skillshare Projects

Katherine D.

Illustrator, Designer, Sloth Whisperer



Collage Generator!!!

Hi there!

I'm a recent illustration graduate that's trying to learn more about creative coding and interactive projects– so when I stumbled across this Skillshare class I thought it was perfect! (despite being a year or so old) In my illustration practice I do a lot of collage, so preparing and working with smaller/modular pieces in a kind of cut-and-paste way makes a lot of sense to me. Below are some renders from my project step-by-step. You can also find more on my blog, 

The Collage Generator


1 + 2

I scanned and converted 14 collage pieces using image trace in Illustrator to produce my working .svgs. Initially I just wanted to see what they would look like when randomly placed together on a canvas. Initially I tried using DrawablePool, with random placement and rotation. The results were incohesive and scattered– because the images were so detailed too many looked a mess, but too few meant the placement was even more important. I found restricting the location to the centre half of the canvas helped make positioning feel more purposefulor deliberate (despite not being so). 

Only drawback with DrawablePool (har har) is that the random choice of pieces meant that there were repeats. I could get around this by adding each shape individually, but some of the randomness is gone in that case.





Still using Drawable Pool, but introducing rotation into it, without autoClear. Some really interesting effects!






Here I started trying to pin down the location of the pieces that were being drawn– I wanted to get them rotating around the centre point, so I was experimenting with the anchorAt() and anchor( new PVector () ). I think the order in which they're called influences the outcome. But also the orientation of the .svg itself– a lot of the shapes I'm using are organic, so I think the program has a hard time finding an accurate centre point. Regardless, I kind of like what happens when they're concentric.


Please sign in or sign up to comment.