Informationen zu diesem Codelab
1. Hinweis
Eine klare und prägnante Formulierung spielt eine wichtige Rolle für die Qualität der Nutzererfahrung. Machen Sie sich mit den UX-Schreibrichtlinien von Material Design vertraut und wenden Sie die Prinzipien für UI-Text an, damit Ihre Nutzer ihr Ziel erreichen.
Wussten Sie, dass der Bereich „Kommunikation“ von Material viel mehr als nur UX-Text umfasst? Hier finden Sie Informationen zu Themen wie Datenvisualisierung, Onboarding und Muster für leere Status.
Denken Sie wie ein Autor.
Unabhängig davon, ob Sie mit einem UX-Schreiber oder Content-Strategen zusammenarbeiten, werden in diesem Codelab Möglichkeiten vorgestellt, wie jeder Sprachauswahl treffen kann, die sich gut für Benutzeroberflächen eignet. Sie lernen, einige der Fragen zu stellen, auf die sich ein Texter konzentrieren könnte, um die Produktnutzung zu verbessern, z. B. Klarheit und Prägnanz in nutzerorientierten Texten wie Labels und Benachrichtigungen.
Lerninhalte
- Was ist UX-Writing und warum ist es wichtig?
- Den richtigen Ton und Stil für verschiedene Kontexte festlegen
- Komponentenspezifische Überlegungen zum Schreiben
- Ressourcen für weitere Lernangebote
Voraussetzungen
- Legen Sie ein Dokument an oder nehmen Sie ein Blatt Papier zur Hand, um die Codelab-Übungen nachzuvollziehen.
Vorbereitung
Dieses Lab baut auf den grundlegenden Konzepten für Schreiben, Grammatik und Design in Material Design auf. Ein allgemeines Verständnis von interaktiven Elementen in einer Benutzeroberfläche ist hilfreich.
Englischsprachig, aber allgemein nützlich
In diesem Lab werden Kommunikationsprinzipien für eine bessere User Experience behandelt. Beispiele und Formulierungen basieren jedoch auf den Konventionen des amerikanischen Englisch.
Diese Anleitung kann auf Benutzeroberflächen in jeder Sprache angewendet werden, da sie auf Änderungen in Kontext und Kultur eingeht. Weitere Informationen zu nicht englischsprachigen Inhalten finden Sie in den in Schritt 9 aufgeführten Ressourcen.
2. Was ist UX-Writing?
Übersicht
UX Writing (UXW) wird auch als Content Strategy oder Content Design bezeichnet. Es ist die Disziplin hinter Text in Benutzeroberflächen und ein eigenständiges Feld, das Sprache als Mittel zur Verbesserung der Nutzerfreundlichkeit durch klare Erzählungen, Wortwahl, Informationshierarchie und mehr betrachtet.
Wenn Sie wie ein UX-Autor denken, können Sie die Aufgabenerledigung, die Nutzerzufriedenheit und die allgemeine Benutzerfreundlichkeit verbessern.
Was unterscheidet UX-Texte von anderen Texten?
Beim UX-Writing schreiben wir für echte Menschen.
Beim Schreiben für die Nutzerfreundlichkeit sollte davon ausgegangen werden, dass ein primäres Ziel von UI-Texten darin besteht, User Journeys zu unterstützen.
Die Wortwahl, Länge, der Stil und die Struktur von Texten können sich darauf auswirken, wie gut ein Nutzer das Ziel und die Vorteile von Funktionen und Aufgaben versteht.
Stil
Die Wahl des Schreibstils sollte sich nach den Bedürfnissen und Zielen Ihrer Zielgruppe richten. UXW kombiniert die akademischen Regeln des formalen Schreibens (wie in Zeitungen oder Sachbüchern) mit den weniger formalen Stilen, die Menschen bei der Online-Kommunikation (E-Mail, SMS, Chat) verwenden.
Texte für Apps und Benutzeroberflächen sind aus zwei Hauptgründen weniger formell:
- Die Onlinekommunikation ist weniger formell als das Schreiben für Printmedien oder akademische Texte.
- UI-Text ist durch den verfügbaren Platz auf dem Bildschirm begrenzt; die Zeichenlänge ist eingeschränkt
Nutzerorientiertes Schreiben, auch bekannt als „Make it work“
Beim UX-Schreiben wird ein zielorientierter Stil gegenüber der Einhaltung der Grammatik priorisiert. Das bedeutet nicht, dass Grammatik nicht wichtig für Klarheit und Konsistenz ist. Es ist jedoch hilfreich, zuerst die Bedürfnisse der Nutzer zu berücksichtigen und die Grammatikentscheidungen danach zu treffen.
Bei der Wortwahl und dem Stil kann ein Leitprinzip für Stilentscheidungen einfach Funktioniert es? sein. Die besten Formulierungen für Benutzeroberflächen sind nicht immer dieselben wie die Regeln für formelles Schreiben.
So schreiben, dass Menschen es gerne lesen
UXW sollte widerspiegeln, wie Leser in vielen Sprachen Seiten in einem F-förmigen Muster scannen, anstatt vollständige Absätze zu lesen. Wenn Sie das Verhalten der Leser berücksichtigen, können Sie so schreiben, dass der Text tatsächlich gelesen wird.
Bei Webinhalten bedeutet das oft kurze Absätze, übersichtliche beschreibende Überschriften und eine strategische Formatierung.
Beispiele für Eye-Tracking aus Studien zu Online-Lesemustern. Bild und Recherche von nngroup.com (2006; 2017).
Test
Es kann schwierig sein, mit demselben Text die Bedürfnisse verschiedener Kulturen oder Altersgruppen zu erfüllen. Die richtigen Worte zu finden, um Ihre Botschaft zu vermitteln, mag einfach klingen, aber Sprache und Verständnis sind sehr subjektiv.
Damit Ihre Texte die gewünschte Wirkung erzielen, sind Tests ein wichtiger Schritt, um Klarheit, Bedeutung und Wirksamkeit in der Praxis zu bewerten.
Approaches
Einfach und kostengünstig
- Lesen Sie das Geschriebene laut vor. Klingt es so, als ob Sie das zu einer echten Person sagen würden? Wenn nicht, versuchen Sie es noch einmal.
- Bitten Sie eine andere Person, Ihre Worte zu lesen und Ihnen zu erklären, was sie Ihrer Meinung nach bedeuten.
- Mehrere Personen mit Beispielen Ihrer Texte im Kontext einer Benutzeroberfläche befragen
- Mit Google Trends oder Google Books Ngram Viewer können Sie herausfinden, ob ein bestimmtes Wort oder eine bestimmte Wortgruppe häufiger vorkommt als ein anderes.
Beim umfangreichen Testen von Inhalten werden Heuristiken wie die folgenden verwendet:
- Verständlichkeit und Lesbarkeit
- Aufgabenerledigung und Zeitaufwand für die Aufgabe
- Bewertung von Ton und Wahrnehmung
3. Grundsätze
Übersicht
Die Grundsätze in den Richtlinien für das Verfassen von Material sollen durch eine genaue und prägnante Sprache Vertrauen schaffen und die Verständlichkeit verbessern. Sie können die Material-Grundsätze an Ihre eigenen Bedürfnisse anpassen.
Richtlinien ermöglichen es mehreren Personen, als Gruppe einheitlichere Entscheidungen zu treffen.
Fassen Sie sich kurz, aber schreiben Sie nicht wie ein Roboter.
Schreiben Sie kurze, leicht lesbare Textabschnitte, die sich auf eine begrenzte Anzahl von Ideen konzentrieren.
Einfach und direkt schreiben
Verwenden Sie eine einfache, direkte Sprache, damit der Text leicht verständlich ist. Fragen Sie sich jedes Mal, wenn Sie etwas schreiben, ob es eine einfachere Möglichkeit gibt, die Idee auszudrücken.
Nutzer klar ansprechen
Im Deutschen ist die zweite Person (du oder dein) oft direkter und klarer. Die erste Person (ich, mich oder mein) kann verwendet werden, wenn das Eigentum betont werden soll.
„Sie“ und „Ihr“ sind direktere Möglichkeiten, einen Nutzer anzusprechen.
„Ich“ oder „mein“ kann verwirrend sein, da es die Position oder Stimme eines Nutzers mit der Stimme der App kombiniert. „Ich“ oder „mein“ kann verwendet werden, um das klare Eigentum an Inhalten oder Aktionen zu betonen.
Kombination von erster und zweiter Person vermeiden
Um Verwirrung zu vermeiden, sollten „ich“/„mein“ und „du“/„dein“ nicht im selben Satz vorkommen.
Wichtige Details mitteilen
Kommunizieren Sie nur die wesentlichen Details für einen bestimmten Kontext, damit sich die Nutzer auf die jeweilige Aufgabe konzentrieren können, anstatt viele Optionen interpretieren zu müssen. Überlegen Sie bei jedem Dialogfeld oder jeder Benachrichtigung, welche Informationen erforderlich sind, um einen Vorgang und seine kritischen Folgen zu erläutern.
4. Stimme und Tonfall
Übersicht
Ohne Berücksichtigung des gewünschten Tons und der gewünschten Ausdrucksweise ist es schwierig, Konsistenz und Klarheit zu erreichen.
Stellen Sie sich vor, Sie lesen fünf Sätze, die jeweils von verschiedenen Personen geschrieben wurden, die die anderen vier Sätze nicht gesehen haben. Manchmal kann die Navigation in einer Benutzeroberfläche holprig sein, weil die einzelnen Texte von verschiedenen Personen mit unterschiedlichen Formulierungen und Tonalitäten verfasst wurden.
Wenn mehrere Personen Text für ein Produkt beitragen, können Richtlinien für Ton und Stil dazu beitragen, dass Wörter mit einem gemeinsamen Sinn und Zweck ausgewählt werden.
Beispiel für eine frühere Android-Kampagne, die eine klare und inklusive Sprache mit einem direkten Ton verwendet.
Was sind Sprache und Tonalität?
Die Stimme sollte in der gesamten Benutzeroberfläche einheitlich sein, während der Ton kontextbezogen ist und variieren kann.
Sprache
Der Begriff „Voice“ bezieht sich auf die Stimmung, Haltung oder Perspektive, die in einer Erfahrung vermittelt wird. Es ist ein Aspekt der „Persönlichkeit“ einer Marke und kann es jemandem ermöglichen, sich mit der Art und Weise vertraut zu machen, wie ein Produkt „klingt“.
Die Grundsätze für den Tonfall geben die Wortwahl vor und funktionieren am besten, wenn sie durch Beispiele ergänzt werden, die den Tonfall in der Praxis veranschaulichen. Ohne Beispiele können Grundsätze oft zu abstrakt sein, um die Stilentscheidungen einer Gruppe zu leiten.
Hier sind einige gängige Beispiele für einen Voice-Grundsatz:
- Hilfreich: Schreiben Sie wie ein Mensch, nicht wie eine Maschine. Fehler erläutern und eine Lösung vorschlagen
- Barrierefrei: Sorgen Sie dafür, dass der Text für alle neuen Nutzer leicht verständlich ist. Achten Sie darauf, dass technische oder fortgeschrittene Begriffe erklärt oder ersetzt werden.
- Inspirierend: Betonen Sie die Vorteile und Erfolge während der gesamten Nutzung. Formulieren Sie Ziele und Ergebnisse positiv und aktiv.
Ton
Der Ton Ihres Textes vermittelt Stimmungen und Emotionen, unabhängig davon, ob Sie das beabsichtigen oder nicht.
Wenn eine Stimme beispielsweise als „hilfreich“ und „menschlich“ definiert ist, sollte der Ton unterstützend und locker sein, anstatt fordernd und kurz angebunden.
Was eine Person als „unterstützend und locker“ empfindet, ist subjektiv. Deshalb helfen Wortlisten und eine Inhaltsmatrix dabei, die Sprache und den Ton umzusetzen. Dies wird in den Abschnitten 6 bis 8 näher erläutert.
Bedeutung
Der richtige Ton kann das Vertrauen der Nutzer stärken. Wenn eine Fehlermeldung beispielsweise in Form eines Witzes statt als Support formuliert ist, wird dem Nutzer möglicherweise nicht vermittelt, dass seine Frustration berechtigt und das Problem lösbar ist.
Tone Map erstellen
Eine Ton-Map hilft Ihnen, eine Strategie zum Anpassen von Stimme und Ton zu planen und zu dokumentieren.
Beginnen Sie damit, die wichtigsten Punkte entlang einer User Journey zu berücksichtigen. Unabhängig davon, ob Sie Spiele, Finanztools oder eine Shopping-App entwickeln, sollte Ihr Tonfall je nach Phase des Nutzer-Lebenszyklus variieren, z. B. beim Onboarding, bei Bestätigungen und bei Fehlern.
Eine lustige Benachrichtigung zur Bestätigung einer Routine scheint anfangs eine gute Idee zu sein, aber beim fünften Mal kann die Freude schnell in Ärger umschlagen.
Fehlerzustände sind ein weiteres Beispiel dafür, wie die Tonzuordnung dazu beitragen kann, den Ton von locker und gesprächig zu unterstützend und detailliert zu ändern.
1. Wählen Sie zuerst zwei Dimensionen oder Spektren aus, die einen Bereich in Ihrem gewünschten Ton darstellen können.
Hier sind einige Ideen für wichtige Achsen für den Ton in der UX-Dokumentation:
- Verspielt oder ernst
- Kurz und bündig oder detailliert
- Emotional vs. neutral
- Locker vs. starr
2. Zeichnen Sie ein Raster mit zwei sich kreuzenden Linien und weisen Sie jeder Achse eine Dimension des Tons zu, für die Sie eine Strategie entwickeln möchten.
Im Beispiel unten sind unterhaltsam vs. seriös und kurz vs. ausführlich die Dimensionen der Karte.
3. Liste Nachrichtentypen oder Muster auf, die du häufig verwendest. Folgende Nachrichtentypen können Sie zuordnen:
- Onboarding
- Bestätigung und Empfangsbestätigung
- Hilfe & Feedback
- Fehler
- Benachrichtigungen
- Labels
- Leere Zustände
4. Platzieren Sie jeden Nachrichtentyp auf der Karte in Bezug auf beide Achsen.
Hier einige Punkte, die Sie beachten sollten:
- Wie viel Bildschirmplatz ist für eine bestimmte Nachricht verfügbar?
- Wie wichtig oder kritisch ist das Verständnis für einen Nachrichtentyp? Ist eine destruktive Aktion im Gange?
- Was soll ein Nutzer in Bezug auf die Intention eines Nachrichtentyps wissen oder fühlen? Das Onboarding ist beispielsweise oft mit einer unbeschwerten, aber praktischen Absicht verbunden.
5. Beispiel
Unten sehen Sie ein Beispiel für Mitteilungstypen, die nach gängigen App-Erfahrungen dargestellt werden.
Wenn es in Ihrer App um Zahlungen oder rechtliche Angelegenheiten geht, sollten Sie den Ton ernster und detaillierter gestalten, da das Verständnis hier besonders wichtig ist. Wenn es dagegen nicht um Datenschutz oder Finanzen geht und auch eine Hilfe verfügbar ist, in der Nutzer weitere Informationen finden, können Sie sich kürzer fassen.
5. Inhaltsstruktur
Übersicht
Die Struktur einer Aussage kann das Verständnis verbessern und einem Nutzer helfen, sich auf die jeweilige Aufgabe zu konzentrieren. Wenn Sie ein Bild mit Text kombinieren, ist ein weiteres Ziel einer Informationsstruktur die Verbesserung der Barrierefreiheit.
Mit Zielen beginnen
Beginnen Sie Sätze mit dem Ziel des Nutzers. Da UX-Texte aufgabenorientiert sind, wird in Formulierungen häufig ein Ziel hervorgehoben, das den motivierenden Rahmen für eine Aufgabe bildet. Anschließend wird im Satz die erforderliche Aktion zur Erledigung einer Aufgabe erläutert.
Details nach Bedarf einblenden
Informationen kontextbezogen und nach Bedarf anzeigen. Dieser Ansatz wird oft als progressive Offenlegung bezeichnet. Geben Sie Details zu Funktionen preis, wenn der Nutzer sie erkundet und weitere Informationen benötigt.
Um Informationen strategisch zu präsentieren, müssen die Informationsanforderungen für jeden Punkt im Nutzer-Journey sorgfältig berücksichtigt werden. Es geht nicht darum, etwas zu verbergen oder auszulassen, insbesondere nicht die Folgen von Aktionen, die nicht rückgängig gemacht werden können. Denken Sie aber daran, dass Sie Nutzern helfen, wenn Sie den Fokus auf die aktuelle Aufgabe richten.
Barrierefreies Design von Inhalten
Effektives Schreiben erstreckt sich auch auf die Kombination von Bildern und Text für Nutzer mit Sehbehinderung oder für Nutzer, die einen Screenreader verwenden. Im Abschnitt „Barrierefreiheit von Materialien“ finden Sie Anleitungen zum Kombinieren von Bildern und Untertiteln, damit das Inhaltsdesign einer Seite für alle Nutzer funktioniert.
Sichtbarer und nicht sichtbarer Text
Der Bedienungshilfen-Text umfasst:
- Sichtbarer Text: Labels für UI-Elemente, Text auf Schaltflächen, Links und in Formularen
- Nicht sichtbarer Text: Beschreibungen, die nicht auf dem Bildschirm angezeigt werden (z. B. Alternativtext für Bilder)
Wenn sowohl sichtbarer als auch nicht sichtbarer Text beschreibend und aussagekräftig ist, hilft er Nutzern, sich mithilfe von Überschriften oder Links auf einem Bildschirm zu orientieren. Ein Screenreader kann Ihnen helfen, Barrierefreiheitstext zu testen und Stellen zu finden, an denen Sie ihn hinzufügen können.
Alternativtext (Alt-Text)
Alt-Text hilft, eine visuelle Benutzeroberfläche in eine textbasierte Benutzeroberfläche zu verwandeln. Alt-Text ist ein kurzes Label (bis zu 125 Zeichen) im Code, das ein Bild für Nutzer beschreibt, die es nicht sehen können.
Im Beispiel unten bietet ein Screenreader Kontext für den umgebenden Text, indem er die wichtigsten Deskriptoren eines Bildes angibt.
Da Alt-Text nur für Bilder verwendet wird, müssen Sie dem Alt-Text nicht „Bild von“ oder „Abbildung von“ hinzufügen. Ein Screenreader liest den Alt-Text anstelle des Bildes vor.
6. Wortwahl
Übersicht
Wenn der Bildschirmplatz begrenzt ist, ist es wichtig, die richtigen Worte zu wählen, um Ihre Botschaft und Ihren Ton zu vermitteln. Wenn Sie immer dieselben Wörter verwenden, können sich Nutzer leichter an eine Funktion gewöhnen.
Für alle Lesekompetenzniveaus schreiben
Verwenden Sie gebräuchliche Wörter, die für alle Lesekompetenzniveaus klar und leicht verständlich sind.
Kein Fachjargon
Vermeiden Sie branchenspezifische Terminologie oder Namen, die für UI-Funktionen erfunden wurden, wenn sich dieselbe Idee mit einem einfacheren Ausdruck ähnlich vermitteln lässt.
Einheitliche Begriffe verwenden
Verwenden Sie Wörter in Ihren UI-Funktionen einheitlich.
Im Präsens schreiben
Verwenden Sie das Präsens, um das Produktverhalten zu beschreiben. Vermeiden Sie die Verwendung der Zukunftsform, um die Funktionsweise eines Produkts zu beschreiben.
Wenn Sie in der Vergangenheits- oder Zukunftsform schreiben müssen, verwenden Sie einfache Verbformen.
UI-Elemente und Steuerelemente anhand des Labels referenzieren
Labels geben an, wozu ein Steuerelement oder Element dient. Sie werden entweder auf oder in der Nähe des Steuerelements selbst angezeigt, z. B. als Text auf einer Schaltfläche oder einem Schalter. Wenn Sie auf ein UI-Steuerelement oder -Element verweisen möchten, erwähnen Sie es mit seinem Labeltext. Geben Sie nicht den Typ des Elements oder Steuerelements an.
Wichtige Details mitteilen
Geben Sie nur die Details an, die ein Nutzer für eine Aufgabe benötigt.
Zusammenfassung
- Für alle Lesekompetenzniveaus schreiben
- Wörter einheitlich verwenden, nicht nur, weil sie neu sind
- Präsens
- Ziffern verwenden
7. Für Komponenten schreiben
Übersicht
Die Komponenten von Material haben eine Intention in der Benutzeroberfläche. Wenn Sie für bestimmte Komponenten schreiben, kann dies die Intention verstärken.
Für diese Komponenten gibt es Schreibanleitungen auf Material.io:
Dialogfelder
Dialoge werden für Folgendes verwendet:
- Fehler, die den normalen Betrieb einer App blockieren
- Wichtige Informationen, die eine bestimmte Nutzeraufgabe, Entscheidung oder Bestätigung erfordern
Komponente | Priorität | Nutzeraktion |
Snackbar | Niedrige Priorität | Snackbars verschwinden automatisch |
Banner | Hervorgehoben, mittlere Priorität | Banner bleiben so lange sichtbar, bis der Nutzer sie schließt oder der Zustand, der das Banner ausgelöst hat, behoben wird. |
Dialog | Höchste Priorität | Dialogfelder blockieren die App-Nutzung, bis der Nutzer eine Aktion im Dialogfeld ausführt oder das Dialogfeld schließt (falls verfügbar). |
Titel
Der Zweck eines Dialogfelds sollte durch den Titel und den Schaltflächentext vermittelt werden.
Titel sollten eine kurze, klare Aussage oder Frage enthalten.
Snackbars
Snackbars enthalten ein Textlabel, das sich direkt auf den ausgeführten Vorgang bezieht. Auf Mobilgeräten kann ein Label bis zu zwei Textzeilen enthalten.
In Snackbars kann eine einzelne Textschaltfläche angezeigt werden, über die Nutzer auf einen von der App ausgeführten Vorgang reagieren können.
8. Alles in einer Inhaltsmatrix zusammenfassen
Übersicht
Eine Inhaltsmatrix ist eine Tabelle zum Nachverfolgen der Wörter und Formulierungen, die Sie in Ihren Texten verwenden und wiederverwenden. Die Inhaltsmatrix ist eine wichtige Ressource, um Phrasen einheitlich zu schreiben und zu verfolgen. Sie dient als Referenz für alle zukünftigen Autoren.
Das ist ein ausgefallener Name für eine Tabelle (ja, das verstößt gegen die Richtlinien zur Wortwahl, die besagen, dass kein Jargon verwendet werden soll).
Content Matrix einrichten
Erstellen Sie eine Tabelle oder ein Tabellenblatt, in dem Sie die Formulierungen und Wortwahl festhalten, die gut funktionieren und wiederholt werden können.
Ziel einer Inhaltsmatrix ist es, Ihnen zu helfen, zu ermitteln und zu dokumentieren, wie eine Nachricht mit Folgendem zusammenhängt:
- Nutzerziele und ‑kontexte
- Die Informationen, die zur Unterstützung eines bestimmten Ziels benötigt werden
- Entwurf und finaler UI-Text, in dem der Informationsbedarf kurz und ohne Fachjargon formuliert wird
Entscheidungen zum UI-Text in der Inhaltsmatrix sollten auch Folgendes berücksichtigen:
- Grundsätze für Tonfall und Wortwahl
- Komponententypen
Schließlich kann die Inhaltsmatrix eine Wortliste enthalten:
- Geben Sie die Wörter und Begriffe an, die zur Beschreibung Ihrer Funktionen, Aktionen und Ziele verwendet werden sollen.
- Geben Sie die Wörter an, die als Synonyme oder nicht hilfreiche Formulierungen vermieden werden sollten.
Nicht vergessen:
- Technische Begriffe ersetzen oder definieren
- Verwenden Sie die gängigste Wortwahl für eine Aktion oder ein Substantiv.
9. Erweiterte Themen und Ressourcen (optional)
Übersicht
In diesem Codelab werden Best Practices und Methoden für den Einstieg in das UX-Writing behandelt. Das ist nur die Spitze des Eisbergs.
Ressourcen
10. Glückwunsch!
Gut gemacht! Sie sind auf dem besten Weg, klaren und wirkungsvollen UI-Text zu schreiben.
