CP2: Built-in Filters with p5.js – Image Filters
p5.js comes with some pre-built filters that change the pixels onscreen, ranging from converting a color image to grayscale to smooth blurring. The filters can be used for artistic effect on their own (though, like the filters in Photoshop, they tend to look a bit cheesy and pre-made) but are better used to prepare images for further processing.
Later, we'll implement a few of these ourselves. We'll also see some of these filters used in computer vision to prepare images for object detection. This is also a crucial step in machine learning to make training and feature extraction easier.
ORDER MATTERS!
Like signal processing in audio, the order in which we apply filters matters. If we first blur, then threshold, we'll get a very different result than in the opposite order. Thinking about how you apply the filters (or at least trying things and see what happens) will be important to get the best results.
👩💻 https://editor.p5js.org/jeffThompson/...
ALL THE VIDEOS IN THIS UNIT
🎥 • CP2: Week 03 (Image Filters)
CHALLENGES
❓ Can you make the filter parameters interactive using the mouse or keyboard?
❓ Can you chain several filters together to make something more interesting than a single on by themselves? For example, try blurring before running a threshold filter.