UX-Writing. Erste Schritte
Auf den meisten Buttons steht einfach nur «mehr» oder «OK». Das ist schade, denn Sprache hat viel mehr zu bieten. Gerade auf einem User Interface. In der heutigen digitalen Welt ist die Benutzerfreundlichkeit von Mobile Apps von entscheidender Bedeutung. Ein wichtiger Bestandteil davon ist die Sprache, die im UI-Design verwendet wird.
UX-Writing Style Guide.
Um eine konsistente Anwendung der Sprache innerhalb deiner App zu garantieren, ist es wichtig, Guidelines für den Umgang mit Interaktions-Texten innerhalb des User Interfaces zu definieren. Ein guter UX-Writing Style Guide ist der Schlüssel zu zufriedenen Anwender*innen. Mit UX-Writing Vorgaben beantwortest du Fragen wie: Wie ist der „Tone of Voice“ deiner Marke? Wie schreibst du Fehlermeldungen? Wie gehst du mit Formular-Feld Texten um? Wie formulierst du deine «call to action»?
Der UX-Writing Style Guide dient als Werkzeug für deine UX-Designer*innen und Interaction Designer*innen. Du stellst damit sicher, dass bereits in einer frühen Wire-Frame Phase das gesamte Design-Team mit «echtem» Material arbeiten kann. Und natürlich verhinderst du damit auch, dass das Entwickler-Team eigenhändig unsympathische, Roboter ähnliche Fehlermeldungen textet.
Für Ungeübte kann die Erstellung eines UX-Writing Style Guides eine Herausforderung sein.
Die untenstehende Liste soll dir zeigen, wie du am besten vorgehst, um einen Text-Style-Guide in Figma zu erstellen.
1. Identifiziere den „Tone of Voice“ deiner Marke.
Bevor du mit der Erstellung des Style Guides beginnst, solltest du dich über den „Tone of Voice“ deiner Marke im Klaren sein. Dieser kann ernst, seriös, verspielt oder humorvoll sein.
2. Lege die Regeln fest.
Lege fest, wie Fehlermeldungen, Formular-Feld Texte und „Call to action“ formuliert werden sollen.
3. Erstelle Vorlagen.
Erstelle in Figma ein eigenes File, mit Pages für jede Kategorie. Innerhalb der Pages kannst du jeden Punkt ausführlich ausarbeiten und entsprechende Tokens und Komponenten aufbauen. So können deine UX-Designer*innen bereits in der Wireframe-Phase mit „echten“ Elementen arbeiten, testen und sicherstellen, dass dein UX-Writing in der Praxis funktioniert.
4. Gib Beispiele.
Gib Beispiele für die Anwendung der Regeln in verschiedenen Szenarien.
5. Teste und überarbeite.
Erstelle für das Usability-Testing Szenarien, mit denen du spezifisch die Verständlichkeit der Sprache, sowie die Akzeptanz deiner gewählten Tonalität testen kannst. Dies kann beispielsweise durch Aufgaben wie die Durchführung einer Transaktion oder die Fehlerbehebung in der App erfolgen. Auf diese Weise kannst du sicherstellen, dass dein UX-Writing Style Guide nicht nur im Figma gut aussieht, sondern auch in der Praxis funktioniert.“
Inspiration für den Inhalt eines UX-Writing Styleguides findest du bei bekannten Grössen wie MailChimp, Slack oder Starbucks. Die Links führen dich natürlich nicht zu den Figma-Vorlagen. Geben aber trotzdem einen guten Überblick, welche Fragen du dir stellen musst:
Mailchimp
https://styleguide.mailchimp.com/
Zusammenfassend lässt sich sagen, dass die Erstellung eines UX-Writing Style Guides in Figma ein wichtiger Schritt ist, um eine konsistente Anwendung der „Tone of voice“ in der Benutzeroberfläche zu gewährleisten. Indem du den „Tone of Voice“ deiner Marke identifizierst, Regeln festlegst, eine Vorlage erstellst und Beispiele gibst, kannst du sicherstellen, dass deine App einfach zu bedienen ist und eine gute Benutzererfahrung bietet.
