Was ist UX Design? Definition, Prozess, Methoden & Tools einfach erklärt
Inhalt
- UX Design eine Definition
- Abgrenzung wichtiger Begriffe
- Warum ist UX Design wichtig?
- 7 Faktoren für gutes UX Design
- Der UX-Design-Prozess
- Wichtige UX-Methoden im Überblick
- Was macht ein UX Designer?
- UX Design und Barrierefreiheit
- Mobile UX Design
- UX-Design-Tools
- Quellen
dotflow®
dotflow ist die B2B Digitalagentur für smartes Online-Marketing und überzeugende Websites.
UX Design (User Experience Design) ist die Gestaltung und Optimierung des gesamten Nutzungserlebnisses eines Produkts – meist einer Website oder App. Ziel ist es, dass Nutzerinnen und Nutzer ihr Ziel möglichst einfach, effizient und angenehm erreichen. UX Design betrachtet dabei das Erlebnis vor, während und nach der Nutzung.
Der Begriff wirkt oft abstrakt, weil er so viele Themen umspannt, von der Nutzerforschung über die Struktur einer Seite bis hin zur Barrierefreiheit. In diesem Beitrag erklären wir Ihnen Schritt für Schritt, was UX Design bedeutet, wie es sich von verwandten Begriffen abgrenzt, welche Phasen der UX-Prozess durchläuft und mit welchen Methoden und Tools UX-Designer arbeiten.
UX Design eine Definition
„User Experience“ bedeutet übersetzt „Nutzererlebnis“. UX Design ist folglich die Disziplin, die dieses Erlebnis bewusst gestaltet. Geprägt wurde der Begriff Anfang der 1990er-Jahre vom Kognitionswissenschaftler Don Norman, der damals bei Apple tätig war. Sein Kerngedanke: Das Erlebnis eines Menschen mit einem Produkt umfasst weit mehr als nur die reine Bedienung der Oberfläche.
Eine anerkannte, formale Definition liefert die internationale Norm DIN EN ISO 9241-210. Sie beschreibt User Experience als die Wahrnehmungen und Reaktionen einer Person, die aus der tatsächlichen oder erwarteten Nutzung eines Produkts, Systems oder einer Dienstleistung entstehen. Dazu zählen Emotionen, Vorstellungen, Vorlieben und Verhaltensweisen.
Wichtig ist der Zeitbezug: Das Nutzererlebnis beschränkt sich nicht auf den Moment der Nutzung, sondern umfasst drei Phasen:
- Vor der Nutzung: die Erwartung und das Bild, das jemand vom Produkt hat, noch bevor er es verwendet.
- Während der Nutzung: die tatsächliche Bedienung – idealerweise effektiv, effizient und ohne Frust.
- Nach der Nutzung: die emotionale Bindung, Erinnerung und Weiterempfehlung – oder eben die Distanz zum Produkt.
Unter einem „Produkt“ versteht man im digitalen Bereich übrigens meist eine Website oder eine App. Gutes UX Design sorgt dafür, dass der Kontakt zwischen Mensch und digitalem Produkt an all diesen Punkten positiv verläuft.
Abgrenzung wichtiger Begriffe
Rund um UX Design tauchen viele ähnliche Begriffe auf, die gerne verwechselt werden. Hier die wichtigsten Abgrenzungen – kurz und verständlich.
UX vs. UI Design: der wichtigste Unterschied
Die häufigste Verwechslung betrifft UX und UI. UI Design (User Interface Design) kümmert sich um die visuelle Benutzeroberfläche – also alles, was Nutzer sehen und anklicken: Layout, Farben, Buttons, Typografie und Icons. UX Design betreut dagegen den kompletten Prozess und das gesamte Erlebnis. Vereinfacht gilt: UX legt fest, wie sich etwas anfühlt und funktioniert; UI bestimmt, wie es aussieht.
Beide Disziplinen verfolgen dasselbe Ziel – ein einfaches, intuitives Produkt – und sollten eng zusammenarbeiten. Ein Produkt kann mit mittelmäßigem Interface funktionieren, mit einer schlechten User Experience jedoch kaum. Die folgende Tabelle zeigt die Unterschiede auf einen Blick:
| Aspekt | UX-Design | UI-Design |
|---|---|---|
| Was wird gestaltet? | z.B. Struktur, Navigation, Informationsarchitektur, Abläufe | z.B. Screendesigns, Buttons, visuelle Elemente |
| Leitfrage | Ist es nützlich und einfach zu bedienen? | Sieht es gut aus und ist es klar gestaltet? |
| Typische Ergebnisse | User Research, Personas, Wireframes, Prototypen | Layout, Farbwelt, Typografie, Buttons, Icons |
| Wie wird gearbeitet? | Datengetrieben: Nutzerinterviews, Tests, Beobachtung von Verhalten | Gestaltungsgetrieben: Bildsprache, Stil, Markenauftritt |
| Ziel | Nutzer erreichen ihr Ziel effizient und zufrieden | Marke vermitteln, Interaktion ansprechend gestalten |
Usability & Utility: die Bausteine der UX
Usability (Gebrauchstauglichkeit) beschreibt, wie effektiv, effizient und zufriedenstellend Nutzer ein Produkt bedienen können. Sie ist ein zentraler Bestandteil der User Experience, aber eben nur ein Teil davon. Neben der Usability zählt auch die Utility (der Nutzwert): die Frage, ob ein Produkt überhaupt die Funktionen bietet, die jemand braucht. Erst beides zusammen ergibt ein wirklich nützliches Produkt – oft zusammengefasst als „Utility + Usability = Nutzen“.
Usability und Utility sind damit Teilmengen der User Experience: Ohne sie entsteht keine gute UX. UX geht aber darüber hinaus und schließt auch Emotionen, Vertrauen und das Gesamterlebnis ein.
Was genau ein Produkt „bedienbar“ macht, lässt sich anhand von fünf Merkmalen beschreiben:
- Effektivität: Nutzer erreichen ihr Ziel zuverlässig und korrekt.
- Effizienz: Sie erreichen es schnell und ohne unnötige Schritte.
- Engagement: Die Nutzung ist angenehm und ansprechend gestaltet.
- Fehlertoleranz: Fehler werden vermieden, und Nutzer können sich leicht davon erholen (z. B. durch eine „Rückgängig“-Funktion).
- Erlernbarkeit: Das Produkt lässt sich leicht erlernen – idealerweise, indem es an vertraute Denkmuster (mentale Modelle) der Nutzer anknüpft.
Interaction Design: ein Teilbereich der UX
Interaction Design (IxD) ist ein weiterer Teilbereich der User Experience. Es beschäftigt sich gezielt mit der Interaktion zwischen Mensch und Produkt – also damit, wie Nutzer Aktionen ausführen und welches Feedback sie dabei erhalten. Dazu gehören Elemente wie Texte (z. B. Button-Beschriftungen), visuelle Darstellung, der genutzte Gerätekontext, zeitbasierte Elemente (Animationen, Sounds) und das resultierende Verhalten. Interaction Design ist ein Baustein von UX Design, nicht sein Ersatz.
UX vs. CX
Ein häufig verwechselter Begriff ist die Customer Experience (CX). Sie beschreibt das Erlebnis eines Kunden mit einer Marke über alle Berührungspunkte hinweg – vom Werbespot über den Kundenservice bis zur Rechnung. UX Design ist ein Teil davon: Es konzentriert sich auf das Erlebnis mit dem konkreten digitalen Produkt. Vereinfacht gilt: CX umfasst die gesamte Marken-Beziehung, UX das Erlebnis mit Website oder App.
Warum ist UX Design wichtig?
Der Nutzer entscheidet über Erfolg oder Misserfolg eines digitalen Produkts. Ist eine Website zu kompliziert oder unübersichtlich, springen Besucher ab und kehren oft nicht zurück. Genau hier setzt UX Design an.
- Höhere Conversion Rate: Eine klare, zielgerichtete Benutzerführung führt mehr Besucher zum Abschluss (Kauf, Anfrage, Anmeldung).
- Geringere Supportkosten: Ein intuitiv bedienbares Produkt verursacht weniger Serviceanfragen und senkt die Kosten für den First-Level-Support.
- Kürzere Entwicklungszeiten: Wer früh mit nutzerzentriertem Vorgehen arbeitet, muss laut Studien deutlich weniger nachbessern und korrigieren.
- Mehr Weiterempfehlungen: Positive Nutzungserlebnisse sorgen für zufriedene Kunden, die das Produkt weiterempfehlen.
- Wettbewerbsvorteil: In gesättigten Märkten entscheiden Nutzer zunehmend anhand des wahrgenommenen Erlebnisses – nicht nur anhand von Preis oder Funktionsumfang.
Ein anschauliches Beispiel ist der Bestellprozess großer Online-Händler: Wenn ein Produkt mit wenigen Klicks im Warenkorb liegt und ohne störende Pop-ups oder unnötiges Suchen bezahlt werden kann, entsteht ein reibungsloses Erlebnis – der Nutzer kommt schnell ans Ziel. Genau solche scheinbar kleinen Optimierungen sind das Ergebnis durchdachten UX Designs und entscheiden häufig darüber, ob ein Kauf abgeschlossen wird oder nicht.
7 Faktoren für gutes UX Design
Woran erkennt man eine gelungene User Experience? Ein bekanntes Modell dafür ist die „User Experience Honeycomb“ (Waben-Modell) des UX-Pioniers Peter Morville. Es beschreibt sieben Faktoren, die ein Produkt erfüllen sollte:
- Nützlich (useful): Das Produkt erfüllt einen echten Zweck oder Bedarf.
- Bedienbar (usable): Nutzer erreichen ihr Ziel einfach und effizient.
- Auffindbar (findable): Inhalte und Funktionen lassen sich leicht finden.
- Glaubwürdig (credible): Nutzer vertrauen dem Produkt und dem Anbieter.
- Begehrenswert (desirable): Design, Marke und Ästhetik wecken positive Gefühle.
- Zugänglich (accessible): Auch Menschen mit Einschränkungen können das Produkt nutzen (Barrierefreiheit).
- Wertvoll (valuable): Das Produkt liefert einen echten Mehrwert – für Nutzer und Anbieter.
Der Faktor Zugänglichkeit verdient dabei besondere Aufmerksamkeit: Barrierefreiheit wird oft unterschätzt, ist in vielen Regionen inzwischen aber gesetzlich vorgeschrieben – und verbessert die Bedienbarkeit häufig für alle Nutzer.
Der UX-Design-Prozess
UX Design folgt keinem einmaligen Geniestreich, sondern einem strukturierten, iterativen Vorgehen. Ein etabliertes Modell (nach ISO 9241-210 zum nutzerzentrierten Gestalten) gliedert den Prozess in vier Phasen, die mehrfach durchlaufen werden:
- Verstehen: Wer sind die Nutzer, und welche Bedürfnisse und Ziele haben sie? Diese Phase liefert die Grundlage – etwa durch Nutzerforschung und Personas.
- Explorieren: Auf Basis der Erkenntnisse werden Ideen und Lösungsansätze entwickelt, etwa in kreativen Formaten wie Design-Sprints.
- Entwerfen: Aus den Ideen entstehen konkrete Konzepte – von Wireframes bis zu klickbaren Prototypen.
- Testen: Echte Nutzer prüfen die Entwürfe. Die Erkenntnisse fließen zurück in die vorherigen Phasen.
Das Kernprinzip lautet Iteration: Man nähert sich der besten Lösung schrittweise, testet, verbessert und wiederholt. Ein verwandtes, ebenfalls sehr bekanntes Modell ist der Design-Thinking-Prozess mit den fünf Schritten Empathize, Define, Ideate, Prototype und Test. Auch er ist bewusst nicht-linear gedacht.
Wichtige UX-Methoden im Überblick
UX-Designerinnen und -Designer greifen auf einen ganzen Werkzeugkasten an Methoden zurück. Je nach Prozessphase kommen unterschiedliche zum Einsatz.
- User Research (Nutzerforschung): Der Oberbegriff für alle Methoden, mit denen man Nutzer und ihre Bedürfnisse kennenlernt.
- User Interviews: Gespräche mit Nutzern, um Ziele, Motivationen und Probleme zu verstehen. Besonders aussagekräftig sind kontextuelle Interviews während der tatsächlichen Nutzung.
- Personas: Fiktive, aus echten Daten abgeleitete Nutzerprofile mit Namen und Hintergrund. Sie halten das Team fokussiert auf reale Nutzer.
- Card Sorting: Nutzer sortieren Begriffe in Kategorien. Ideal, um eine verständliche Informationsarchitektur zu entwickeln.
- Wireframes: Schematische Skizzen einer Seite oder App, die Struktur und Anordnung zeigen – noch ohne fertiges Design.
- Prototyping: Klickbare Modelle (Click-Dummies), mit denen sich Abläufe früh testen lassen, bevor programmiert wird.
- Usability-Testing: Beobachtung echter Nutzer bei konkreten Aufgaben – im Labor oder als Remote-Test. Eine der aussagekräftigsten Methoden überhaupt.
- Feldstudien & Beobachtung: Nutzer werden in ihrer realen Umgebung beobachtet („in the wild“).
- Eye-Tracking: Erfasst, wohin Nutzer blicken – hilfreich, um Aufmerksamkeit und Priorisierung zu verstehen.
- A/B-Tests: Zwei Varianten werden gegeneinander getestet, um datenbasiert die bessere Lösung zu finden.
Was macht ein UX Designer?
Ein UX Designer untersucht, wie Nutzer ein Produkt erleben, und übersetzt diese Erkenntnisse in bessere Gestaltung. Der Beruf ist abwechslungsreich und verbindet analytische mit gestalterischen Aufgaben. Typische Tätigkeiten sind:
- Nutzer verstehen: User Research betreiben, Personas entwickeln, Nutzer befragen und beobachten.
- Konzeption: Webseiten und Apps mittels Wireframes strukturieren, inklusive User Flows und Informationsarchitektur.
- Prototyping: Prototypen und Click-Dummies gestalten und mit Nutzern testen.
- Optimierung: Design-Patterns definieren und Produkte kontinuierlich verbessern, etwa über A/B-Tests.
- Zusammenarbeit: eng mit UI-Designern, Entwicklern und Produktverantwortlichen abstimmen.
UX-Designer benötigt?
Als erfahrene UX/UI-Design Agentur entwickeln wir maßgeschneiderte Lösungen, die Ihre Marke online sichtbar machen und Ihre Zielgruppe überzeugen.
UX Design und Barrierefreiheit
Barrierefreiheit (englisch: Accessibility) bedeutet, ein Produkt so zu gestalten, dass es von möglichst allen Menschen genutzt werden kann – auch von Personen mit Seh-, Hör-, motorischen oder kognitiven Einschränkungen. Sie ist einer der sieben UX-Faktoren und wird in der Praxis oft unterschätzt, obwohl davon ein großer Teil der Bevölkerung profitiert.
Ein wichtiger Nebeneffekt: Wer für Barrierefreiheit gestaltet, verbessert die Bedienbarkeit häufig für alle Nutzer – etwa durch klare Kontraste, verständliche Sprache und eine saubere Struktur.
Mobile UX Design
Ein großer Teil der Nutzung findet heute auf dem Smartphone statt – oft unterwegs, mit kleinem Bildschirm und wechselndem Kontext. Gutes Mobile UX Design berücksichtigt diese Besonderheiten. Bewährt haben sich folgende Prinzipien:
- Mobile First: zuerst für den kleinsten Bildschirm gestalten und die Komplexität von dort aus erhöhen.
- Responsive Design: Layouts passen sich flexibel an unterschiedliche Bildschirmgrößen an.
- Einfache Navigation: wenige Ebenen, klare Beschriftungen und ausreichend große Bedienflächen für Touch-Eingaben.
- Inhalte reduzieren: nur das Wesentliche zeigen und die Ladezeit gering halten – gerade bei instabiler Verbindung.
- Konsistenz über Geräte hinweg: Wer zwischen Smartphone und Desktop wechselt, soll ein einheitliches Erlebnis vorfinden.
UX-Design-Tools
Für jede Phase des UX-Prozesses gibt es passende Software. Die folgenden Tools gehören aktuell zu denen, die in der Praxis primär zum Einsatz kommen:
- Figma: Der De-facto-Standard für UI-Design, Prototyping und Zusammenarbeit im Browser – mit kostenlosem Einstiegsplan.
- Sketch: Etablierter Design-Editor, vor allem bei Mac-Usern verbreitet.
- Framer: Kombiniert Design und interaktives Prototyping, zunehmend mit KI-Funktionen.
- Balsamiq: Spezialisiert auf schnelle, bewusst schlichte Wireframes in der frühen Phase.
- Axure RP: Stark bei komplexen, logikgesteuerten Prototypen und umfangreicher Dokumentation.
- CodePen: Browser-Tool, um HTML-, CSS- und JS-Interaktionen schnell mit echtem Code zu testen und zu teilen.
- UXPin: Prototypen aus echten Code-Komponenten statt Mockups – verhält sich wie das fertige Produkt, direkt an Entwickler übergebbar.
Quellen
Weichert, Quint & Bartel: Quick Guide UX Management (Springer Gabler, 2. Aufl. 2021); Interaction Design Foundation: The Basics of User Experience Design; Henderson (Hrsg.): UI/UX Design Guide (2024); DIN EN ISO 9241-210 (Ergonomie der Mensch-System-Interaktion, menschzentrierte Gestaltung); Barrierefreiheitsstärkungsgesetz (BFSG) sowie WCAG 2.1.