Sorting

TD COMPs / TOPs / 2023 – Present

Pixel sorting is a technique that reorganizes the pixels of an image according to a defined metric‐such as brightness, luminance, or individual color channels. Rather than altering the pixel values themselves, these operations rearrange where pixels appear in the image, producing visually striking transformations or enabling analytical exploration of an image’s intensity structure.

In image processing, sorting can reveal hidden gradients, expose tonal distributions, and create controlled distortions that respond directly to the underlying data. By treating the image as a collection of sortable elements, pixel sorting becomes both an artistic tool and a procedural analytical method.

Pixel sorting is commonly used in data‐driven visualization, glitch aesthetics, compression‐like effects, luminance mapping, and generative texture design. Together, these components provide a controlled and reversible way to explore pixel‐level reordering within TouchDesigner TOP networks.

Index:
Sort, unSort

Sort

Pixel ReOrdering

This component reorders the pixels of an input image according to a user‐defined sorting strategy. Unlike traditional image filters, pixel sorting rearranges the spatial structure of the image itself, producing results that range from analytical reorganizations to highly stylized effects. The sorting process is computed using POPs, and the re‐organizational data generated during sorting can be optionally output alongside the final image.

The Sort COMP operates in three modes, each defining how pixels are arranged on the output grid:

  • Full: Sorts all pixels globally from brightest to darkest, filling the output from the top‐left corner downward in a zig‐zag row pattern.

  • Columns: Sorts pixels independently within each column, placing brighter values toward the top and darker values toward the bottom.

  • Rows: Sorts pixels independently within each row, placing brighter values to the left and darker values to the right.

When paired with the unSort COMP, the sorting process becomes fully reversible. This makes it possible to experiment freely with pixel ordering while preserving the ability to return the image to its original spatial configuration.

Resources:

Download the .tox files
Pixel Sorting on Medium

Parameters

Sort:

Defines the direction and structure of the pixel sorting operation.

Sort By:

Specifies the metric used to evaluate pixel intensity.

Luminance:

Determines the method used to calculate luminance )active only when Sort By is set to Luminance(.


Output unSort Data:

When enabled, outputs corresponding POP data describing the pixel order transformation applied during sorting.

In‐ / Outputs

Input 0TOP image to be sorted.

Output 0TOP Sorted image.
Output 1POP Pixel sorting data.

Updated16/11/2025


unSort

Pixel ReOrdering Reversal

The unSort component reconstructs the original spatial arrangement of an image after it has been processed by the Sort COMP. Instead of applying its own sorting logic, the unSort COMP uses the re‐organizational POP data generated during the original Sort operation to reverse the pixel ordering step by step.

The unSort COMP requires two inputs:
The image to be unsorted, and
POP data stream produced by the Sort COMP.

By referencing this stored mapping, the component restores each pixel to its initial position, effectively undoing any sorting performed across rows, columns, or the full image. This allows pixel sorting to be used as a reversible transformation — ideal for analytic workflows, generative animation, or procedural effects where temporary reordering must remain recoverable.

Resources:

Download the .tox files
Pixel Sorting on Medium

Parameters

unSort:

Specifies the sorting structure that should be reversed.
This must match the Sort mode used in the original Sort COMP in order to correctly reconstruct the input image’s original pixel arrangement.

In‐ / Outputs

Input 0TOP Sorted image to be unsorted.
Input 1POP Pixel sorting data.

Output 0TOP Unsorted image.

Updated16/11/2025