Leerer Zustand (englisch: Empty State) bezeichnet den Systemzustand eines digitalen Produkts, in dem noch kein Inhalt vorhanden ist – etwa beim ersten App-Start, nach einer leeren Suche oder nach dem Löschen aller Elemente.
Rubrik: Mediendesign & Digitale Medien · Unterrubrik: UX Writing & Content Design · Niveau: Einsteiger Synonyme / Auch bekannt als: Empty State, Leerzustand, Null-Zustand, Zero Data View
Was ist ein Leerer Zustand?
Leere Zustände sind unvermeidlich: Jeder Nutzer erlebt sie beim ersten Besuch einer App, nach einer erfolglosen Suche oder nachdem er alle Elemente gelöscht hat. Wie ein Produkt diesen Moment gestaltet, ist entscheidend für den ersten Eindruck und die Nutzerbindung.
Ein schlecht gestalteter Empty State hinterlässt Nutzer verwirrt und ohne Orientierung. Ein gut gestalteter Empty State erklärt die Situation, motiviert zur Aktion und zeigt, was möglich ist – er ist ein verstecktes Onboarding-Tool.
Erklärung
Die drei Typen von Empty States
1. First-Use Empty State (Erstbenutzung) Der Nutzer öffnet das Produkt zum ersten Mal und sieht noch keinen Inhalt. Dies ist eine Onboarding-Chance: Der Text erklärt, was hier passiert, und führt den Nutzer zur ersten Aktion.
Beispiel: Eine leere To-do-App beim ersten Start → „Deine Aufgaben erscheinen hier. Erstelle jetzt deine erste Aufgabe."
2. Search / Filter Empty State (Keine Ergebnisse) Eine Suche oder Filterung liefert keine Treffer. Das kann frustrierend sein – der Text hilft, das Problem zu lösen.
Beispiel: „Keine Ergebnisse für ‚Marketingplan'. Prüfe die Schreibweise oder suche mit anderen Begriffen."
3. User-Cleared Empty State (Alles gelöscht) Der Nutzer hat alle Inhalte gelöscht oder archiviert. Hier braucht es keinen Erklärungstext, eher eine kurze Bestätigung und den Weg zurück.
Beispiel: „Posteingang leer – du bist auf dem neuesten Stand." (Gmail-Variante)
Die Elemente eines guten Empty State
Text (obligatorisch):
- Erklärt den Zustand in einem Satz
- Nennt die nächste mögliche Aktion
- Bleibt im Tone of Voice für digitale Produkte des Produkts
CTA (fast immer sinnvoll):
- Ein klarer Button oder Link zur nächsten Aktion
- Verb-first formuliert (vgl. Button-Beschriftung)
- Nicht optional bei First-Use Empty States
Illustration (optional):
- Unterstützt den emotionalen Ton
- Sollte nie der einzige Kommunikationsträger sein
- Muss barrierefrei mit Alt-Text versehen sein (vgl. Barrierefreie Texte)
Beispiele
Schlechter Empty State:
(Weißer Bereich mit keinem Text)
Der Nutzer weiß nicht, ob die App geladen hat, ob etwas fehlt oder ob er etwas falsch gemacht hat.
Generischer Empty State:
„Noch keine Daten vorhanden."
Korrekt, aber nicht hilfreich und ohne Handlungsaufforderung.
Guter Empty State (First-Use):
„Noch keine Projekte erstellt. Starte mit einem leeren Projekt oder wähle eine Vorlage."
[Neues Projekt erstellen] [Vorlage wählen]
Guter Empty State (Suche):
„Keine Ergebnisse für ‚Sommerkollektion'. Andere Schreibweise? Oder alle Produkte durchsuchen."
[Alle Produkte zeigen]
Guter Empty State (Gelöscht/Erledigt):
„Alles erledigt. Zeit für eine Pause – oder neue Aufgaben hinzufügen."
[Neue Aufgabe]
Dropbox, Slack und Trello sind bekannte Beispiele für sorgfältig gestaltete Empty States, die zum Markenerlebnis beitragen.
In der Praxis
Empty States im Onboarding-Kontext
First-Use Empty States sind ein oft unterschätzter Teil des Onboarding-Texte und Willkommens-Flows-Konzepts. Sie treffen Nutzer in einem Moment hoher Motivation (gerade registriert, gerade installiert) und können durch gezielte Texte und CTAs die Aktivierungsrate deutlich erhöhen.
Best Practice: Im Empty State konkret zeigen, was nach der ersten Aktion passiert. „Wenn du eine Datei hochlädst, erscheint sie hier" gibt Nutzern ein mentales Modell für das Produkt.
Unterschiedliche Kontexte erfordern unterschiedliche Texte
Nicht jeder Empty State braucht denselben Ton:
- Dashboard (leer): Motivierend, handlungsorientiert
- Suchergebnis (leer): Lösungsorientiert, praktisch
- Archiv (leer): Neutral, kurz
- Notification-Center (leer): Entspannt, positiv
Fehler vs. Empty State
Ein Empty State ist kein Fehler – er zeigt einen validen Systemzustand. Die visuellen und sprachlichen Signale sollten diese Unterscheidung klar machen: kein Rot, kein Warnsymbol, kein entschuldigender Ton. Zur Abgrenzung von tatsächlichen Fehlerzuständen vgl. Fehlertext-Design.
Testbarkeit
Empty States sind gut testbar: Wie schnell führen Nutzer nach einem Empty State die empfohlene Aktion aus? Diese Conversion-Rate ist ein direkter Indikator für die Wirksamkeit des Texts.
Vergleich & Abgrenzung
Empty State vs. 404-Seite: Eine 404-Seite signalisiert einen Fehler (die Seite existiert nicht). Ein Empty State ist kein Fehler, sondern ein valider Zustand des Systems.
Empty State vs. Loading State: Während Inhalte laden, sollte ein Skeleton Screen oder Ladeanzeige erscheinen – kein Empty State. Erst wenn feststeht, dass kein Inhalt vorhanden ist, wird der Empty State angezeigt.
Empty State vs. [Onboarding-Texte und Willkommens-Flows](/wiki/mediendesign-digitale-medien/ux-writing/onboarding-texte/): Onboarding-Texte begleiten Nutzer durch den Einrichtungsprozess. Der First-Use Empty State ist ein Bestandteil des Onboardings, aber nur einer von vielen.
Häufige Fragen (FAQ)
Sollte jeder Empty State eine Illustration haben? Nein. Illustrationen können den emotionalen Ton unterstützen, sind aber kein Muss. Bei professionellen B2B-Produkten wirken sie oft fehl am Platz.
Was, wenn es keinen sinnvollen CTA gibt? Bei User-Cleared Empty States (z. B. gelöschter Posteingang) reicht oft ein kurzer, positiver Satz. Ein erzwungener CTA wirkt aufdringlich.
Wie viel Text ist angemessen? Maximal zwei kurze Sätze plus CTA. Empty States sind keine Tutorial-Texte.
Muss ein Empty State unterschiedlich für Mobile und Desktop sein? Der Text kann gleich bleiben, aber Länge und Formatierung müssen für den jeweiligen Viewport angepasst werden.
Verwandte Einträge
- Onboarding-Texte und Willkommens-Flows
- Microcopy: Kleine Texte, große Wirkung
- Button-Beschriftung
- Fehlertext-Design
- Barrierefreie Texte
Weiterführend
- Babich, Nick: „Best Practices for Empty State UX Design", UX Planet, 2016
- Harley, Aurora: „Empty State UX", Nielsen Norman Group, 2018
- Richards, Sarah: Content Design, Content Design London, 2017
- Lupton, Ellen: Design Is Storytelling, Cooper Hewitt, 2017
