Back

UX Designer’s Notes: Designing For the Empty States

Designing for the empty states

There are three main situations in which users of your application could see an empty screen or an empty state:

  1. First-time usage when there is no data we can show to a new user (ex.: empty timeline)
  2. Clear state (ex.: empty inbox, list with no items)
  3. Errors (ex.: no internet connection)

For a good designer, each of these situations is an opportunity to avoid users frustration or confusion and help them get what they want.

As designers we should carefully think of all cases in which users will see nothing and give them clear answers to these questions:

  • What is this screen for?
  • Why are they seeing it?
  • How can they fix a problem?

These are the absolute minimum that your empty state should communicate to a user.

On top of that you can use empty screens to show an app’s personality and make your users happy and let them enjoy using it.

Examples

I want to share with you, as examples of such empty states, several screens from one of the apps I’ve designed recently. Yell Afisha is an iPhone app that allows you to quickly find interesting things to do and to see where your Facebook friends are going.

emptystate-yell-afisha-1-txt

emptystate-yell-afisha-2-txt

One more example from our apps. This is a cute animated sun from the Transplant Hero iPhone app that users will see when there are no medications scheduled for today.

sun-on-screen-600

Give it a try. It only takes a click to unsubscribe.

Inspiration

You can find a lot of smartly designed empty states to spark your imagination here:


Read more:

Need help with application design?

talk to stanfy team2

 

December 18, 2015

app designDesignmobile app design