The Personal Disquiet of

Mark Boulton

Type in Berlin

– November 7th, 2007 –

Since Sunday evening, I’ve been in Berlin attending—and speaking at—the Web 2.0 Expo. I presented earlier today on the very ‘un-web 2.0’ topic of Typography. I think it may have surprised a few people as to how relevant typography is to designing UI—even to applications. As usual, I talked about type as being more than just choosing typefaces, which is where most designers, unfortunately, see typography begin and end.

On closing, I gave a URL which would link to a section of this site with the slides, notes etc. You can download the slides here.

Apologies for the delay, but the up-speed of the conference wifi was incredibly poor, so I’ve only just got around to doing it.

I’ve also decided to embed the slides here from Slideshare. I don’t normally do this, so apologies if Slideshare clogs things up, but I thought it might be nice to have the slides here whilst I break-down the topics I presented.

The slides

What was said

I’ll give you a quick run-down of some of the main points of the talk.

I started off with a quick introduction of placing typography within Web 2.0. Where does typographic design as a practice fit with designing applications and platforms for the ‘web of data’. The rest of the talk was then split into four main section: Structure, Process, Macro typography and Micro typography.

I presented the following points:

Structure

<

p>

  • Typography is presenting information.
  • Information is language and language has structure.
  • Documents have a conceptual model and these need to be matched to the reader’s conceptual model of the content.
  • It’s the designer’s job to bridge this gap and present the content which fits both models. Incidentally, I feel this is one of the problems facing designers who want to art direct on the web.
  • Content and presentation.

Process

<

p>

  • Jesse James Garrett’s ‘Elements of User Experience’.
  • Wrongly interpreted as a linear process.
  • A process like this relegates design, and specifically typography, to the surface plane.
  • Greybox Wireframes.
  • Involving typographic design much earlier in the process.

Macro typography

<

p>

  • The Big Stuff.
  • Creating spacial relationships.
  • The Golden Section.
  • The Golden Section as applied to the web.
  • The Rule of Thirds.
  • Grids and consistency of design across page types.

Micro typography

<

p>

  • Hyphens are not dashes.
  • Letterspacing: negatively and positively.
  • Italic ampersands in headings.
  • Framing navigation items and lists.
  • Framing tables rows and columns

Those were the main points. It seemed to go down well, although, I still had the feeling the presentation stuck out like a sore thumb in a conference discussing some of the loftier aspects of designing for the web.

The rest of the time was spent in the pleasant company of friends old and new. Jeremy and Jessica, Simon and Nat were wonderful in arranging a variety of evening Berlin eating establishments. In truth, I met them in the lobby and we wandered around until we found a restaurant that could accommodate 13 people.

I ate some strange German food, and drunk some even stranger red beer. I said strange, not bad. I enjoyed sitting next to Jesse for two meals and discussing everything from washing machines and remote controls, to the waiter with the incredible memory (yes, he took a complete order—starters and main courses— without writing a single thing down! Impressive or what? I need to write a list if I need more than two things at the supermarket).

So, all in all, it’s been fun. But, it’s been tough trying to manage a conference, preparing a talk and running a small business that is ticking over at home. That has been challenging. I missed The Wife and am dying to see progress on my house extension.

I will say this for Berlin though, it’s a great place to come as a designer. I even found a design manual in a bookshop today on how to design forms, timetables and transportation tickets. How cool is that?

Filed in: conferences, design, typography.

Further reading