{"id":25629,"date":"2016-02-18T23:01:31","date_gmt":"2016-02-18T15:01:31","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=25629"},"modified":"2022-10-16T18:28:29","modified_gmt":"2022-10-16T10:28:29","slug":"mobile-app-empty-state-designs","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/","title":{"rendered":"40 Clever Empty State Designs for Mobile Apps"},"content":{"rendered":"<p>When starting with a new mobile app, we come across a few empty state screens. It is a state where <strong>there is no content to be shown as yet<\/strong>, in situations like <strong>zero-data state <\/strong>and<strong> first-use state<\/strong>. Other times, an <strong>error screen<\/strong> 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 <a href=\"https:\/\/www.hongkiat.com\/blog\/designs-with-pun\/\">clever illustrations<\/a>.<\/p>\n<p>As this collection will show you, zero data state is chock full of potential designers can take advantage of. From <strong>encouraging users to give their app a go<\/strong>, to providing <strong>short and useful tips<\/strong> 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.<\/p>\n<p><strong>More on mobile design:<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.hongkiat.com\/blog\/designing-for-mobile-devices\/\">Designing for Mobile Devices [A Guide]<\/a><\/li>\n<li><a href=\"https:\/\/www.hongkiat.com\/blog\/mobile-app-ui\/\">20 Beautiful Mobile User Interface For Your Inspiration<\/a><\/li>\n<li><a href=\"https:\/\/www.hongkiat.com\/blog\/mobile-calendar-designs\/\">20 Eye-Catching Mobile Calendar Designs<\/a><\/li>\n<li><a href=\"https:\/\/www.hongkiat.com\/blog\/music-app-mobile-designs\/\">Music Apps for Mobile: 50 Beautiful Concept Designs<\/a><\/li>\n<\/ul>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2473890-On-boarding-Empty-State\">On-Boarding<\/a> \u2013 Empty states for Friends List, Navigation and Messages section.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2473890-On-boarding-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2372373-Empty-State-interface\">Lost & Empty<\/a> \u2013 Cute but sad robots notify a user when the signal is lost or a cart is empty.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2372373-Empty-State-interface\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/2-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2415019-Modspot-empty-state\">Modspot<\/a> \u2013 This empty state design serves as a first step, how-to tutorial.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2415019-Modspot-empty-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/3-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2479271-Workmates-Empty-States\">Workmates<\/a> \u2013 Animals greet you at individual sections with cute hi\u2019s and hello\u2019s.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2479271-Workmates-Empty-States\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/4-empty-state-mobile-app-designs.gif\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2456281-Empty-State\">Mobile Payment Method<\/a> \u2013 \"No cash? No problem!\" \u2013 the perfect tagline for cashless payment.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2456281-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/5-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2244136-Zipline-Empty-State\">No Conversations<\/a> \u2013 Life\u2019s a bore without conversations. Take a nap.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2244136-Zipline-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/6-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2462474-Driver-Apps\">Driver app<\/a> \u2013 No orders versus new, incoming order. The app also reminds the drivers to check to see if their availability is set on.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2462474-Driver-Apps\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/7-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/1439981-Marvel-iPhone-app-Projects-page-Empty-state\">Marvel Projects App<\/a> \u2013 The funny folder looks sad without projects.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/1439981-Marvel-iPhone-app-Projects-page-Empty-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/8-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2486702-Yuhuu-Online-Car-Rental\">Yuhuu Car Rental App<\/a> \u2013 The onboarding screen is great for teaching users how to start renting cars.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2486702-Yuhuu-Online-Car-Rental\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/9-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2183773-Project-Fi-Sweet-Dreams\">Project Fi<\/a> \u2013 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.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2183773-Project-Fi-Sweet-Dreams\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/10-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"467\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2478072-Empty-state\">Musixmatch<\/a> \u2013 Adorable colored faces interact with music, widgets and spotify alongside helpful instructions.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2478072-Empty-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/11-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/emptystat.es\/post\/120438123153\/nothing-shared-in-google-photos-on-iphone\" rel=\"nofollow\">Google Photos<\/a> \u2013 When nothing is shared here, a soda with two straws is shown to encourage users to start sharing.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/emptystat.es\/post\/120438123153\/nothing-shared-in-google-photos-on-iphone\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/12-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"1136\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2461528-Empty-State-Design\">Favorites<\/a> \u2013 Empty state design falls back on what users are used to, using the star icon to indicate our favorites, the pencil icon to show questions asked, and the document icon to indicate questions answered.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2461528-Empty-State-Design\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/13-empty-state-mobile-app-designs.gif\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p>Azendoo \u2013 Feel lost and unconnected, like you are on a deserted island? Follow the advice, keep calm, light a fire, and keep refreshing.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/emptystat.es\/post\/134919332373\/no-connection-in-azendoo-companion-for-ios\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/14-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"1245\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2419464-Empty-state-illustration-mobile-web\">Traveloka<\/a> \u2013 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.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2419464-Empty-state-illustration-mobile-web\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/15-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/1738412-Project-empty-state\">Sketch<\/a> \u2013 Let\u2019s get something going! Let\u2019s add some sketches with the plus button. Come on!<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/1738412-Project-empty-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/16-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2241130-BitGold-Mobile-App-Empty-States\">BitGold<\/a> -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.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2241130-BitGold-Mobile-App-Empty-States\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/17-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2313826-Urban-Looks-Walkthrough\">Urban Looks<\/a> \u2013 How better to encourage people to start uploading selfies and photos than to show another person doing it? Hence this adorable empty state design.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2313826-Urban-Looks-Walkthrough\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/18-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2518773-Empty-State\">No Files Found<\/a> \u2013 Well this zero data scenario feels awkward. Even the document file finds this awkward. Follow its instructions: go back and try another keyword.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2518773-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/19-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/1324219-Sad-Folder-is-sad\">Sad Folder is Sad<\/a> \u2013 Stop making all these folders sad, start creating new projects.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/1324219-Sad-Folder-is-sad\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/20-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2463678-Empty-State-Snippet\">Trip Planner<\/a> \u2013 If you have no trips planned yet, just know that the night sky will be waiting.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2463678-Empty-State-Snippet\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/21-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2506342-Discover-empty-state\">Lighthouse<\/a> \u2013 This zero data state displays an error using a lone lighthouse.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2506342-Discover-empty-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/22-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p>Group Chat \u2013 Part of the onboarding process, this design illustrates an active group chat with lots of messages, something like a \"what this could be\" if you would just start chatting.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2463492-Onboarding\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/23-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2448078-Trip-Planner-Empty-State\">Trip Planner<\/a> \u2013 This one features a plane in mid-flight. No elective trips yet? Well, let\u2019s change that, shall we?<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2448078-Trip-Planner-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/24-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2096264-Empty-states\">Frizzbee<\/a> \u2013 Here\u2019s a clever use of the brand mascot in empty state designs. This is an idea that will surely take off.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2096264-Empty-states\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/25-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2322370-Virtual-Pizza-welcome-state\">Virtual Pizza<\/a> \u2013 The zero data state encourage you to create a virtual pizza to order a real one. A simple yet minimalistic illustration of a pizza used here.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2322370-Virtual-Pizza-welcome-state\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/26-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/1539737-Empty-state-screen-PandaDoc-for-iPhone\">PandaDoc<\/a> \u2013 You can never go wrong by using cute pandas to break bad news.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/1539737-Empty-state-screen-PandaDoc-for-iPhone\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/27-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2404165-Seek-Empty-Chat\">Seek<\/a> \u2013 No matches yet, but keep looking. Here, take these binoculars.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2404165-Seek-Empty-Chat\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/28-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/www.behance.net\/gallery\/28710291\/Lets-see-the-world-together\" rel=\"nofollow\">Travel app<\/a> \u2013 This one is ambitious. It shows a rocket and suitcase for an out-of-this-world travel experience. See the world together.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/www.behance.net\/gallery\/28710291\/Lets-see-the-world-together\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/29-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/www.behance.net\/gallery\/33103839\/A360-Empty-State\" rel=\"nofollow\">A360<\/a> \u2013 It\u2019s clear that this app is focused on some real estate properties.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/www.behance.net\/gallery\/33103839\/A360-Empty-State\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/30-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2264802-Empty-states\">Invoice app<\/a> \u2013 The two-color illustrations here tells it all, from getting quick access to your data, checking your sales performance, and having all your clients in the palm of your hand.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2264802-Empty-states\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/31-empty-state-mobile-app-designs.gif\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2032655-No-Appointments\">Whittl<\/a> \u2013 Don\u2019t make this funny face sad, make an appointment. The hair of sad face is twirled similar to the brand logo \u2013 a clever touch.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2032655-No-Appointments\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/32-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a rel=\"nofollow\" href=\"https:\/\/dribbble.com\/shots\/2477417-Empty-state-illustrations\">Social app for truck drivers<\/a> \u2013 The \"No parking places found\" illustration asks you to keep driving while a loss in Internet connection shows a blockade.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2477417-Empty-state-illustrations\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/33-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2385954-Empty-State\">My Leads<\/a> \u2013 Adding your first lead is like to launching a rocket into space.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2385954-Empty-State\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/34-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/emptystat.es\/post\/133401349375\/inbox-zero-in-unrollme-submitted-by\" rel=\"nofollow\">Unroll.me<\/a> \u2013 \"Welcome to your tidy inbox!\"<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/emptystat.es\/post\/133401349375\/inbox-zero-in-unrollme-submitted-by\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/35-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"1245\"><\/a><\/figure>\n<p><a href=\"https:\/\/emptystat.es\/post\/132471572026\/no-stories-in-snapchat-for-android\" rel=\"nofollow\">Snapchat<\/a> \u2013 It\u2019s a party on a Snapchat screen. You need friends to get great stories.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/emptystat.es\/post\/132471572026\/no-stories-in-snapchat-for-android\" rel=\"noopener nofollow\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/36-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"1244\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2016814-Favourites-Retailer-Empty-Data\">Workangel<\/a> \u2013 Save all your favorite (hence the hearts) retailers into this folder right here.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2016814-Favourites-Retailer-Empty-Data\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/37-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/1731040-Empty-state-for-iPhoncce-6\">My Projects<\/a> \u2013 Excited folder is excited to know what your first prototyping project will be about.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/1731040-Empty-state-for-iPhoncce-6\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/38-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2494061-Signature-app-empty-space\">Signature app<\/a> \u2013 This pokes fun at a blank doc and a captured one (smile for the camera).<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2494061-Signature-app-empty-space\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/39-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>\n<p><a href=\"https:\/\/dribbble.com\/shots\/2319249-Empty-States-Illustrations\">Kickpush<\/a> \u2013 Adorable renditions of popular movies and iconic scenes. Great use of empty state design by this movie app.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/dribbble.com\/shots\/2319249-Empty-States-Illustrations\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/40-empty-state-mobile-app-designs.jpg\" width=\"700\" height=\"525\"><\/a><\/figure>","protected":false},"excerpt":{"rendered":"<p>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&hellip;<\/p>\n","protected":false},"author":124,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3395],"tags":[4646],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.6) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>40 Clever Empty State Designs for Mobile Apps - Hongkiat<\/title>\n<meta name=\"description\" content=\"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\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"40 Clever Empty State Designs for Mobile Apps\" \/>\n<meta property=\"og:description\" content=\"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\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2016-02-18T15:01:31+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-10-16T10:28:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg\" \/>\n<meta name=\"author\" content=\"Nancy Young\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nancy Young\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/\"},\"author\":{\"name\":\"Nancy Young\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/943d20daf5b8c7638175cba309ef6e32\"},\"headline\":\"40 Clever Empty State Designs for Mobile Apps\",\"datePublished\":\"2016-02-18T15:01:31+00:00\",\"dateModified\":\"2022-10-16T10:28:29+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/\"},\"wordCount\":1006,\"commentCount\":11,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/mobile-app-empty-state-designs\\\/1-empty-state-mobile-app-designs.jpg\",\"keywords\":[\"Mobile Website Design &amp; Dev\"],\"articleSection\":[\"UI\\\/UX\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/\",\"name\":\"40 Clever Empty State Designs for Mobile Apps - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/mobile-app-empty-state-designs\\\/1-empty-state-mobile-app-designs.jpg\",\"datePublished\":\"2016-02-18T15:01:31+00:00\",\"dateModified\":\"2022-10-16T10:28:29+00:00\",\"description\":\"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\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/mobile-app-empty-state-designs\\\/1-empty-state-mobile-app-designs.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/mobile-app-empty-state-designs\\\/1-empty-state-mobile-app-designs.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/mobile-app-empty-state-designs\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"40 Clever Empty State Designs for Mobile Apps\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/943d20daf5b8c7638175cba309ef6e32\",\"name\":\"Nancy Young\",\"description\":\"Nancy has over seven years of experience in writing for different online mediums. Her expertise lies in creating inspirational articles with beautiful images.\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/nancy_young\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"40 Clever Empty State Designs for Mobile Apps - Hongkiat","description":"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","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/","og_locale":"en_US","og_type":"article","og_title":"40 Clever Empty State Designs for Mobile Apps","og_description":"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","og_url":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2016-02-18T15:01:31+00:00","article_modified_time":"2022-10-16T10:28:29+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg","type":"","width":"","height":""}],"author":"Nancy Young","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Nancy Young","Est. reading time":"13 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/"},"author":{"name":"Nancy Young","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/943d20daf5b8c7638175cba309ef6e32"},"headline":"40 Clever Empty State Designs for Mobile Apps","datePublished":"2016-02-18T15:01:31+00:00","dateModified":"2022-10-16T10:28:29+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/"},"wordCount":1006,"commentCount":11,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg","keywords":["Mobile Website Design &amp; Dev"],"articleSection":["UI\/UX"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/","url":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/","name":"40 Clever Empty State Designs for Mobile Apps - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg","datePublished":"2016-02-18T15:01:31+00:00","dateModified":"2022-10-16T10:28:29+00:00","description":"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","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/mobile-app-empty-state-designs\/1-empty-state-mobile-app-designs.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/mobile-app-empty-state-designs\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"40 Clever Empty State Designs for Mobile Apps"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/943d20daf5b8c7638175cba309ef6e32","name":"Nancy Young","description":"Nancy has over seven years of experience in writing for different online mediums. Her expertise lies in creating inspirational articles with beautiful images.","url":"https:\/\/www.hongkiat.com\/blog\/author\/nancy_young\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-6Fn","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/25629","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/124"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=25629"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/25629\/revisions"}],"predecessor-version":[{"id":62908,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/25629\/revisions\/62908"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=25629"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=25629"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=25629"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=25629"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}