Drawing by Numbers

Drawing by Numbers

Created with artist Simon Emberton

Drawing by Numbers is designed to demonstrate the conversion process from an analogue life drawing to a digital drawing that is described in code. It was created for the Drawing by Numbers workshop at the Media Space in the Science Museum, London, where participants could scan a recently completed life drawing for translation into a series of codes and images, and have it printed out.


  • We scan an original image (using the computers built in webcam), which is stored as <binary code>.
  • The app reads the binary code as a series of pixels each with a specific location on screen and a value for colour intensity. This is the <pixel intensity (bitmap)> element of the image (in low resolution).
  • Vector graphics store the location of key points of an image (x and y coordinates) alongside some additional drawing rules. This concept is behind the <x.y coordinates (vector)> image. 
  • Finally the code finds a range of intensity values in the image and uses those as key points for a new image. The key points are connected together using something called Delaunay triangulation. This final image demonstrates how the original life drawing could be transformed into a vector image.
  • The final image is a collaborative effort between the original artist, the artist that has written the code, and the machine that has executed that code <drawing by numbers and me>.

The work takes inspiration from the Universal Everything and You exhibit by Matt Pyke, which converts the human form into a reduced set of coordinates. In Universal Everything and You we see key points of a moving figure displayed abstractly, leaving just the movement to provide insight into the form itself. In Drawing by Numbers we see a static version of this, where the key points are used to create a crystal-like, slightly three dimensional looking representation of the figure in the original life drawing.

The Java-based Processing code is open source and available on OpenProcessing.org:


—- Active Keys —-
//// left-hand side ////
Press 1 – display composite image
Press 2 – display pixelated image
Press 3 – display binary image
4 – display x, y coord image
//// right-hand side ////
Press s – show or hide scanned image
Press t – update and draw thresholded points
Press r – draw random points
Press c – clear image