iTunes 7 and the Source List

Or why is it shouting at me?

One of the big new features on iTunes 7 is a revised source list, so let’s compare the source list in iTunes 6 with the revised source list in iTunes 7.

Let us start with the background: it has been toned down a bit, not quite so shiny and new. If Vista is to have a shiny new interface, is this Apple’s way of moving away? It may be less bright and shiny, but the word that has been mentioned elsewhere is ‘gloomy’ which is never a positive description for a color, and hence why you very rarely see ‘Gloomy’ on paint charts.

But an even more obvious change is the re-structuring of what was previously a big list of items into sensible groups: Library, Store, and Playlists in the example. Other groups — such as Devices and Shared — come and go as you plug in iPods, pop in CDs, or access other shared libraries across the network. This grouping makes a lot of sense, and is a little bit overdue in iTunes: it breaks a potentially large list of items into manageable chunks; it keeps related items together; and visually it looks more approachable. From an organizational point of view, splitting Videos into Movies and TV Shows also makes sense from a user’s perspective.

The icons themselves have been given a makeover too.

If you’ve watched the stream of the “It’s Showtime” event and studied the demonstration of the iTV prototype, the icons featured there are very similar, although Movies uses a clapper-board rather than a filmstrip. The Library icon in iTunes 7 now no longer needs to convey the concept of being a library, since the Library heading does that, so the music note can now live on its own, freed from the stack of pages behind it. The icons look sharper and better defined than previously, particularly the Podcasts icon, which used to look as if it had been scaled down from a much larger icon, and then not been edited for the smaller size. The Radio icon also gets a new icon, mainly because Airport wanted its icon back. The iTunes Store gets an icon that better reflects its nature, rather than being a color variant of the old Library icon. And Party Shuffle gets fewer, but bigger, CDs for a more modern looking icon as opposed to the one which could have graced a Mac OS 9 application.

The spacing has also changed: the icons have all moved across to the right in order to be indented under their respective headings, and the line spacing has been increased by a couple of pixels, resulting in a less cramped looking list. The list also uses indicators at the right end of the rows to display number of un-listened-to Podcasts, or to indicate download progress, which is a nice touch.

The row highlighting has also changed in iTunes 7. Rather than using a blue bar with subtle gradients to indicate the selected row, iTunes 7 uses a very flat, very matte, and very black row instead.

The move to a black bar may have been prompted to some degree by the fact that three of the main library icons — Music, Movies, and TV Shows — are predominantly blue, and that a blue highlight bar may have caused them to become lost against such a background. But the decision to use a black selection bar isn’t used consistently within iTunes 7: selected rows elsewhere use a flat blue background, while the current row in Party Shuffle use a dark blue row with such a sharp crease in the gradient that you’d cut you tongue on it if you tried to lick it.

One interesting change in the row behavior is the small circular arrow which links to the iTunes Store only shows up for selected rows, which does help de-clutter the list to some extent. The checkboxes have also lost some of their Aqua color, and seem to have a slight variation in position and size between the three selection styles. The white text on the blue background no longer becomes bold when the row is selected, making it sightly less legible.

One of the changes that has attracted a lot of attention has been the use of all-caps for the group headers. The use of all-caps is not something that has been seen within a Mac interface, with the exception of the “OK” button. While all-caps wouldn’t — and doesn’t when used carefully — look out of place in print, or on a website, it does look out of place in a Mac application’s interface simply because we’ve not seen it there before. Whether we like it or not, iTunes 7 is creating a precedent.

These headings don’t do anything when clicked — they’re purely visual. Would it have been more useful to make them part of an outline view so they could have been collapsed when not required? The items under the headings may themselves have nested items, so the outline view is already in use here.

So, just within the source list in iTunes 7 there are lots of improvements — some large, some small — but also some decisions that cause ripples for interface designers. For example, one question which we haven’t had to deal with previously is now whether, and when, to use all-caps for headers in an interface for a Mac OS X application. The precedent that iTunes 7 sets with the use of all-caps headers gives greater flexibility and greater design freedom to the interface designer, but this may result in less consistency within, and between, applications. The row selection colors are another departure from the conventions established in previous applications, and again offer similar opportunities and problems to interface designers.

One more thing… The source list very nearly didn’t look like this at all. Courtesy of Daring Fireball it appears that Apple had included a screenshot of a rather different source list in one of the KnowledgeBase articles.

Can you imagine the ripples that appearance would have caused had it made it to the release version? Perhaps, paradoxically, it would have caused fewer ripples among interface designers, as it might have been more evident that this color scheme was intended for use within the main content area of iTunes only, and not necessarily the direction the OS was going in. It works better with the more web-like content of the iPod pages, but it is difficult to say whether this color scheme would have also applied to other aspects of the interface, such as the Music list. In many ways it almost appears as though the intention behind this color scheme was to more clearly separate the content of the window from the rest of the interface.

Then again, perhaps the ripples would have turned into a tidal wave…