UX Design: Erschaffung des perfekten Nutzererlebnisses
Das User-Experience-Design ist heutzutage ein bedeutender Bestandteil bei der Entwicklung neuer Produkte und Dienstleistungen sowie bei der Optimierung älterer Leistungen. Die User Experience umfasst die sogenannte Customer Journey auf ganzheitliche Weise. Dies bedeutet, dass alle praktischen Erfahrungen und Gefühle, die Kundinnen und Kunden beim Nutzen des Produktes oder bei Inanspruchnahme der Dienstleistung, sammeln beziehungsweise empfinden, betrachtet werden.
Wenn wir uns dabei unseren Geschäftsgegenstand, die Erstellung von Websites, ansehen, heißt das, dass beim User-Experience-Design die Gedanken und Bedürfnisse der Website-User:innen genauso berücksichtigt werden, wie die Optimierung technischer Prozesse. Kurz gesagt verfolgen UX-Designer:innen das Ziel, das Nutzererlebnis so angenehm wie möglich zu gestalten. Damit das gelingen kann, müssen komplexe Sachverhalte so einfach wie möglich dargestellt werden. Eine Website sollte nicht bloß ihren Zweck erfüllen, deren Nutzung sollte den User:innen gleichzeitig Freude bereiten. Durch das Entstehen dieser Freude könnt ihr eine treue, zufriedene Stammkundschaft aufbauen.
Im Folgenden haben wir uns mit den Unterschieden von User-Experience- und User-Interface-Design sowie mit dem UX-Prozess beschäftigt und teilen unser Praxiswissen mit euch.
User-Experience-Design (UX) vs. User-Interface-Design (UI) von Websites
Das User-Experience- und das User-Interface-Design werden oftmals verwechselt, obwohl letzteres als Teildisziplin von UX bezeichnet werden kann. Vereinfacht gesagt kümmern sich UI-Designer:innen darum, dass die Website optisch ansprechend aussieht, während UX-Designer:innen sich auf deren einwandfreie praktische Benutzung und das Nutzerempfinden fokussieren. Beim User-Experience-Design wird das Produkt als Ganzes betrachtet.
UX-Designer:innen setzten sich stets mit ihren Zielgruppen auseinander und kennen deren Wünsche und Bedürfnisse bestens. Um Entscheidungen zu treffen, greifen sie oftmals auf analytische Forschungsergebnisse, beispielsweise aus der digitalen Marketinglehre, zurück. Im Vergleich dazu, nähern sich UI-Expertinnen und Experten einem Problem primär auf kreative Weise. Bei der Gestaltung von Benutzeroberflächen greifen sie auf Methoden des Web- und Grafikdesigns zurück.
Es ist wichtig zu wissen, dass das UX Design eine strategisch ausgerichtete Disziplin ist, die neben dem User-Interface-Design auch noch weitere Teilgebiete, wie zum Beispiel die Usability und die Interaktionsgestaltung (IxD), umfasst.
Der UX-Prozess
Bevor der eigentliche UX-Prozess losgehen kann, muss festgelegt werden, für welches Produkt das Design entworfen werden soll und was dessen Hauptaufgabe ist. Diese Basisinformationen sind zur Erstellung von Zielgruppen notwendig. Wenn wir Websites und Onlineshops erstellen, folgen wir auch dem gängigen UX-Prozess:
Schritt 1 – Recherche: In dieser Phase wird zunächst eine Konkurrenz- und eine Nutzeranalyse durchgeführt. Erstere zeigt, welche Probleme die Produkte der Konkurrenz lösen können und welche nicht. Bei der Nutzeranalyse werden qualitative und quantitative Daten über die Zielgruppe(n) erhoben und analysiert. Hierfür führen wir beispielsweise Interviews mit Nutzer:innen durch und interpretieren Webanalyse-Statistiken. Schließlich erstellen wir sogenannte Personas, das sind fiktive Personen, die in den Zielgruppen vermehrt vorkommen. Dabei möchten wir die Eigenschaften der Personas (Geschlecht, Alter, Wohnort, Beruf, …) bestmöglich dokumentieren.
Schritt 2 – Design: Mit dem Wissen über die Wünsche und Bedürfnisse der Zielgruppe(n) kann der Designprozess gestartet werden. Hierfür erstellen wir User-Flow-Diagramme und Wireframes. Erstere zeigen, welche Schritte die User:innen auf der Website zurücklegen können und wie viele Klicks notwendig sind, bis sie eine bestimmte Aktion durchführen können. Um diese Prozesse auf einfache Weise grafisch darzustellen, verwenden wir gerne die praktische Whiteboard-Plattform miro.
Wireframes zeigen, wie der Aufbau der Website aussehen wird. Dabei werden die einzelnen Abschnitte und Elemente durch einfache Formen, zum Beispiel durch Kreise und Rechtecke, dargestellt. Die Elemente sind in diesem Schritt noch farblos und nicht mit Content befüllt. Beim Entwurf von Wireframes steht somit nicht das visuelle Design, sondern die Website-Funktionen sowie der Nutzerflow im Vordergrund. Bei der Erstellung dieser Webseiten-Grundgerüste haben uns die Funktionen der Designtools Adobe XD und Figma am meisten überzeugt.
Ziel des zweiten UX-Schrittes ist es, einen ansprechenden Prototyp zu erstellen und zu präsentieren. Bei der Bewertung eines Prototyps spielt das UI-Design eine bedeutsame Rolle, weil die optische Gestaltung der Website das Erste ist, das deren Besucher:innen begutachten. Aufgrund dessen kommen sogenannte Klickdummys zum Einsatz, das sind interaktive Website-Prototypen, auf denen ihr in der Regel einige Elemente, wie Buttons und Navigationselemente, anklicken könnt. Dabei ist es aber wichtig zu verstehen, dass hinter einem Klickdummy keine vollständige Programmierung steckt, es handelt sich ausschließlich um einen Designentwurf.
Selbstverständlich könnt ihr die Diagramme und Entwürfe auch händisch auf Papier zeichnen, aber in Zeiten der Digitalisierung und der Remote-Arbeit vereinfacht die Nutzung von digitalen Tools die Zusammenarbeit zwischen allen Personen, die an der Produktentwicklung beteiligt sind.
Schritt 3 – Testen: Nun wird der Prototyp umfangreich getestet und die in der Designphase getroffenen Entscheidungen werden evaluiert. Dabei wird das Ziel verfolgt, alle Schwachstellen des Prototyps zu erkennen und zu beheben. Hierfür sind auch Absprachen mit UI-Designer:innen, Developer:innen und Auftraggeber:innen notwendig. In weiterer Folge wird dann das Endprodukt auf Basis des Prototyps entwickelt. In unserem Fall beginnt dann der Programmierungsprozess der Website oder des Onlineshops.
UX-Design in der Praxis: Was es bei Websites zu beachten gibt
Eines ist klar: Durch User-Experience-Design könnt ihr die Erfahrung, die Internet-User:innen auf eurer Website machen, positiv beeinflussen. Dabei solltet ihr folgende Dinge besonders im Blick haben:
- „Weniger ist mehr“: Bei der Entwicklung eines User-Experience-Designs für eine Website ist deren Übersichtlichkeit ein bedeutsamer Faktor. Den Website-Besucher:innen sollte stets klar sein, wofür euer Unternehmen steht und welche Produkte und/oder Dienstleistungen ihr anbietet. Wenn Seiten zu überladen wirken und nicht genügend Abstand zwischen den einzelnen Elementen (Texte, Fotos, Grafiken, …) vorhanden ist, können sich User:innen bei dessen Betrachtung unwohl fühlen und die Website unter Umständen sogar ganz verlassen.
- Web Accessibility und Usability: Ein gelungenes UX-Konzept beinhaltet auch Maßnahmen, wie ihr eure Website für alle User:innen, unabhängig davon, ob sie zum Beispiel eine Sehbeeinträchtigung haben oder nicht, gut zugänglich machen könnt. Die Website sollte mit der Tastatur steuerbar sein und der Text sollte problemlos von Screenreadern vorgelesen werden können. Im Rahmen der Usability geht es primär um eine konsequente, logische Strukturierung der Website sowie um eine einfache Menügestaltung.
- Ladegeschwindigkeit: Bereits in unserem Blog über Mobile Shopping Apps sind wir darauf eingegangen, wie bedeutsam die Ladegeschwindigkeit im Kampf gegen zu hohe Absprungraten auf den eigenen Online-Angeboten sind. Tatsächlich stellt eine zu lange Ladedauer einen mächtigen Störfaktor dar und kann das Nutzererlebnis eurer Kundinnen und Kunden unter gewissen Umständen komplett zerstören. Ein UX-Konzept enthält deswegen auch Vorschläge, wie man Ladeverzögerungen vermeiden kann.
- Testen, testen, testen: Das Endprodukt muss umfangreich getestet werden. Am besten geschieht dies durch ausgebildete Programmierer:innen sowie durch beispielhafte Endnutzer:innen. Letztere können die Struktur und die Funktionen deutlich anders wahrnehmen, da sie sich vor dem erstmaligen Besuch der neuen Website nicht stundenlang mit dem Projekt auseinandergesetzt haben. Deshalb solltet ihr das Feedback der externen Tester:innen sehr ernst nehmen und daraus Verbesserungsmaßnahmen ableiten.
- Kontinuierliches Feedback und Optimierung: Wie wir alle wissen, ist die IT-Welt schnelllebig und reich an Innovationen. Aufgrund dessen ist es verständlich, dass ein User-Experience-Konzept nicht nur ein einziges Mal erstellt wird. Wir raten euch dazu, die Optimierung der User Experience als ständig fortschreitenden Prozess zu betrachten. Beispielsweise spielte das Responsive Design von Websites vor zehn Jahren noch kaum eine Rolle, während es heutzutage eines der wichtigsten Elemente der Benutzerfreundlichkeit im World Wide Web darstellt.
Lohnt sich der ganze Aufwand?
Mit Sicherheit ist die Entwicklung und das laufende Updaten eines User-Experience-Designkonzepts kosten- und zeitintensiv. Gemäß unserer Erfahrung lohnt es sich aber, finanzielle sowie personelle Ressourcen darin zu investieren.
Durch ein qualitativ hochwertiges User-Experience-Design könnt ihr als Website-Betreiber:innen langfristig Kosten einsparen. Das Designkonzept verringert zum Beispiel spätere Kosten im Bereich der Programmierung, da aufgrund der präzisen Berücksichtigung der Zielgruppenbedürfnisse nach der Veröffentlichung der Website weniger Korrekturarbeiten notwendig sind.
Außerdem bleibt einer großen Mehrheit der Internetuser:innen ein positives Nutzererlebnis auf einer Website im Gedächtnis. Auf diese Weise könnt ihr das Vertrauen von Erstkundinnen und -kunden gewinnen und sie an euer Unternehmen binden. Schlussendlich sorgt eine hohe Nutzerzufriedenheit auch für viel Traffic, positive Kundenbewertungen, Weiterempfehlungen und zufriedenstellende Conversion Rates.