Whitespace is the most basic variable of graphic design. We embrace it as soon as we see it. In particular, modern web pages offer good examples of whitespace usage. Yet, when we turn to the desktop, and in particular to development tools, whitespace tends to disappear, as if it would be a wasted space. There certainly are exceptions to the rule, such as LightTable, but to a large extent, the world of development tools is dominated by thick borders. I believe we can do better.

As an experiment, I started to work on a new look for Pharo and Moose that tries to maximize whitespace (I even chose a white whitespace). I started from the existing Glamour theme and removed color and lines where I did not see a good reason for having them.

My experiment is a primitive one: first, I started from a filled space; second, I only touched the theme of existing widgets without affecting the widgets themselves. Still, I believe it shows potential. Take a look at the pictures below (please try to ignore the thick gray buttons from the Pharo code browser).

You can reproduce the pictures by executing the following code in a recent Moose 4.8 image:

MooseImageSetupCommandLineHandler new
     installFonts;
     installAthens;
     installGLMWhitespaceTheme.

To exploit whitespace at its full potential we need to make our widgets less dependent on lines and delimiters. During this experiment, I realized that our interfaces get often cluttered because we rely on fine-grained widgets that are designed to work independently from each other. As a consequence, to ensure their independence they have to be distinct which often leads to explicit delimiters. A way out of this trap is to approach the design globally and construct interfaces out of higher level patterns based on widgets that work tightly together.

Whitespace is a resource. We should fill it only for a good reason. Carefully.