„Empty states“ bieten einem Designer viele Möglichkeiten die User Experience, also das Erlebnis der Nutzung einer App zu verbessern. Es ist der Moment in der Nutzung eines Produkts, wo dem Nutzer kein Inhalt angezeigt wird – eine leere Seite also. Die leeren Seiten werden häufig gar nicht gestaltet und die Möglichkeiten bleiben ungenutzt. Eine verpasste Chance eine Interaktion mit deinem Nutzer einzugehen und eine positive Beziehung aufzubauen.
Die Meisten kennen solche leeren Seiten direkt nach der Installation einer App. Man folgt noch keinen anderen Accounts, hat nichts hochgeladen oder gespeichert. Das sind einige Beispiele wo wir Empty States finden können:
- Du nutzt eine In-App Suche und hast keinen Treffer
- Du installierst eine Social App und hast noch keine Kontakte.
- Du hast alle Aufgaben deiner To-Do-Liste erledigt.
- Du eröffnest einen Video-Chat-Raum und es ist noch niemand anderes da.
- Du legst einen neuen Ordner an und hast noch keine Dokumente oder Inhalte hochgeladen.
Für nicht so affine Nutzer ist die Funktionsweise einer Anwendung möglicherweise nicht so selbsterklärend, wie man selbst denkt. Eine leere Seite könnte auf sie wie eine Sackgasse wirken. Aussagen wie „Keine Ahnung, was ich hier tun soll.“ oder „Ich verstehe das Ganze nicht.“ höre ich nicht nur von meinen Großeltern.
Ich freue mich tatsächlich immer, wenn ich gut gestaltete „Empty states“ sehe. Ich weiß, dass am Ende eines Projekts oft die Ressourcen fehlen, um Prio 2 Aufgaben zu erledigen. Da leere Seiten nicht die Funktion beeinträchtigen und die App an sich komplett funktionstüchtig und gut gestaltet ist, fällt das oft hinten herunter. Ähnlich wie „easter eggs“ in Spielen ein Geschenk an den Spieler sind, können leere Seiten ein Geschenk an den Nutzer sein.
So nutzt du Empty States zur Verbesserung der User Experience
Leere Seiten bieten die Option dem Nutzer „persönlich“ zu begegnen. Du hast in dem Fall keine Inhalte zu zeigen, also kannst du etwas persönliches zeigen – einen Witz, eine schöne Illustration oder freundliche Ansprache.
“The right combination of words and visuals is the key to communicating with your users and helping them achieve their goals. So design teams should invest as much time, love and attention to designing the words as they do anything else on the interface.”
Ryan Cordell, Product designer at Deliveroo
Im Material Design System von Google gibt es Beispiele für gute Gestaltungsprinzipien der empty states. Das sind keine Beispiele für die beste Gestaltung, aber sie zeigen gut welche Möglichkeiten sich als nützlich erwiesen haben.
Formuliere eine nützliche Nachricht.
Du hast die Chance einen Satz zu schreiben, um deinen Nutzer anzusprechen. Setze diesen Satz sinnvoll ein und unterstütze den Nutzer mit einem Hinweis, Tipp oder einer Inspiration. Ermutige ihn die Funktion zu nutzen, zeige ihm den Web raus aus der vermeintlichen Sackgasse.
Erkläre, warum die Seite leer ist.
Eine leere Seite ohne Erklärung kann wie ein Systemfehler aussehen. Eine Erklärung, warum die Seite leer ist, gibt dem Nutzer die Gewissheit, dass alles funktioniert. Gut aufbereitet, führt schon eine neutrale Aussage zu einer besseren User Experience.
Unterstütze bei der Suche.
Der so genannte „Best match“ bewahrt Nutzer ganz häufig vor einer leeren Seite. Wo normalerweise schon ein Tippfehler im Namen zu einer leeren Seite führen würde, kann der Nutzer schon bei der Suche selbst unterstützt werden. Eine gut funktionierende Autokorrektur und Suchvorschläge vereinfachen die Suche erheblich. Es spart Zeit beim Tippen und hilft, wenn man sich in bei der richtigen Schreibweise nicht ganz sicher ist.
Starte mit Inhalten.
Als Nutzer einer neuen App weiß man manchmal nicht genau, wie man den besten Einstieg findet. Starter Content ist eine gute Möglichkeit diesen Einstieg zu vereinfachen. Spotify und Netflix haben diese Herangehensweise perfektioniert. Es wird Musik passend zur Tageszeit vorgeschlagen oder es erscheinen neue Filme, die zu den Vorlieben passen direkt auf der Startseite. Der Nutzer muss nicht jedes mal mit einem leeren Suchfeld starten, sondern kann bei jedem Öffnen der App etwas Neues entdecken.
Eine authentische Ansprache ist wichtig für die User Experience
Eine authentische Ansprache ist wie die passenden Gewürze in deinem Lieblingsgericht. Es geht auch, wenn etwas fehlt, aber dein Gericht wird erst richtig rund, wenn die alle Komponenten gut auf einander abgestimmt sind – mögen sie noch so klein sein. Die Website emptystat.es zeigt einige Beispiele, jedoch sind diese vom Stil sehr ähnlich.
Sprich im Einklang mit deiner Marke.
Die gewählte Ansprache sollte immer zu deiner Marke, zu deiner Brand-Voice passen. Zeigst du auf deiner Website Menschen in Turnschuhen und sprichst sie in einer lockeren Sprache an, dann solltest du sie in deiner App auch dutzen. Schau dir deine Zielgruppe an und wähle einen Ton und eine visuelle Sprache, die im Einklang mit deiner Marke steht.
Wähle einen neutralen oder persönlichen Ton.
Die Wahl des richtiges Tons wirkt vielleicht banal, aber es ist wichtig gut verständliche Formulierungen zu wählen. Ein komplizierter Witz, Ironie oder ähnliches können zu weiterer Verwirrung führen. Eine klare Botschaft in einem neutralen oder persönlichem Ton kommt mit Sicherheit gut an.
Empty States bieten quasi unendliche Möglichkeiten die User Experience zu verbessern. Sie können eine kleine Spielwiese für den Designer sein und ein Geschenk für den Nutzer. Macht was aus dieser Chance. Baut durch diese Zwischentöne eine persönliche Verbindung auf.
