I had an idea for the new version of my site: I was going to illustrate objects using only HTML and CSS ( to show that I know how to do stuff with code), and make them look like they were neatly organized in a physical space* (which seems vaguely trendy) according to the underlying grid of my site (which is pretty designer-y), and on mouseover, you’d be able to move them with CSS transitions (more cool code stuff).

*And sidebar: did you know that organizing physical things based on angles actually has a name? Yeah, it’s called knolling. As in, to knoll. Named in reference to the furniture design company Knoll. Remember, always be knolling.

As I was sketching ideas, something familiar began to take form, and I had a suspicion that it looked a bit too familiar.

Wondering what jogged my memory, I looked over my desk to a pile of design books and came across the program for a recent exhibition I had attended. Flipping through, I realized that my sketches resembled one of my favorite pieces from the exhibition—Karl Gerstner’s brochure for Holzäpfel tables from the early 1960’s.

My sketches weren’t a one-for-one match, and it would have certainly been easy enough to take the idea of organizing physical objects and make sure that I arranged them in a different way so as to not copy Gerstner, but I thought, “what the hell? This could be an interesting exercise”. So I went back to where I originally saw the work—Hollis’s seminal Swiss Graphic Design: The Origins and Growth of an International Style—and got to work.

The Original

Tische—Brochure Cover for Holzapfel by Karl Gestner

Above: Karl Gerstner’s brochure for Holzäpfel circa 1960, (in greyscale, as photographed in Swiss Graphic Design: The Origins and Growth of an International Style, page 230.)

There are lots of great things about Gerstner’s design ethos in general that have influenced much of my own, but this particular piece uses photography in an ingenious way that I’ve always admired. In his original, the purpose of the photography is two fold:

  1. Photos taken from directly above and beside (without perspective) actually “diagram” the table. This continues throughout the brochure, with detailed dimensions accompanying the diagrammatic views, illustrating the tables in relative scale and subtly conveying essential information about the product.
  2. The photo of the table, as well as the objects on the it, become crucial elements of the whole composition of this piece. The white ashtray, matchbook and brochure dynamically activate the space of the printed page, placed “just-right”—a study in composition, contrast, and scale.

Notice how the “Ti” perfectly aligns with the side (elevation) view of the table, the ascender on the “h” seems to continue straight into the pipe, and the left gutter of the smaller type aligns with the left edge of the matchbook. The grid literally extends into the reality of the photograph and that is smart attention to detail.


My homepage design on the left, the original Gerstner brochure cover, right.

I set out trying to replicate the original scene exactly with some CSS shapes, but decided to change it up to better reflect the work that I do today because of the prominence of the exercise on my site, and the fact that the reference to a pipe, ashtray, and matchbook would probably only go noticed by a handful of design geeks.

For the purposes of the composition, the important thing is that the different elements are rectangular and are precisely aligned, so I chose three rectangular shapes that reflect the content of my site—a journal for the blog entries, and a phone and tablet to display portfolio work. The result is perhaps a little too skeuomorphic for my tastes generally, although since it’s referencing a photo of objects, and not the objects themselves (s*** just got meta)… perhaps skeuomorphism is acceptable this time?

Plagiarism, parody, or homage?

Good designers copy, great designers steal… right?

The quote I’ve actually heard attributed to Picasso is “good artists copy, great artists steal.” Turns out Steve Jobs attributed that to Picasso, which was repeated in the media many times, but upon further investigation, might not have actually been said by Picasso in the first place.

I don’t think this is exactly what Picasso, or Steve Jobs, had in mind… but I do think referencing works that influenced you and your industry can be appropriate—though this has been debated, famously around the Paula Scher/Herbert Matter Swatch posters. And let’s face it, copying can also happened accidentally, with all the best intentions. At some point, I think we have to admit that much of the work produced in our industry is very similar to both our contemporaries, and influences. There are only so many variations you can make. I don’t mean that as an excuse for lack of originality, but I do think it’s a reason to own up to your inspiration: if you are going to copy, try to do it with intent.

So, I’m going to defend this as homage. From Wikipedia:

Homage is a show or demonstration of respect or dedication to someone or something, sometimes by simple declaration but often by some more oblique reference, artistic or poetic. The term is often used in the arts for where one author or artist shows respect to another by allusion or imitation.

I intentionally used the original Gerstner design as inspiration, and sought to make an adaptation—a derivative work—crediting the original. Mainly, I wanted to explore how an entirely new medium (the web, interaction) can alter the original.

Broadly, I think the lessons of the Swiss (International) Style can (and obviously do) inform how we design interactive experiences, and there is still room (and need) for modern interpretation.

I did wrestle with whether or not to pursue this direction for a while, but decided that a personal portfolio site is actually the best place for this type of imitation (versus professional work completed for clients—or, for any students reading—work done in the classroom). Your own personal work is the place to experiment and flirt with your influencers. Hopefully my actual portfolio doesn’t appear too referential.

Swiss design today?

Because of this simple exercise and the resulting quandary over copying, I found myself wondering what the Swiss designers would be doing on the web today. Would they simply be applying the same conventions they pioneered to interactive media?

Or would they be breaking new ground and codifying new systems for these new design problems: dynamic sites with a plethora of screen sizes, technologies, languages, input types… ?

Would the same names we study—Gerstner, Müller-Brockmann, Huber, Eames, Lustig, Rand, Bass—still be pushing the limits of their mediums? Would they be groundbreaking interaction designers and developers? They were all pioneers—transcending traditional silos and producing work across print, video, sound, paint, exhibits, buildings, furniture…

So who today will follow them, landing in the history books 50 years from now—and what will they do to contribute to the lexicon of design—an industry just emerging from it’s awkward adolescence?

Thinking about these questions is the reason it’s good to continually remember—and sometimes reference—historical precedents, lest we ignore the lessons of the past.

Perhaps Karl Garstner will happen across this site one day… I’d very much look forward to his opinion on the subject.

What’s yours?