Industries

Formats

Typefaces

  • These are the most common typefaces in the database, but there are many more. Try a search!

Camera+ iPhone App

Bree isn’t just the font used for this interface, it’s the face of the app itself.

Contributed by Stephen Coles on May 31st, 2011. Artwork published in 2010.

The Camera+ iPhone app uses Bree for all UI typography. Click to enlarge.

The iPhone app I use more than any other — beyond the pre-installed software from Apple — is Camera+. Its shooting modes and high quality effects not only make the iPhone a better camera, but its superior sharing functionality (to Flickr, Facebook, Twitter, and email) covers the entire process of taking and editing a photo to sending it to your favorite destination. Other apps do one or two of these things well, but Camera+ excels at all three stages. It manages to pack in all these features without feeling too technical or overwhelming. It’s simply a pleasure to use. Most of that is due to the very savvy UX designers at tap tap tap, but some of the credit can go to the typeface they use throughout the app.

The “Lightbox” is like the iPhone system’s “Camera Roll” but displays images available specifically to Camera+. Click to enlarge.

Before seeing Camera+, the playful and pretty Bree wouldn’t have been on my list of options for a software interface. It’s an unusual choice, especially for an app with so many buttons and options. Yet the type performs beautifully on the forgiving surface of the iPhone 4’s bright, ultra high resolution display. Click any of the images here for a better view, but to really see what I mean see the app on the phone itself — it’s certainly worth at least a couple bucks.

Bree is used throughout the edit stage, from buttons and titles to slider overlays. Click to enlarge.

Looking past the assumption that Bree is a display typeface (mostly due to its distinctive closed-loop ‘g’ and ‘y’), it has characteristics that actually suit it quite well for the spatial limitations of UI design: an open aperture, large x-height, short ascenders and descenders, and simplified forms that allow for tight letterspacing (‘t’ and ‘f’ crossbars that only extend right, the narrow shapes of the ‘a’ and ‘e’). But its main value is emotional. The net effect of using such an informal typeface is that an app as complex and powerful as Camera+ is immediately more approachable than it would otherwise be. Bree isn’t just the font used for the interface, it’s the face of the app itself.

Despite using a non-“native” font, and a slightly different graphical style the Camera+ interface is still unmistakably iOS.

With the iPhone 4 setting such a high standard for mobile screens, other devices won’t be far behind. Suddenly, picking fonts for software interfaces isn’t so different from picking fonts for print. You can make a good case for consistency and go with Helvetica, Apple’s choice for iOS and their built-in apps, but there is also power in using an unconventional typeface to define the experience of your app and brand.


2 Comments on “Camera+ iPhone App”

  1. Dec 2nd, 2011  2:41 pm
    Edit

    Thanks for this. I use this app more than any other on the iPhone and absolutely love the interface. I never put two and two together re: use of Bree. Your analysis helps me feel comfortable recommending, or at least considering, non-Helveeta fonts in a UI.

  2. Pethr says:
    Aug 7th, 2012  4:54 pm
    EditBree is beautiful but it doesn’t look right in an app interface if you ask me.

Post a comment