So how many options are there exactly? Let’s limit ourselves to the US. And AT&T, MetroPCS, T-Mobile and Verizon. And I won’t show all the options of colors.

Take your pick.

And I can relate: when I am abroad, with my three email accounts, whenever I open Mail on my iPhone, I have to dismiss three ‘data roaming is off’ dialogs, and three ‘cannot get mail’ dialogs ( — that’s one per mail account). On an iPad, it can be even more jarring, with a tiny alert disabling the whole 9.7″ screen until you act on it.

This is a real issue. I have no doubt Apple is aware of this, like they were aware of copy and paste and multi-tasking.

This is not a post about what Apple will or should do to improve notifications on iOS. It’s a post talking about what solutions other platforms currently use to notify the user, and why Apple is (possibly, probably) taking such a while to create an optimal solution to the notification problem.

The biggest current smartphone OS, Android, has a well-known approach to notifications. They gather in the status bar, a never-hiding, tap / swipe-able interface element at the top* of the screen that slides down to cover the entire UI when invoked. When notifications come in, icons gather in the bar. Note that these icons gather at the left, while system status icons illustrating current battery life, signal strength, 3G status, Wi-Fi status, time, location services status and more gather at the right. As you can probably tell by that line-up of status items, it doesn’t take a lot of notifications on Android to fill up the entire top bar.

Most casual users I know solve this by either sliding the status bar down and using the ‘Clear All’ function to get rid of the unmanageable and opaque mess of icons or manage all the notifications as they come in, so they don’t miss anything important when it does pop up between the others.

Notifications have interesting design consideration you have to take into account: priority. For instance, Android attaches equal UI importance to a notification telling the user that the phone is connected through USB, that there’s new mail, and that there’s one missed call. They all get the same sized icon in the top bar. Only very rarely does Android throw a modal dialog on screen demanding action, like iOS does for most of its notifications.

You could say Android’s solution to all that incoming information is to throw them into a big junk drawer. Organized people will no doubt create a system around the drawer and find all their stuff in it, but why put that burden on the user? I don’t want to manage the information flow — it’s a smartphone, right?

What about webOS? I’ve seen a lot of arguments in online discussions that webOS is about as good a solution for notifications as Android. I disagree. webOS handles notifications in a far more clever way.

To illustrate that, let’s grab a smartphone. Anything the size between a tiny Palm Pre or a huge HTC EVO 4G will do. Hold it in your left or right hand, and tap the bottom of the screen with your thumb. No effort, right? Now tap the top of the screen. See how much more effort that takes? I’ve got pretty big hands, and tapping the status bar of my iPhone 4 forces me to stretch my thumb. Fortunately, I never have to tap the status bar unless I want to scroll to the top of a long content view.

For exactly this reason, and the aforementioned ‘clutter bar’ of Android, webOS cleverly puts notifications at the bottom. In mobile UI design, it’s often recommended to put the most accessed controls at the bottom. In fact, it’s in the iOS HIG. As a notification comes in, webOS shrinks the screen a little bit, shows you some of its content with an icon and then puts a little icon at the bottom of the screen. You tap it, and it shows the notification content, allowing you to act on it, ignore it, or swipe it out of view. This doesn’t just prevent you from stretching fingers, it doesn’t clutter the webOS status bar with icons that tell you little to none about the device’s status. With some stretching, you can still swipe down on the status bar to reveal a quick menu that lets you enable / disable Wi-Fi and other system actions.

I’d say webOS has one of the most elegant systems for notifications on the market today, even compared to desktop OSes. Even when the notification ‘tray’ fills up with a lot of Facebook, Gowalla, Twitter, SMS, low battery and USB mode alerts, it’s a manageable mess.

Let’s look at the video I referred to at the beginning of my post again. When notifications come in, they literally cover the screen. Is there a control below the notification? Tough luck. Act on it now, or lose that part of your screen. It’s not shown, but if it scales like I think it does, it will simply fill your entire screen with three to four notifications. Going back to my example of Mail on iOS, that would mean I have to do more than tapping “Okay” six times to get back to interacting with my phone. How is this “iOS Notifications done right”?

I’ll keep looking forward to what the talented design teams at Apple are doing to tackle the hard-as-nails problem of notifications.

My views are my own and not those of Apple Inc. I do not have access to information on upcoming designs or interface conventions of iOS or other aspects of Apple products. All content of this blog post is uninformed speculation and opinion, attributable to my own person only.

Download it here. I cannot be held responsible for inaccuracies, flaws and errors in this this PSD I might have overlooked, but if you notice anything please let me know in the comments.

iPhone, iPhone 4 and iPad PSD icon template – 303 KB

Again, if you appreciate it, tweet this to help your fellow designers and developers make nicer icons for iPhone 4 (and beyond).

Like several other FTP clients, Interarchy has always been known and discerned by its icon. By now, it’s a powerful brand. Matthew also expressed his desire to maintain the filing cabinet metaphor in the application icon, and I agreed. Changing the icon now would mean neglecting its long history and evolution.

While I am not a huge fan of outspoken themes in icons for an application, the stylistic direction Matthew envisioned of aluminium / silver, black, and perhaps subtle desaturated colors summoned beautiful visions of icons in my head. I think this could be a great theme: not too outspoken like icons that are bright blue and black, but a subtle kind of consistency that gives the icons an extra quality when used together.

It’s also the set of colors and materials we consider typical of Apple’s latest generation of hardware. This makes the icons appear very modern and advanced, very much in line with what we wanted to represent with the Interarchy icons. Interarchy is a powerful and feature-rich application, and making the icons beautiful, but also appealing to the target user base is a great bonus.

I won’t bore you too much with the process of all the icons, but some of the concepts of the application icon are interesting to see. I did mockups of a thin-edge ‘full black’ cabinet and a pure aluminium one. And how about a cabinet resembling a Mac Pro?

In the end we settled with the current, beautiful yet unassuming icon for the application, and with a few revisions and emails back and forth we arrived at an equally satisfying set of supporting icons for the application itself. Matthew was awesome to work with, and we were both very happy with how the icons turned out. You can see the full set a bit larger on the Nolobe Blog here.

By the way, Nolobe (makers of Interarchy) are having an awesome Fire Sale right now, which is worth checking out.

I happily started working for them to make a kick-ass icon. There was an additional challenge as multiple icons were required: a Mac icon, a menubar icon, and an iPhone icon, which required a metaphorical connection between all of them. Buck mentioned they had an idea for using a doghouse for the Mac app and a dog with files on the iPhone, but I recommended against using animal motifs. Not only do we have the classic divide between ‘dog people’ and ‘cat people’ to worry about; animal motifs are just not very suitable in iPhone icons.

And thus the conceptual phase began, which we kicked off with a bunch of sketches of various possible designs and metaphors that could work in the menubar, on an OS X disk image and on the iPhone. I wanted to focus primarily on the iPhone icon design, though, as this was the selling point of the application in the App Store.

Some of the concepts for the iPhone icon.

In the end, we settled for the companion necklace metaphor. Some of the other concepts were nice, but didn’t communicate the application purpose as nicely or had so much branding value. Now the challenge was to extend the concept and develop it further so it could be expressed in a consistent way in all three usage scenarios.

The iPhone icon was mocked up with actual shape layers, and sent to Buck for review. Buck loved it, so I proceeded to iteratively develop it into the final icon.

Above is the full iconparison™ of the first mockup to the last proposed final version. It went through quite a few revisions until we arrived at the final version, with all its nice details that are invisible in the revision history image. The little silver beads on the necklace, for instance, reflect the pillow and pendants accordingly depending on their position in the icon. They were all hand-drawn in Photoshop, though I occasionally did a quick 3D render to check if it was all ‘right’.

I completed the menubar and Mac icon, just in time for the release of the app. Buck did a kick-ass job on the website, using some parts from the iPhone icon’s PSD to make an awesome consistent branded look.

Here File File is available from the App Store, and while biased, I recommend getting it. It’s one of those things that can save your ass when you’re out and forgot a file.