This is an interface to create glitch art with pixel sorting.
Pixel sorting re-orders the pixels in a row or column according to a parameter. For example, you might sort the pixels in a row based on how red they are.
You can filter which pixels this applies to by using thresholds. For example, you might set a threshold to only sort pixels that are above 40% lightness and below 80% lightness. This creates natural sections within a row: a block of pixels within the threshold will be sorted, blocks of pixels outside the threshold will remain unsorted. This can create beautiful effects.
You can take this further by masking. This will set an area for the sorting to ignore, and can bring focus to a scene.
Try different modes and different thresholds. Sensible defaults have been chosen. Have fun!
Original script by Kim Asendorf.
Shout outs to Satyarth for their great explanation.
Web worker usage inspired by Butter.js.
Project requested by Peter Sanfilippo.
If you've created art with Pixel Sorter, message me and I'll link it in the showcase!
Pixel Sorter will always be free. All code is executed in your browser, so there are no server costs to pay. If you enjoy Pixel Sorter, let me know here.