Shaders
Post Effects
Exercise Implement some posteffects you find interesting. Introduction # Post effects, in the context of computer graphics, refer to the application of visual filters, transformations, and enhancements to an already rendered image or frame. These effects are typically used to modify the appearance, mood, or style of the image by altering its colors, textures, shapes, or overall visual characteristics. Post effects can include techniques such as blurring, sharpening, color grading, distortion, bloom, motion blur, and many others.
Image Processing
Exercise Implement an image / video processing app supporting different masks, including other kernel sizes different than 3x3 Introduction # Image processing with WebGL in the context of p5.js brings a powerful toolset for manipulating and transforming images in creative coding. With p5.js, a JavaScript library designed for visual arts and interactive graphics, and the integration of WebGL, developers and artists can tap into the capabilities of the GPU to perform real-time image processing tasks.
Procedural Texturing
Exercise Adapt other patterns from the book of shaders (refer also to the shadertoy collection) and map them as textures onto other 3D shapes. Introduction # The goal in procedural texturing is to procedurally generate a texture using an algorithm in such a way that the result can be mapped onto a shape as a texture. Procedural texturing requires the use of a frame buffer object which in p5.js is implemented as a p5.
Texturing
Exercise Implement other coloring brightness tools such as HSV value V, HSL lightness L or Component average. Introduction # The goal in this exercise is to apply different color models to analyze better the characteristics of an image. Models such as HSV or HSL. Previous Work # The HSL representation models the way different paints mix together to create color in the real world, with the lightness dimension resembling the varying amounts of black or white paint in the mixture (e.