Simulating Water Colour Paint in P5js

I've attempted to simulate a water colour effect a few times, but could never get anything too convincing. So when I stumbled upon Tyler Hobbs' video explaining his method I knew I had to give it another go. In this video I walk through how I've implemented a version of Hobbs' algorithm in P5js.

I highly encourage you to check out Hobbs' video (linked above) as he does an excellent job of explaining how it all works!

Follow me:

Chapters:
0:00 Intro
0:40 Simple explanation
1:03 P5 setup and draw
2:24 Polygon constructor
4:11 Polygon grow function
8:31 Drawing the polygons
10:56 The rand() function
11:12 Outro

#creativecoding #p5js #javascript

[BarneyCodes]

Just a note: The vertices for the polygon have to be specified in a clockwise direction around the outside of the shape. This is because of the way I "push" new vertices out and spread them inside the grow() function.

[liamkoehler]

Really interesting video! I enjoyed playing around with the code afterwards. Disabling the `noStroke` call was a nice visualization actually!

[vincentcleaver]

I need to try this for my land and sea tiles in my world mapper!