home/ atoms/ pixel-mapping-remap

Pixel mapping replaces each pixel of a source image with a drawn element sized or coloured by that pixel's value

Pixel mapping reads a source image’s pixels and, for each (or each sampled block), draws a substitute element whose size, rotation, colour, or choice is driven by that pixel’s brightness or colour. Dark pixels might become large dots and light pixels small ones, or every pixel could become a letter, an SVG glyph, or an emoji whose average colour matches. Sampling stride sets output resolution and density; using the pixel’s greyscale value as the control signal is the classic halftone/ASCII-art move. The technique turns any photo into a re-rendered generative artwork and generalises to live video input.

Examples

P_4_3_1_01 translates each pixel into a new element (a shape sized by brightness); P_4_3_2_01 maps pixels to letters and P_4_3_4_01 to emoji whose average colours were pre-analysed. loadPixels() then step across at a chosen stride.

Assessment

Map an image so darker pixels draw larger circles. Then change the element from a circle to a rotated line whose angle encodes hue, and describe how the output reads differently.

“pixel mapping. each pixel is translated into a new element”