Saturday 10 December 2011

Quick UI Tip - Avoid Popups


Does anyone still remember when Internet advertising was in it's most annoying. That was when browsers hadn't yet have evolved to protect their users from over eager and intrusive advertisers and web page editors. The most obnoxious form of ads was the popup. While the user was reading an online article or writing a comment to an online forums all the sudden a popup appears and blocks whatever the user was doing. The reason what made the popups so annoying was that they nearly always interrupted the user. It was like having an interesting conversation with someone and suddenly a stranger jumps in between you and yells at you to give him money.

Lately the same trend has started to show in Android apps. Although the popups very rarely are advertisements they still are nearly as annoying. Two new trends in Android apps have became unfortunately common. The app is either asking users to rate it on Android Market or telling users that they should either install or setup a companion widget. If you want to get a good review this is the worst way to try to get them. Intrusive popup always interrupts user's task and is very likely to annoy them. That is not when you want to ask them to give starts to your app!
I would go as far as saying that never use popups. Never show a loading popup. Never show an error popup. Never show a question dialog asking user to OK or Cancel.

Of course, in real life there are situations where popups are very difficult to avoid. If your app runs into an unexpected situation where it simply cannot continue without user input use of dialogs is probably OK. 

What I'm trying to say is that use of dialogs should always be the last choice. If you think carefully there are not that many situations where they are absolutely necessary. 


Progress Dialogs
Loading popups are usually shown when the app is loading something over the network. This operation can take some time and it is always good to let users know that something is happening on the background.

But is it necessary to block user from using the app? Cases where users absolutely can't proceed are very few. First choice should always be an on screen indicator and letting users get on with their tasks.  










Rate me! and Install me! Dialogs
It is understandable that devs want their apps to be rated on Android Market. Using popups id the wrong way to go about it though. Consider using a subtle on-screen reminder instead. That way users won't be interrupted and are more likely to be on a good mood when they rate your app.

Some apps have tried to avoid interrupting the users and showing popups immediately when the app starts. This train of thought is very easily refuted though. A user starts his or her task before they launch your app. Take Evernote for example. I remember something I want to write down. To do that I tap the Evernote icon on my home screen. Bam! "Want to install a widget?"





Error Dialogs
Errors, especially network errors, happen. Sometimes they are critical and there's not much developer can do other than tell user and terminate what user was doing. But often there are other ways to notify user that something is wrong. Especially when the error isn't directly related to what user is doing try to avoid poping up an error dialog. If a background sync doesn't work just make the app try again later and maybe add an icon to the refresh button informing user about that.

Read it later app pops up an error whenever it fails to reach the server to check if there are new articles to download. It does it even when user is reading an article that he or she has already cached locally. I use the app often in Munich U-Bahn where network is cutting off regularly and the app keeps telling me about it and interrupting my reading. Very annoying! 


Other Dialogs
This must be the most annoying breed of popups. These two examples are from a paid app. It bugs users with news letter subscription (someone still uses newsletters?) and even pops up a full screen advertisement for another app of the same developer. If I just paid for their app I don't expect to be bothered by this short of things. Never do this!



Conclusion
Try to see dialogs and popups as the last resort. Whenever you use them they are most likely going to interrupt your user's workflow and make your app appear less friendly. Often it is possible to avoid them with on-screen indicators that won't have the same problem of interrupting users.



6 comments:

  1. Good post Juhani. Trying to understand the reasoning behind popup dialogs in Android (and in other platforms, why not), the only answer I find is that we developers don't want to waste precious screen real state to show a one-time message, like an error. Specially because we have the bad habit of designing interfaces with a perfect workflow in mind. When errors arise, we just don't want to touch our "perfect" designs to accomodate them. Hence the use of popups

    ReplyDelete
  2. I would add this:

    Almost all progress dialogs doing a lengthy operation should be made cancellable. There's nothing more annoying than when you cannot cancel a long running operation. But most developpers sucks at proper and systematic cancelability (because it is not always easy).
    All I/O Network operation should be cancellable. Period.

    Progress dialogs can often be put in the top action bar if the app has one. This is less intrusive than a full blown in your face dialog. This can be a problem for cancelability of the task.

    ReplyDelete
  3. Wow - It's pretty bold to ban popups, but I must say I love the idea. First it sounded like a crazy utopia idea impossible to live up to - but when reading the post and thinking about it -I'm getting convinced this could very much be possible. At least 90% of all popups could be replaced with notifications, icons or menu choices. Great post

    ReplyDelete
  4. Great post indeed. I've bought most of these apps recently on the market and they do disrupt your experience with these UI flaws. I've heard once that a good UI is a UI where the user doesn't notice that he's even using an UI. These pop ups completely break that!

    ReplyDelete
  5. Totally agree with this article to avoid popup. It also gives an issue of "WindowLeaked" exception. So its better we use ProgressBar so that we need to show/dismiss it, instead we just have to make it visible/hide. Its really easy task.

    ReplyDelete
  6. Hi Juhani, nice post, pretty much agree with all your point, with one exception :

    There are dialogs that are result of a user request - Date / Time picker comes to mind, although this is not the best example of good UI design.

    Such dialogs on top of existing functionality are specially useful when you try to convert phone application based on separate activities / windows to tablet app. Not all the functionality, that makes sense on phone in full screen looks good on much bigger screen of the tablet.

    Sometimes it is not possible to to put such content into just a part of screen - it just doesn't make logical sense.

    In such case, a dialog that occupies just a part of the screen and thus allows to reuse existing layout might be the best option. The underlying content beneath the dialog gives kind of context, which is nice extra feature.

    We used this approach in our last Honeycomb application and there are few cases where dialogs turned out to be the best option.

    ReplyDelete