brightness_high brightness_low

Cartoon cloud

tl;dr

Click or tap to generate an infinite stream of cartoony clouds!

The story behind the code

Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. There are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning and prototyping.

From Processing.org
Most of the projects on this website have been written with the p5.js library, which is (roughly) the JS port of Processing (written in Java). Now let's rewind to 2017. The first Processing Community Day, a sort of conference for Processing users, was cloud themed. As processing is primarily used by digital artists, the organizers reached out to the community for code snippets that generate clouds which would be used as name tags.
I don't know quite why, but I really wanted to generate cartoony clouds. I'm quite happy with the result and all it took was
  • Bézier curves to get the nice looking arcs
  • Drawing with a bit of transparency
  • Tracing the cloud multiple times with slight perturbations
You can check out all the other submitted clouds here.