Making 2D art in Javascript !

With p5.js and Joy Division

Keno Leon
8 min readJul 18, 2023

--

The other day I was in need of a simple javascript library to programmatically make lines and grids, halfway through that project I realized maybe I had enough know how to make a digital art project I’ve had in mind for a while, one that is 100% inspired by Joy Divisions Unknown pleasures album cover ( This one 👇 ) :

My” unoriginal idea was to simply feed an algorithm images and convert them to the above style somehow ( with magic ? ), and yes there’s other projects out there that do this, in fact the style of graphic is called “Joy Plots” or Ridge Line plots and you can find examples here, here, and more accurately here the issue though is that these examples are mostly made by statistical libraries and might not be great case studies if you want to make 2D art and have some web/javascript experience, which will be the focus here, so let’s get started.

— — — — — — — — — — — ⭐️ SUBSCRIBE TO MEDIUM ! ⭐️ — — — — — — — — — — —

In the beginning there were lines

I original started experimenting with a library called paper.js but quickly hit a wall with the API…

--

--