With Apple’s WWDC only a week away, whose knows what Tim Cook will discuss. The big news everyone wants to know is what will iOS 6 bring to the iPhone and the iPad.??

Yungjohnnybravo x TatWZA

A brief look at the history of Apple’s mobile UI, and what hints it may hold for iOS 6

Sometimes you break out the sledge hammer. Sometimes you knock down the walls and rebuild from scratch. Palm did that. Microsoft did that. RIM is doing that. Other times you pick up a brush and slap a coat of paint on the walls, and the place suddenly looks good as new. (And yes, there’s a trompe-l’oeil to skeuomorphism joke in there that I’m going to gingerly avoid.)

With iOS, Apple has both said and acted in a way that indicates they consider familiarity to be a features — that’s why the iPad introduced in 2010 pretty much looked and worked the same way the iPhone did when it was introduced in 2007, and the same way both still do today.

It’s also the reason the core of iOS — Springboard — isn’t likely to change any faster than iOS’ hundreds of millions of mainstream users can digest. Because, to users, the interface is the app. Apple can remove Google data from Maps.app, but as long as the interface works in a familiar way, and the content remains accurate and appealing, to many users the change will be transparent. How many noticed when Apple swapped out Skyhook Wi-Fi location data for Apple’s own database?

As much as we’ve explored the idea of a new iOS Home screen, and what potential a 4-inch,16:9 iPhone screen may allow, we’ve also been hearing for a while now that renovation may not be on the agenda this year. For iOS 6, what we might be getting is more like a coat of really good paint.

But which colors will they use?

Here’s a brief look at Apple’s iPhone interface designs over the years, and how each of them would look applied to the default UIKit. (That part’s just for fun — many of them are clearly ludicrous.)

Pinstripes

The original iPhone app treatment remains the current iPhone app treatment. Pinstripes. Back in 2007, compared to PalmOS, Windows Mobile, BlackBerry, and Symbian, the pale gray blue and subtle white line of iOS 1 (iPhone OS) worked. Or at least, people were all too busy playing with inertial scrolling and pinch-to-zoom to really pay attention to the color-scheme.

There were a few exceptions, like Notes with its yellow pad treatment, but most of the core iOS apps came into the world in pinstripes, and have worn them ever since.

The original iPhone pinstripe interface was introduced in 2007 and remains pretty much unchanged in 2012.

Felt

For the first few years, first-party Apple apps stuck to the default interface. iOS 4‘s Game Center, released in 2010 was one of the first major, notable exceptions. It was made to look like a Las Vegas gaming table complete with green, burgundy, and yellow felt with polished wood trim.

2010’s iOS 4 Game Center interface was meant to invoke the felt and wood of gaming tables.

Linen

With iOS 4, Apple introduced the linen texture as a metaphor for background or behind-the-scenes content, and aggressively expanded it in iOS 5 and OS X Lion. It was used in setup screens, for the fast app switcher dock, for folders, for Notification Center (breaking the background motif), and Siri. It wasn’t used in the same way as felt, as a skin over UIKit, but as a way of visually differentiating an alternate level of functionality.

When you saw linen, you knew you weren’t in an app any more.

(We originally developed the iMore app using the default UIKit, until Nickelfish’s Justin Marcucci suggested a linen based interface would be more modern.)

Apple started using linen in iOS 4 as a way to visually indicate features that existed in the background or otherwise outside of the main interface.

Wood

Alongside iOS 4, Apple released iBooks, which unlike the iTunes Store and App Store, needed to be downloaded separately. While it used the default interface for the store component, the built-in reader used a wooden shelf motif for the list view.

iOS 5’s Newsstand featured a a similar, fold-out version of that look.

The wood shelf interface of iBooks, released alongside iOS 4 in 2010, also had a flatter, non-glossy title bar.

Leather

2011’s Find my Friends, which like iBooks wasn’t included in the core OS but required a separate download from the app store. It took the stitched leather look, which Apple had already used in the iPad and iOS X Lion’s calendar and address book, to it’s fullest extreme.

Stitched leather, introduced in its most extreme form in 2011’s Find my iPhone app, is best used for comfort and to jazz up boring data driven apps.

Reminders, also introduced in iOS 5 in 2011, also wore leather, albeit less like comfy couch and more like an action-oriented jacket.

iOS 5’s built-in Reminders app also got dressed up in leather, but darker.

Silver

When Apple released the iPad in 2010 with iOS 3.2, they announced they’d re-written many of the core apps from scratch, including the above-mentioned leather-bound book looks. More than that, however, they dropped pinstripes from the get go. Instead, they went with a more subtle, more silver looks for the default apps.

Apple’s 2012 WWDC app brought this look to the iPhone as well, but with an even more subtle effect.

iOS 6

Apple has worked relentlessly over the years to make the iPhone and iPad all about the screen. Casing has been minimized, bands have been flattened, buttons have been moved behind the curves.

At the same time they’ve made apps more visually dynamic, using many of the aforementioned skeuomorphic designs. That’s for two reasons:

  1. To make apps appear friendlier to people for whom technology initially feels inaccessible.
  2. To make otherwise boring, data-driven apps more visually interesting.

As much as the mockups above were fun to render, Apple treats the default interface chrome more like casing than like content. The Settings app doesn’t need to be made more accessible or more visually interesting — it would distract rather than add to its experience.

There’s a common cliché associated with Apple design — 10:3:1. From a handful of concepts, one production version emerges. It’s probably no coincidence the WWDC app, and the leaks of the redesigned Maps app look like evolutions of the default interface first introduced with the iPad.

And personally, I think the iPhone would look great with a fresh coat of silver.

While OS X has had Appearances options for years — aqua or graphite, for example — it’s harder to see Apple doing that on iOS. Though they did once ship brushed metal…

Update 1: Since I started working on this late last night (photos don’t shop themselves!), both iDownloadBlog‘s Christian Zibreg and 9to5Mac‘s Mark Gurman have also reported hearing about interface refreshes to Apple’s core iOS apps. WWDC should be fun.

Update 2: Here’s a variant, inspired by Michael Steeber, with a darker background.

[imore]