UX-Design – oder: Wer sich wohlfühlt, bleibt länger und kommt gerne wieder
UX-Design steht für User Experience Design, also zu Deutsch für eine benutzerfreundliche Gestaltung. Meist geht es dabei um digitale Anwendungen. Daher konzentrieren wir uns bei unserem heutigen Blogbeitrag vornehmlich auf UX-Design im digitalen Kontext.
Warum UX-Design und nicht einfach nur Design?
UX-Design ist weit mehr als ein hübsches Äußeres. Denn Nutzer:innen sollen intuitiv und auf für sie möglichst angenehme Weise mit einer Website oder App interagieren können, sodass sie sich auf der jeweiligen Plattform wohlfühlen und schnell zu dem gelangen, was sie erwartet haben, zu finden. Denn das erhöht die Wahrscheinlichkeit, dass User:innen konvertieren und die vom Unternehmen gewünschte Aktion ausführen – sei es der Kaufabschluss in einem Onlineshop oder die Kontaktaufnahme für eine Beratung.
Es geht also nicht nur um ein ästhetisches oder modernes Erscheinungsbild; das wäre definitiv zu kurz gesprungen. UX-Design beschreibt vielmehr die positive Beeinflussung der Nutzererfahrung durch Optik und Funktion, und zwar vom ersten Klick bis zum letzten. Das macht UX-Design so elementar für den Erfolg digitaler Plattformen.
Das A und U: Usability im UX-Design
Usability beschreibt die Benutzerfreundlichkeit und Zugänglichkeit einer Website oder einer anderen digitalen Anwendung und ist daher untrennbar mit gutem UX-Design verbunden. Eine hohe Usability bedeutet, dass Nutzer:innen das jeweilige Produkt gerne verwenden. Beste Voraussetzung also für eine nachhaltige Steigerung von Kundenbindung und -loyalität.
Im Rahmen von UX-Design umfasst Usability folgende Komponenten:
- Bedienbarkeit und Effizienz: Wie leicht und schnell lassen sich Aufgaben, zum Beispiel eine Produktrecherche oder ein Produktkauf, erledigen?
- Erlernbarkeit: Wie einfach ist es, die Funktionen der Anwendung zu verstehen und zu nutzen?
- Fehlertoleranz: Wie gut kommt das System mit Fehlern der Nutzer:innen zurecht und wie leicht können diese korrigiert werden?
UX-Design führt vom Verständnis zur Lösung
Design Thinking ist ein kreativer Ansatz zur Problemlösung. Er zeichnet sich durch seinen nutzerzentrierten Fokus aus und wird häufig im UX-Design verwendet, um innovative Lösungen zu schaffen, die eng auf die Bedürfnisse und Wünsche der Nutzer:innen abgestimmt sind. Der Design-Thinking-Prozess ist typischerweise in mehrere – häufig iterative – Phasen gegliedert:
- Empathieaufbau: Zunächst geht es darum, ein tiefes Verständnis für die Nutzer:innen und ihre Probleme zu entwickeln. Das erreichen wir durch Beobachtungen, Interviews und andere Methoden der Nutzerforschung.
- Problemdefinition: Auf Basis der gesammelten Erkenntnisse wird nun das Problem klar definiert. In dieser Phase werden oft Personas und Szenarien erstellt, um die spezifischen Bedürfnisse und Herausforderungen der Nutzer:innen zu verdeutlichen.
- Ideenfindung: In dieser kreativen Phase generieren wir dann Lösungsansätze. Wir setzen Methoden wie Brainstorming oder Brainwriting ein, um ganz unterschiedliche Ideen anhand von Wireframes zu entwickeln, aus denen später ausgewählt werden kann.
- Prototyping: Die besten Ideen werden in greifbare Prototypen umgesetzt. Diese können ruhig einfach und kostengünstig realisiert sein, solange sie die Kernfunktionalitäten und das Designkonzept gut vermitteln.
- Testen: Die Prototypen werden nun echten Nutzer:innen vorgestellt, um Feedback zu sammeln. Die Erkenntnisse aus dem Testing können zu Anpassungen am Prototyp führen und oft auch zu einer Neubewertung des ursprünglich definierten Problems.
Schritt 1 und 2 zum erfolgreichen UX-Design: Nutzerforschung und Erkenntnisgewinn
Wie so oft gilt auch hier der Grundsatz „Kenne deine Zielgruppe!“. Gutes UX-Design beginnt daher immer mit einer detaillierten Zielgruppenanalyse. Durch verschiedene Methoden gewinnen unsere UX-Designer:innen tiefe Einblicke in die Bedürfnisse, Wünsche und Verhaltensweisen der späteren Nutzer:innen. Dazu suchen wir Antworten auf Fragen wie:
- Was benötigen/erwarten die Nutzer:innen wirklich von der Plattform (Bedürfnisse)?
- Wie interagieren sie mit ähnlichen Plattformen (Verhalten)?
- Was motiviert sie oder führt gar zu Unzufriedenheit (Motivation und Frustration)?
- In welchem Zusammenhang beziehungsweise unter welchen Umständen werden Plattformen wie diese bisher genutzt (Kontext)?
Methoden der Nutzerforschung
Wie kommen wir im Rahmen der Nutzerforschung an die Antworten, die wir suchen, also zu den Erkenntnissen, die wir für gutes UX-Design benötigen? Hierzu setzen wir bei der Counterpart Group je nach Bedarf auf unterschiedliche Methoden:
- Interviews: Wir gehen mit einzelnen Nutzer:innen der anvisierten Zielgruppe ins direkte Gespräch, um ihre Meinungen und Erfahrungen zu verstehen.
- Beobachtungen und Usability-Tests: Wir analysieren das Verhalten von Nutzer:innen, während sie beispielsweise eine Website verwenden. Ziel ist die objektive Bewertung, wie leicht oder schwer es fällt, bestimmte Aufgaben mit einer Website oder einem Prototyp zu erledigen.
- Fokusgruppen-Analysen: Wir moderieren Diskussionen mit einer Gruppe von für unsere Auftraggeber:innen interessanten Nutzer:innen, um verschiedene Perspektiven zu einem Projekt wie einer Website oder zu einem Thema zu sammeln.
- Umfragen und Fragebögen: Über diesen Weg erheben wir Daten einer weiter gefassten Nutzerbasis, um Trends und Muster im größeren Maßstab zu erkennen.
- A/B-Tests: Hierbei vergleichen wir zwei Versionen von Lösungen miteinander, um zu sehen, welche bei den Nutzer:innen besser ankommt und warum.
Aus dieser Datenerhebung identifizieren unsere UX-Designer:innen nützliche Muster und ziehen für alle weiteren Schritte die nötigen Schlüsse. Personas, Nutzungsszenarien oder sogenannte Customer Journey Maps helfen uns dabei. Denn sie visualisieren und organisieren die gewonnenen Erkenntnisse so, dass unser Designteam sie optimal weiterverarbeiten kann.
Schritt 3 bis 5: Wireframing und Prototyping im UX-Design
Nach umfangreichen Analysen und Vorbereitungen geht es nun ans Eingemachte. Zwei zentrale Techniken im eigentlichen UX-Designprozess sind das Wireframing und das Prototyping. Beide Methoden dienen dazu, Ideen schnell zu visualisieren und Feedback zu sammeln, bevor erhebliche Ressourcen in die Entwicklung investiert werden.
Obwohl Wireframing und Prototyping oft im gleichen Atemzug genannt werden, dienen sie unterschiedlichen Zwecken im Designprozess. Wireframes sind typischerweise statisch und fokussieren sich auf die Layout-Planung, während Prototypen dynamisch sind und das tatsächliche Nutzererlebnis simulieren. In der Praxis ergänzen sich beide Techniken: Wireframes werden in der Regel zuerst erstellt, dann folgen die Prototypen, die helfen, das Design weiter zu verfeinern.
Wireframing: Ein erstes, grobes Modell entsteht
Ein Wireframe ist eine grundlegende visuelle Darstellung der Benutzeroberfläche
einer Website, App oder einer anderen digitalen Anwendung. Es handelt sich im Wesentlichen um ein Skelett des Designs (wörtlich übersetzt: ein Drahtgestell), das – noch ohne Stilelemente wie Farben oder Grafiken – die wichtigsten Komponenten und deren Anordnung aufzeigt. Zweck und Nutzen von Wireframes lassen sich wie folgt beschreiben:
- Schnelle Strukturierung: Wireframes helfen dabei, die grundlegende Struktur einer Website oder App zu planen, bevor Details hinzugefügt werden.
- Leichte Kommunikation: Sie erleichtern die Kommunikation zwischen Designer:innen, Entwickler:innen und Stakeholder:innen, indem sie eine klare, einfache Visualisierung der Seitenlayout-Pläne bieten.
- Funktionaler Lösungsweg: Wireframes lenken die Aufmerksamkeit auf Usability und Funktionalität, statt auf die Optik („form follows function“).
- Flexible Methodik: Wireframes können sowohl digital mithilfe von Tools wie Sketch, Adobe XD oder Figma erstellt werden, als auch handschriftlich auf Papier. Die Wahl der Methode hängt von der Schnelligkeit und Flexibilität ab, die im frühen Stadium des Designprozesses benötigt werden.
Prototyping: Das Modell wird erlebbar
Ein Prototyp ist eine interaktive Demo, die es ermöglicht, das Design und die Funktionalität vor der eigentlichen Entwicklung ausgiebig zu testen. Prototypen gibt es in verschiedenen Detailtiefen – von sehr rudimentären Mockups bis hin zu hochfunktionalen, interaktiven Simulationen. Sie wollen am liebsten gleich mit der finalen Entwicklung loslegen und sich diesen Schritt sparen? Keine gute Idee. Denn hier werden nach den noch recht rudimentären Wireframes wichtige Funktionalitäten festgelegt, die sich unmittelbar auf die User Experience und die Usability auswirken.
- Interaktivität: Im Gegensatz zu Wireframes ermöglichen Prototypen die Interaktion mit der Benutzeroberfläche. Hier wird schnell klar, was gut funktioniert und was nicht.
- Feedback: Prototypen dienen auch dazu, Nutzerfeedback zu sammeln und die ursprünglichen Konzepte hinter einer Entwicklung frühzeitig zu validieren.
- Optimierung: Durch iterative Tests mit Prototypen lassen sich die Designs schrittweise verfeinern und verbessern.
- Flexibilität: Tools wie Adobe XD, Figma und Axure ermöglichen es, nicht nur visuelle Elemente und Funktionen zu integrieren, sondern versetzen uns auch in die Lage, Anpassungen schnell umzusetzen und mehrere Varianten zu testen.
Exkurs: Analoges UX-Design
Auch wenn wir uns in diesem Beitrag auf das digitale UX-Design fokussieren, sind die Prinzipien dahinter nicht auf digitale Produkte beschränkt. UX-Design spielt auch im analogen Bereich eine wichtige Rolle. Jedes Produkt oder jede Dienstleistung, die eine Interaktion zwischen Mensch und System erfordert, kann von den hier aufgeführten Prinzipien profitieren.
Im analogen Kontext bezieht sich das auf die Gestaltung physischer Produkte, Printmedien oder sogar Räumen. Denn auch hier geht es darum, die User Experience durch eine durchdachte und benutzerorientierte Gestaltung positiv zu beeinflussen, um die Zufriedenheit und Effizienz der Nutzer:innen zu steigern
UX-Design von der Counterpart Group
Wir bei der Counterpart Group sind Expert:innen im Bereich UX-Design und helfen auch Ihnen gerne, mit gut durchdachtem Design Ihre Ziele zu erreichen. Wir unterstützen Sie sowohl bei kompletten Neuentwicklungen als auch der Optimierung bereits bestehender Anwendungen. Übrigens: Als Full-Service-Agentur bieten wir noch mehr als „nur“ UX-Design. Bei uns erhalten Sie alle Dienstleistungen rund um die Erstellung und Entwicklung von Digitalprojekten, Brand-Marketing und PR aus einer Hand. E-Mail genügt: [email protected]
Verfasst von unserer Expertin Annina