When starting with a new mobile app, we come across a few empty state screens. It is a state where there is no content to be shown as yet, in situations like zero-data state and first-use state. Other times, an error screen can also be considered an empty state screen. Instead of leaving this space literally empty, designers have been using this free space for better user engagement with the use of clever illustrations.
As this collection will show you, zero data state is chock full of potential designers can take advantage of. From encouraging users to give their app a go, to providing short and useful tips on how to proceed further, empty state design is a space for creativity waiting to happen. Some of the designs here are concept designs while others are already in use.
Project Fi – What happens when something is no longer active? It needs to recharge with a nap (get it?). The other empty state design features an invitation to move this “party” to a desktop.
Musixmatch – Adorable colored faces interact with music, widgets and spotify alongside helpful instructions.
Google Photos – When nothing is shared here, a soda with two straws is shown to encourage users to start sharing.
Favorites – Empty state design falls back on what users are used to, usingthe star icon to indicate our favorites, the pencil icon to show questions asked, and the document icon to indicate questions answered.
Azendoo – Feel lost and unconnected, like you are on a deserted island? Follow the advice, keep calm, light a fire, and keep refreshing.
Traveloka – This travel app uses illustrations in their empty states to depict various statuses: a sleeping satellite/antenna shows lost connection, a ladder with no plane indicates no flight available, and an empty bench to show no hotels available.
Sketch – Let’s get something going! Let’s add some sketches with the plus button. Come on!
BitGold -The use of a darkened background to show emptiness, nothing has started yet and a center-stage gold action button seems very fitting for this money app.
Urban Looks – How better to encourage people to start uploading selfies and photos than to show another person doing it? Hence this adorable empty state design.
No Files Found – Well this zero data scenario feels awkward. Even the document file finds this awkward. Follow its instructions: go back and try another keyword.