I've been always interested in artistic image processing, such as Jason Labbe's Portrait Painter. I love exploring color transformations with original images. I'm also a big fan of Mike Bostock's Visualizing Algorithms, where it's amazing to get pretty pattens that capture the core essence of each algorithm.

These works made me wonder: can we apply such beautiful patterns to images? To explore this idea, I created HAP, an online platform that filters images using algorithm visualizations powered by WebGL. The core concept is that color encoding is not only determined by the processing data structures—it also takes into account the original pixel color at each position.

I implemented a WebGL-powered filter API that blends colors into polygons or points areas of the source image, which can also be mapped onto a sphere as well. Areas are computed by the following algorithms:

• Sampling: Uniform, Normal, and Poisson Disc.
• Searching: Binary Search and Golden Search.
• Sorting: Bubble Sort, Insertion Sort, Quick Sort and Selection Sort.
• Graph: BFS, DFS and Prim's Algorithm.

I may add more algorithms, and you’re welcome to do the same! Also, I’d love to see what you’ve created with HAP. For my previous exploration on this topic, please refer to v1 and v2 branches.

Let’s hack, painters!