Tile Swap (005)

Tile Swap reconfigures aerial imagery of New York City. Newfound edges of each tile draw attention to previously unnoticed boundaries and continuities within the photograph.

The image is subdivided and tiles are randomly paired and swapped. New logics are formed, and the misalignment is either heightened or imperceptable: streets find new connections, houses have different neighbors, and water has unfamiliar shores.

When panning through areas of overwhelming sameness, difference arrives as a surprise — not at the perimeter of the overall map, but suddenly at an unexpected internal edge.

Tile Swap is built as a 2D-canvas element on top of a hidden webGL-canvas element from Mapbox. In having two separate canvases, panning is tracked in one while the modified representation is shown in the other. The Mapbox canvas provides the original tiles which are drawn to the 2D canvas as an image. getImageData() is then used to return pixel arrays at each grid point. The pixels in one subdivison are swapped with its randomized pair. The original mapbox canvas is hidden overtop the reshuffled canvas with an opacity of O.

Next Steps:
  • Add functionality for users to enter a custom location and change grid size
  • Explore whether tiles can be cut and reorganized along street centerlines
  • Use machine learning to explore blending the edges of tiles to create a new ‘place’

3 thoughts on “Tile Swap (005)

Comments are closed.