Android UI pattern - Background process indicator

Pattern card

Problem

Many mobile apps either handle or show data that they have to fetch over a network connection. All long running tasks should be handled in background processes to avoid making user interface non-responsive. When the application runs these tasks the user should be aware that something is happening and they should also be allowed to cancel the tasks.

Solution

A background task indicator visually shows user that something is happening in the background. With any long running blocking process the UI should also indicate how the process can be cancelled.

Consequences 

1. User is aware that the app is doing something on the background
2. User knows how to cancel the task

Background task indicator implementations

There are multiple ways to implement the background task indicator. 

• Action bar
• Pop-up dialog
• Notification in status bar
• Contextual indicator
• On-screen notification

Indicator in Action Bar

Many apps use the Action Bar to provide manual refresh action button. That is also a good place to indicate the running process when user presses the button by changing the button into animated process indicator. 

This approach is suitable for tasks that refresh full data of the screen or the app. 

The same approach work on tablet UI. Plume app doesn't do it right though. It is better to indicate the process on the refresh button than in a separate location.

Contextual indicator

When the app is refreshing only a part of its UI it is much better to show the indicator in the container where the data will be loaded to.

Back button should interrupt the progress and take user back to the previous page.

Same approach works on tablets.

Sometimes multiple data sets are loaded on a single screen at the same time. Some apps show each of the data set processes separately in the context. 

Notification in status bar

Android status bar is meant to show progress of ongoing background processes. This is good way to go when the result is not used by the same application or if the task is likely take longer than few seconds the user likely to exit the app. This method should also be used when an process is launched automatically without user interaction, for example, an automatic sync.

Tapping the notification should always either cancel the operation (indicate this in the notification text) or take user to a screen where he or she can cancel it (dropbox fails to do this).

Toast

Indicating a long running background process with a simple toast is a good approach when the process isn't very important and it is unlikely that the user will wait for it to finish.

When using toast the operation will run in background and should not block user from doing anything with the app. This should never be used in long running blocking operations as user won't know how to cancel it.

On-screen notification
Some apps notify user by showing a message on the app UI. This approach is functionally very similar to using a toast but has a added benefit of being visible until the task is finished. This notification doesn't prevent users from continuing their task in the app,

This approach doesn't provide a clear way for the user to cancel the background process.

Evernote uses the Dashboard's bottom part to indicate running background process. 

When it is possible to know how long the background process will take it is a good idea to show the user that information.

Pop-up dialog

Pop-up dialog is an easy to implement way to indicate that user has to wait for something to be completed before he or she can continue.

Using pop-up dialog to indicate running task blocks the whole UI and prevents users from continuing with their tasks. Use of them should be considered carefully. 

Pressing back should always cancel this operation and close the pop-up.

If it is possible to know how long it takes to complete the process show the info to users.

Splash screen
Some times app needs to initialise its data before anything can be shown to users. It is better to show a process indicator than just a blank screen.

This approach should be considered carefully. A much better way would be to show a UI that is limited but partly functional. Only use this approach if absolutely necessary.

Beyond standard visualisations
Google Goggles has implemented a background process indicator that is entertaining and visually pleasing. The app displays an animation that looks like the phone is analysing the picture when in fact it is sending the image to a server and waiting for a reply.

Implementing background process indicator

Loaders API is the best way to load data on the background.

Another alternative is the AsyncTask.

Android APIs also has ready ProgressBar widget and ProgressDialog for implementing the visuals.

This article in Android developer documentation explains how to use status bar notifications.