John F Simon Jr’s “Every Icon” is a web-based artwork that sorts through every possible configuration of black and white squares within a 32x32 grid. This artwork manifests the overwhelming and seemingly endless nature of variability. Even within the smallest constraints, realizing every possible combination of pixels within this small grid would take hundreds of trillions of years. This artwork provides a sublime hugeness to each pixel’s potential to convey information.
Image Description: A screenshot of John F Simon Jr’s “Every Icon” is displayed. A 32x32 grid is featured on the left half of the screen. Only the top two rows have seemingly randomly placed black squares, the rest of the grid is white. On the left of the screen is a description of the artwork, which includes the size, the artist’s name, and the starting date of the project, January 14th, 1997.
(I’ve only been running this for around 20 minutes)
As a professional pixel artist, I’m incredibly humbled by the fact that I’m just slightly more efficient than a program that can run through every possible iteration of a 32x32 grid.
I don’t share the same relationship to pixel art as “Every Icon”. My navigation of a 32x32 grid isn’t to explore the sublime potential of each square, but to render a distinct and recognizable image.
Image Description: There are two 32x32 black and white pixel art images. The pixel art on the left features a top-down perspective of a small house with a single door. The pixel art on the right features a tree.
(“Every Icon” would have rendered these eventually, but I beat John F Simon Jr to it!!!)
My relationship to pixels, and by extension, computation, has always been to conform the medium to my vision, rather than to investigate the framework of data itself. I’m excited to change my approach to computation, and discover the ways that the medium can inform my processes.
For my first assignment, I was motivated to approach pixel art with a completely different perspective by rendering a 32x32 black and white pixel image using p5.js’s online editor.
I started by rendering the image in a drawing program. This step wasn’t different from my usual art practice.
Image Description: A screenshot of the FireAlpaca drawing software. On the canvas is a black-and-white pixel art rendering of a house.
I planned on rendering this image in Javascript by scanning each “line” of the pixel art image. I was going to input the data for each black pixel onto a white background.
I used separate layers to split the image into rows.
Image Description: A screenshot of the FireAlpaca drawing software. On the canvas is the black and white pixel art image split into horizontal strips. On the right, the layer window is filled with individual layers that house each strip.
The navigation tool in the drawing program helped me keep track of where each pixel was along the X and Y axis as I typed in the coordinates into the online p5.js editor. I magnified the pixel art image by 10 to keep things simple.
Image Description: A screenshot of the FireAlpaca drawing software. At the bottom of the image is a navigation bar, a strip of text that describes the resolution, size, and coordinates of the cursor. The coordinates are circled with a red line.
Image Description: A screenshot of the p5.js online editor. The script is featured on the left of the screen, which features a series of different rectangles (their size and their coordinates). On the right of the screen is the rendering of the code. Only the top third of the image has been rendered in black-and-white, the rest of the image is white and blank.
By reducing the pixel art to a series of coordinates, the representative nature of the pixels wasn’t as significant as the location of each pixel. I initially used the navigator in my drawing program to check the placement of each pixel, but I eventually stopped using the navigator entirely and fell into a rhythm of noticing where each pixel based off of the previous data I inputted.
It was incredible to experience the placement of each pixel within a new logic. Making pixel art always requires some arithmetic, but rendering images in Javascript took that experience to a new level. I’m excited to revisit this exercise with new limitations (additional colours, different scale, etc.) and see how that affects the process.
