I’m a big fan of GIFs as a format, and I wanted to try and make some kind of moving portrait inspired by this collection of generative portraits. I thought they looked cool, but I wasn’t sure exactly how they went about making it. In the end, I used p5js, as I originally wanted to make a web tool where you could upload any image and it would be filtered.

Rough pseudocode:
– Pick X number of random points on the image
– If they are close then make a line between them
– For each line:
– Using the original image, get the avg color of the pixels across the line
– On a new blank canvas, draw the line using the avg color
– Save image + repeat for each frame

The script is a bit slow, and takes a second or two to render each frame. It could be cool to re-write it as a shader in the future and see if it’s possible to render the filter in real-time. Some kind of face-tracking could be cool, but I’m not sure how to do that.
Leave a comment