Postcard Three (Coding)

The third postcard was meant to explore the contrasting relationship between analogue and digital. For this design, I wanted to show my tendencies in working with digital mediums as opposed to print and traditional materials. However, I wanted to take a reversed approach with the execution of this design. Instead of using code to create a work or design, I wanted to create something by hand first, and then convert it to code.

The process began with me hand lettering my name on a sheet of paper. I used a calligraphic marker with a chisel tip and carried out some exploration.


I then picked the one that I like the most and scanned it into the computer. I proceeded to vectorize the lettering using Image Trace in Adobe Illustrator.

Screen Shot 2016-02-24 at 2.29.40 AM

After this, I saved the output as an SVG file to expose the vector path information and its corresponding code. The code generated is in fact, a complex system of cartesian coordinates and equations that compute curves and lines. Here is a screenshot of the code from within Coda, my code editing program of choice.

Screen Shot 2016-02-24 at 2.33.42 AM

And here is the solve for the vector path

Screen Shot 2016-02-24 at 2.36.51 AM

As seen above, the code ended being extremely long and complex for it to be used in a visually appealing way. Furthermore, the moire process would introduce too many gaps in the delicate text, rendering them unreadable and unsightly. As such, I decided to use only a small portion of the code to represent the idea of coding. In the end, I settled with the header segment of the file.

Screen Shot 2016-02-24 at 2.37.18 AM

I rendered the portion of the code in the same font, “Input Sans”, which I also use in my code editor. I chose to set the font to black as it would be more resistant to the gaps created in the moiré process. I ended up with a 3 frame animation that presented the code, and then the solve for the path, and finally the actual image that I started with. This is the composite:

Screen Shot 2016-02-24 at 2.45.24 AM

And this is what the final animated version looks like, when interacted with:


Author: Kapi

Kapilan Naidu is a multimedia artist, designer, data-junkie, sometimes DJ and bedroom producer.

Leave a Reply