Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Design > Voices That Matter

  • Print
  • + Share This
From the author of

Getty One: Selling Made Simple

Sure, HTMinimaLism works well enough for a self-designed portfolio site, but what about a for-hire corporate site? With its efficient design of gettyone.com (a stock photography site), 37signals proves that HTMinimaLism can also succeed on a commercial site, particularly one with a large database of displayable products. Getty One is actually the perfect candidate for this type of minimalistic design. When you're selling actual images, do you really want your Web site to be cluttered with a bunch of extraneous site-specific graphics competing for the attention of your product? What if Getty One's logo had been a neon-blue light bulb, looming large on every page of the site? Sure it would complement a few featured stock images (by chance), but it would grossly clash with others. So, the navigation and other site-specific elements at gettyone.com had to be low-keyed.

gettyone.com doesn't work at 640 x 480 (without having to scroll sideways)—but, then, it doesn't need to. The site's clients are graphic designers with large monitors. There is no liquid design here. The layout works at 800 x 600, and it simply recenters itself at anything larger, with little noticeable difference (see Figure 5).

Figure 5 gettyone.com.

Again, notice the abundance of whitespace. The core page contains numerous links, two search fields, and one pull-down menu. Yet it still has room to spare. 37signals chose to devote most of the screen real-estate to the search feature because that's how most people will navigate the site. Yet gettyone.com doesn't feel like a search engine. Why?

Because, although the search feature is prominent, it's not dominant. The color image in the center supercedes the search section in emphasis. Right off the bat, you are given an example of the product. This featured image rotates, so every time you return you get a different core page image.

The core page has a header section, a left section, a right section, and a bottom menu section. Yes, there is partitioning by design elements. But notice how subtle the partitions are—mere 1-pixel lines. There are no ubiquitous tables with colored backgrounds. The only background color is white. Why doesn't amazon.com look this clean?

In all fairness, Amazon has a lot more stuff to sell. But Getty One could have prominently featured numerous bundled CD-ROM discount packets on the core page. The site could have explained its membership options in detail. It could have talked about its copyright policy, or the resolution of their images, or any number of other things. But wisely, in the early information architecture stage of the design process, somebody had the wherewithal to realize that most people would be visiting gettyone.com for one reason—to search for and download images. With this primary purpose established, the core page could then be structured accordingly.

When you perform a search at gettyone.com, even more features and options are added to the interface, but 37signals still manages to keep things uncluttered. They do this by continuing to use lots of whitespace and by giving information only as it is needed. For instance, there are four tiny, cryptic buttons beneath each image. Mouse over any button, and a clear explanation of that button's function appears (see Figure 6). Mouse off the button, and the explanation disappears. This is a sensible use of DHTML to present task-specific information only as needed.

Figure 6 gettyone.com (level 2).

DHTML is also used to reduce clutter via the use of a Hide Viewing Options toggle button. The operations menu on the right includes a myriad of configurability options—but click the Hide Viewing Options button, and they all disappear (see Figures 7 and 8). It is this type of compulsion to keep the interface clutter-free that makes HTMinimaLism appropriate for sites with lots of options and products.

Figure 7 gettyone.com, with viewing options visible.

Figure 8 gettyone.com, with viewing options hidden.

Navigationally, 37signals uses space-saving pull-down menus aplenty at gettyone.com. The site even deploys a couple of Amazon-esque tabs here and there. But the navigation never diverts attention from the featured images themselves. Instead, this combination of sensible coding and minimalistic interface makes for a useful and enjoyable experience. Imagine that.

  • + Share This
  • 🔖 Save To Your Account