This project invites designers who want to combine computational processes and typography. My book and website (Code & Type) expose users to autonomous visual representation methods as well as rational perspectives that bring a new paradigm in graphic design. I developed these tutorial materials when I was teaching a course: Data Multi-sensory Representation at Rhode Island School of Design (RISD).

Nowadays, understanding the new media environment and incorporating computational processes are very important for graphic designers in order to link their works with dynamic media and modern culture. I had been looking for a creative software environment that allows designers to work in easier and more efficient ways. I found Nodebox 3, an open-source and node-based software application for generative design. The software was simple enough to learn and teach in a few days and quite feasible to integrate with graphic design; however, there were neither many users on the online forum nor good tutorials. My first mission was to fully understand the potential of the software, and to make tutorial examples for students in my class. My first tutorial materials on our course blog: (http://multisensory-data.com) were successful, in terms of conveying the basic concepts and the functionality of the software. However, many students started to ask me how to further integrate this computing process and graphic design. It was difficult to answer these questions just by showing a few demos during the class. The students’ curiosity and enquiries led me to begin this project, which eventually became Code & Type(http://code-type.com): an archive of experimental typography using computation.

Typography is a critical tool in visual communication. Unlike other attributes in design, letters pair with one another and complete a typeface: a set of characters. Each computational typography example describes how each system in the example re-creates text elements with a different set of rules. By controlling parameters in each inter-connected node, users can intuitively comprehend both methods and structures. Within the tutorial book and the website, I wish to convey my idea that the computational design process is different from just applying a filter in Photoshop. From my perspective, the computational process not only enables us to repeat certain tasks through automation, but also allows us to separate and to join the elements in our design. After all, computational design is not usually evaluated based only on the final outcome, but also on the whole design process including systems and thoughts beyond the visuals. Here is a common frustrating point that a designer often encounters. People do not know how to integrate their design and code, even though they have learned programming languages. In Code & Type, I made an open-source tutorial to let people explore all my processes to understand the methods and to recreate their own designs.

The main focus was to share a new perspective on computational design, so I chose limited typefaces for each example. However as can be seen, the result of each process changes the original characteristic of the typeface to a completely different one. In most cases, I treated type as a geometry that can be disassembled, and used points and paths on it as an input to play with. My aim was for the tutorial book to be educational enough to communicate my experiences in this field. Using memorable quotes from other designers in the example provides readers with memorable messages related to generative design, rule-based design, semiotic, and visual system. In this section, I included personal interviews with Dietmar Offenhuber, John Maeda, LUST, Thomas Ockerse, and other designers. For the efficient distribution, I migrated all my codes and images onto the website (http://code-type.com), because I hoped people would easily copy and paste codes for their study. Some people asked me about the reason I am sharing the codes, and I answered that I am doing it to make a better environment for the younger generation who will be able to further my explorations.

I think of this project as an educational process that encompasses two different paradigms: design computing and graphic design. My goal was for this project to not only help users solve problems in a novel manner, but also to inspire them with my ideas of catalyzing many designers to embody computational processes in their design. Hopefully, this project can contribute to the field of computational typography and help many designers who want to apply autonomous visual systems in their works.