UX Designer’s Notes: Designing For the Empty States
Anna Iurchenko, UX Designer at Stanfy, a mobile design and development studio based in San Francisco.
There are three main situations in which users of your application could see an empty screen or an empty state:
- First-time usage when there is no data we can show to a new user (ex.: empty timeline)
- Clear state (ex.: empty inbox, list with no items)
- Errors (ex.: no internet connection)
For a good design each empty state is an opportunity to avoid users 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 we’ve designed recently at Stanfy. 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.
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.
Inspiration
You can find a lot of smartly designed empty states to spark your imagination here:
If you are a visual thinker like me you may like my Hand Drawn Design Tips — weekly 1 min read newsletter on product design.
This post was originally published on Stanfy blog. At Stanfy we create apps for mobile, IoT and wearables so come to talk to us if you want to build one.
