Python for Designers

by Roberto Arista

Fork me on GitHub

Using DrawBot

Since Python does not have a native graphics library, it has to rely on external resources to create images. For example, in the scientific world – where Python is super popular – data visualization is usually done with the matplotlib library.

Our needs differ from the ones of data scientists. This is why we are going to use DrawBot, a software made by designers for designers.

DrawBot has two significant sources of influence: on one side the teaching of Gerrit Noordzij, a very important Dutch typographer and type designer who set the bases for the teaching of type design at KABK in The Hague and author of a very influential (and still debated) book, The Stroke. On the other side, you can find John Maeda's Design by Numbers (followed up by Reas, Fry and many others) which flowed into Processing.

Both sources stress the influence that tools have on art and design practices, therefore the need to control your means instead of submit yourself to them. DIY, not for the sake of it, but because designers with a clear perspective cannot suffer mainstream workflows.

As soon as you move out from the sketching phase of the design of a typeface, repetitive tasks grow exponentially. Placing accents, interpolating masters, and every project has its peculiarities. For this reason, designing an interface or a workflow which could facilitate every need soon appeared as a useless effort: it is better to make anyone able to get it their way. The team decided to open the door to the core functionalities of the application which anyone could access through a scripting language. After the first attempt with AWK, Just proposed to give a chance to Python, an open source language invented by his elder brother Guido a few years before. It was a happy union, destined to influence the type industry radically.

Even if RoboFog did not survive the OSX revolution, their work continued over the years on a bunch of other tools and, with the contribution of developers and designers like Tal Leming, Frederik Berlaen and many others, originated what I like to call the UFO Galaxy.

Just was quite soon active as a teacher at KABK academy in The Hague, and he wanted to find a way to allow students to have a taste of that kind of approach. For this reason, he decided to make an application able to generate graphics through the code in a similar way to Processing but using Python instead of Java. With the first version of DrawBot, Just allowed his students to get their hands directly into the graphics core of macOS without the obtrusion of a user interface. This edition was released in 2003 and kept going for about ten years without substantial changes.

A few years later, Frederik Berlaen tried to mimic the DrawBot application structure, but instead of creating a wrapper around Cocoa (macOS graphics library), he bridged a coding interface in Python with the HTML canvas. The project was called TinyDrawBot. It is not alive anymore, but this experience pushed Frederik to ask Just to revive the DrawBot project and to transform the application in a stack of action which could dialog with different kinds of interfaces. In 2013, DrawBot 3.0 was released. The focus moved a bit from the initial teaching purpose, towards a set of refined and powerful tools to set typography and proof type design. Nowadays DrawBot is a large and robust application/module regularly used by many companies and designer in their workflow.

You can download the application binary package from the DrawBot website. The binary is self-contained: it comes with a version of Python inside. This means you do not need to install anything else at the moment.

It is possible to install DrawBot as a separate module and let it interact with other Python modules outside the application. Have a look at the source code README file for further information.

DrawBot has a very simple interface:

Paste the following Python code into the coding area, hit cmd+R, and you will see some output into the canvas.

font('LucidaGrande', 100)
text('Hello World!', (100, 200))