Benutzerflüsse: Was sie sind und warum sie im UX-Design wichtig sind15 min read

Großartiger UX fängt nicht mit Pixeln an. Es beginnt damit, zu verstehen, was Benutzer tun möchten, wo sie ein Produkt eingeben, welche Entscheidungen sie treffen müssen und welcher Weg sie zu einem erfolgreichen Ergebnis führt.

Dieser Weg heißt a Benutzerfluss.

Ein Benutzerfluss ist eine visuelle Karte der Schritte, die eine Person durch eine App, Website oder eine bestimmte Aufgabe unternimmt. Es kann ein vollständiges Produkterlebnis zeigen, wie etwa das Onboarding in eine SaaS-App, oder einen kleineren Ablauf, wie etwa die Anmeldung, die Buchung einer Demo, das Abonnieren eines Newsletters oder den Abschluss des Bezahlvorgangs.

Für UX-Designer, Produktteams und Gründer sind Benutzerflüsse eine der einfachsten Möglichkeiten, bessere Schnittstellen zu entwerfen, bevor sie sich auf detaillierte Bildschirme festlegen. Sie helfen Ihnen zu erkennen, wo Benutzer verwirrt sein könnten, wo ein Flow zu viele Schritte hat und welche Bildschirme Sie tatsächlich entwerfen müssen.

In diesem Leitfaden erklären wir, was Benutzerflüsse sind, wie man sie liest, wann man sie erstellt und wie sie ein besseres UX-Design unterstützen.

Versuchen Sie, Benutzerflüsse mit KI zu entwerfen

Beschreiben Sie den Benutzerfluss, den Sie entwerfen möchten, und lassen Sie ihn dann von Anima in UX, Bildschirme und Code umwandeln.

Was ist ein Benutzerfluss?

A Benutzerfluss ist ein Diagramm, das den Weg zeigt, den ein Benutzer nimmt, um ein Ziel innerhalb eines Produkts zu erreichen. Im UX-Design ist dieses Produkt normalerweise eine App, Website, Web-App oder ein digitaler Dienst.

Ein Benutzerfluss beginnt mit einem Einstiegspunkt, z. B. einer Startseite, einer Zielseite, einem Suchergebnis, einem E-Mail-Link, einem Anmeldebildschirm oder einem Warenkorb. Es endet mit einer abschließenden Interaktion, z. B. dem Erstellen eines Kontos, dem Abschluss eines Kaufs, dem Absenden eines Formulars, dem Veröffentlichen eines Projekts oder dem Aufrufen einer Bestätigungsseite.

Ein Benutzerfluss kann Folgendes darstellen:

• Eine vollständige Produktreise, wie das Entdecken, Anmelden und Verwenden einer neuen App
• Eine einzelne Aufgabe, wie das Zurücksetzen eines Passworts oder das Aktualisieren eines Plans
• Ein Funktionsablauf, wie das Erstellen eines Projekts, das Einladen eines Teamkollegen oder das Exportieren eines Designs
• Ein Benutzeroberflächenablauf, der zeigt, wie Bildschirme innerhalb des Produkts verbunden sind

Das Ziel ist einfach: Machen Sie den Weg des Benutzers klar, bevor Sie die Benutzeroberfläche im Detail entwerfen.

Ein Beispiel für eine grundlegende Benutzerflussstruktur

Benutzerfluss vs. Benutzeroberflächenfluss

Die Bedingungen Benutzerfluss Und Benutzeroberflächenfluss sind eng miteinander verbunden.

Ein Benutzerfluss konzentriert sich auf den Weg des Benutzers zu einem Ziel. Es beantwortet Fragen wie:

• Wo beginnt der Benutzer?
• Welche Aktion versuchen sie abzuschließen?
• Welche Entscheidungen treffen sie unterwegs?
• Was passiert, wenn sie Erfolg haben, scheitern oder einen anderen Weg einschlagen?

Ein Benutzeroberflächenfluss konzentriert sich insbesondere auf die Verbindung von Bildschirmen, Zuständen, Schaltflächen, Formularen und Schnittstellenelementen. Es beantwortet Fragen wie:

• Welcher Bildschirm kommt nach diesem?
• Was passiert, wenn der Benutzer auf diese Schaltfläche klickt?
• Wohin führt dieser Fehlerzustand?
• Was sieht der Benutzer nach dem Absenden des Formulars?

In der Praxis verwenden UX-Teams häufig beides zusammen. Der Benutzerfluss definiert den Pfad. Der Ablauf der Benutzeroberfläche konkretisiert diesen Pfad innerhalb des Produkts UI.

So lesen Sie einen Benutzerfluss

Ein Benutzerfluss legt die Schritte fest, die ein Benutzer vom Einstiegspunkt bis zur endgültigen Interaktion unternimmt. Jeder Schritt wird normalerweise durch eine Form dargestellt, die auch Knoten genannt wird. Die Knoten sind durch Pfeile verbunden, die die Bewegungsrichtung anzeigen.

Die meisten Benutzerflussdiagramme verwenden eine einfache visuelle Sprache:

• Kreis oder Oval: Start- oder Endpunkt
• Rechteck: Bildschirm, Seite oder Aktion
• Diamant: Entscheidungspunkt, z. B. Ja/Nein, Erfolg/Misserfolg oder Pfad wählen
• Pfeil: Bewegungsrichtung zwischen den Schritten

Benutzerflusskomponenten erklärt

Ein einfacher Anmelde-Benutzerablauf könnte beispielsweise so aussehen:

1. Der Benutzer landet auf der Startseite
2. Benutzer klickt auf „Kostenlos starten“
3. Der Benutzer gibt E-Mail und Passwort ein
4. Das System prüft, ob die E-Mail gültig ist
5. Benutzer bestätigt Konto
6. Der Benutzer erreicht den Onboarding-Bildschirm
7. Der Benutzer schließt die Einrichtung ab
8. Der Benutzer landet im Dashboard

Diese Art von Benutzerflussbeispiel hilft dem Team, die Erfahrung zu verstehen, bevor jeder Bildschirm entworfen wird.

Beispiele für Benutzerflüsse

Benutzerabläufe werden einfacher zu verstehen, wenn Sie sie mit realen Produktaufgaben verbinden. Hier sind ein paar gängige Benutzerflussbeispiele, die UX-Teams während der Produktplanung erstellen.

Benutzerablauf bei der Anmeldung

Ein Anmeldebenutzerfluss bildet ab, wie ein neuer Besucher zu einem registrierten Benutzer wird.

1. Besuchen Sie die Zielseite
2. Klicken Sie auf „Anmelde-CTA“.
3. Wählen Sie die Anmeldemethode
4. Geben Sie die Kontodaten ein
5. E-Mail bestätigen
6. Komplettes Onboarding
7. Erreichen Sie das Produkt-Dashboard

Dieser Ablauf hilft Teams, Reibungsverluste bei der ersten Erfahrung zu reduzieren. Wenn die Anmeldung zu viele Schritte, unklare Formularfelder oder verwirrende Verifizierungsstatus umfasst, kann es sein, dass Benutzer abbrechen, bevor sie das Produkt jemals gesehen haben.

Benutzerfluss beim Auschecken

Ein Checkout-Benutzerfluss bildet ab, wie ein Benutzer vom Produktinteresse zum Kauf gelangt.

1. Produkt- oder Preisseite anzeigen
2. Artikel hinzufügen oder Plan auswählen
3. Überprüfen Sie die Warenkorb- oder Plandetails
4. Geben Sie Zahlungsinformationen ein
5. Bestätigen Sie den Kauf
6. Erreichen Sie die Erfolgsseite oder Quittung

Dieser Ablauf ist besonders wichtig für E-Commerce, SaaS und Abonnementprodukte, da sich jeder zusätzliche Schritt auf die Konvertierung auswirken kann.

Benutzerfluss für Anmeldung und Zurücksetzen des Passworts

Ein Anmeldefluss bildet ab, wie wiederkehrende Benutzer auf ihr Konto zugreifen, einschließlich Grenzfällen.

1. Anmeldeseite öffnen
2. Geben Sie Ihre Anmeldedaten ein
3. Das System validiert die Eingabe
4. Der Benutzer meldet sich erfolgreich an oder sieht einen Fehler
5. Bei Bedarf startet der Benutzer das Zurücksetzen des Passworts
6. Benutzer bestätigt E-Mail
7. Der Benutzer legt ein neues Passwort fest
8. Der Benutzer kehrt zum Produkt zurück

Ein Beispiel für den Benutzerfluss für einen Anmeldevorgang (Aufgabenfluss)

Onboarding-Benutzerfluss

Ein Onboarding-Benutzerfluss bildet ab, wie neue Benutzer ihren ersten erfolgreichen Produktmoment erreichen.

1. Benutzerkonto erstellen
2. Beantworten Sie Einrichtungsfragen
3. Wählen Sie eine Vorlage oder einen Ausgangspunkt
4. Schließe die erste Aktion ab
5. Siehe Erfolgsstatus
6. Weiter zum Produkt

Für KI-Produkte, Design-Tools und Produktivitäts-Apps sind Onboarding-Abläufe von entscheidender Bedeutung, da Benutzer schnell verstehen müssen, was als nächstes zu tun ist.

Wann ein Benutzerfluss erstellt werden soll

Erstellen Sie Benutzerflüsse früh im Designprozess, idealerweise nach der ersten Benutzerrecherche und vor dem High-Fidelity-UI-Design.

In dieser Phase hilft Ihnen ein Benutzerfluss:

• Entscheiden Sie, welche Bildschirme vorhanden sein müssen
• Entfernen Sie unnötige Schritte
• Identifizieren Sie verwirrende Entscheidungspunkte
• Richten Sie das Team an der Produktstruktur aus
• Planen Prototypen Schneller
• Vermeiden Sie es, polierte Bildschirme für einen unterbrochenen Weg zu entwerfen

Benutzerflüsse sind auch später im Produktlebenszyklus nützlich. Wenn eine vorhandene Schnittstelle leistungsschwach ist, kann Ihnen ein Benutzerfluss dabei helfen, zu diagnostizieren, wo Personen abbrechen, sich in einer Schleife befinden oder wichtige Aufgaben nicht erledigen.

Mit anderen Worten: Benutzerströme gelten nicht nur für neue Produkte. Sie eignen sich auch zur Verbesserung bestehender Produkte.

Die Rolle von Benutzerflüssen im UX-Design

Benutzerflüsse sind ein zentraler Bestandteil des UX-Designs, da sie Benutzerziele mit der Produktstruktur verbinden. Bevor Sie sich Gedanken über Abstände, Typografie, visuelle Hierarchie oder Komponenten machen, müssen Sie wissen, was der Benutzer erreichen möchte und wie das Produkt ihm dabei hilft, dieses Ziel zu erreichen.

Benutzerflüsse helfen UX-Teams dabei, drei wichtige Dinge zu tun.

1. Erstellen Sie eine intuitivere Benutzeroberfläche

Ein klarer Benutzerfluss erleichtert das Verständnis der endgültigen Benutzeroberfläche.

Wenn Sie den Ablauf vor dem Entwerfen abbilden, können Sie Reibungsverluste frühzeitig erkennen. Möglicherweise muss ein Benutzer eine Entscheidung treffen, bevor er über genügend Informationen verfügt. Möglicherweise erscheint ein Formular zu früh. Möglicherweise fehlt der Bestätigungsschritt. Vielleicht gibt es drei Bildschirme, bei denen einer ausreichen würde.

Wenn der Ablauf verwirrend ist, wird wahrscheinlich auch die Schnittstelle verwirrend sein.

2. Bewerten Sie eine vorhandene Schnittstelle

Benutzerflüsse sind eine großartige Möglichkeit, bestehende Produkte zu optimieren, die möglicherweise nicht wie erwartet konvertieren oder behalten. Wenn Benutzer eine wichtige Aufgabe nicht konvertieren, aktivieren oder abschließen, ordnen Sie den aktuellen Ablauf zu.

Möglicherweise stellen Sie fest, dass Benutzer auf den falschen Bildschirm weitergeleitet, nach zu vielen Informationen gefragt oder gezwungen werden, einen Pfad zu durchlaufen, der nicht ihrer Absicht entspricht.

3. Vermitteln Sie Ihre Strategie den Teammitgliedern und Stakeholdern

Benutzerflüsse eignen sich hervorragend für die Zusammenarbeit. Sie bieten Designern, Entwicklern, PMs, Entscheidungsträgern und Stakeholdern eine gemeinsame Übersicht über die Erfahrung.

Designer können den Flow zum Planen von Bildschirmen verwenden. Entwickler können damit Zustände und Randfälle verstehen. PMs können damit Anforderungen klären. Stakeholder können damit die Logik der Erfahrung überprüfen, bevor das Team in detailliertes Design oder Implementierung investiert.

Benutzerflüsse können Entwicklern auch dabei helfen, das Gesamtbild zu verstehen Struktur hinter Ihrem endgültigen Prototyp, was macht weiterleiten effizienter.

User Journey vs. User Flow

User Journeys und User Flows werden oft verwechselt, sind aber nicht dasselbe.

A Benutzerreise erzählt die umfassendere Geschichte der Beziehung eines Benutzers zu einem Produkt. Dazu gehören in der Regel Benutzerziele, Emotionen, Motivationen, Schmerzpunkte und Berührungspunkte vor, während und nach der Produktnutzung.

A Benutzerfluss konzentriert sich auf den Weg, den ein Benutzer innerhalb des Produkts nimmt, um ein bestimmtes Ziel zu erreichen.

Hauptunterschiede

Beides ist nützlich. Die Journey hilft Ihnen, den Kontext des Benutzers zu verstehen. Der Ablauf hilft Ihnen, den tatsächlichen Pfad durch die Schnittstelle zu entwerfen.

So erstellen Sie einen Benutzerfluss

Sie können einen Benutzerfluss mit einem Whiteboard, einem Designtool, einem Diagrammtool oder einem KI-Designtool erstellen. Das Format ist weniger wichtig als die Klarheit des Pfades.

1. Definieren Sie das Benutzerziel

Beginnen Sie mit der Aktion, die der Benutzer ausführen möchte.

• Ein Konto erstellen
• Kaufen Sie ein Produkt
• Buchen Sie eine Demo
• Veröffentlichen Sie eine Website
• Laden Sie einen Teamkollegen ein
• Exportieren Sie ein Design in Code

Ein Benutzerfluss sollte um ein bestimmtes Ziel herum aufgebaut sein, nicht um einen vagen Produktbereich.

2. Wählen Sie den Einstiegspunkt

Entscheiden Sie, wo der Benutzer beginnt. Beispiele hierfür sind eine Homepage, eine Preisseite, ein Suchergebnis, eine E-Mail-Kampagne, ein App-Dashboard, eine Benachrichtigung oder ein freigegebener Link.

Unterschiedliche Einstiegspunkte können unterschiedliche Abläufe erzeugen. Ein wiederkehrender Benutzer und ein Erstbesucher benötigen möglicherweise nicht denselben Pfad.

3. Planen Sie den glücklichen Weg

Der glückliche Weg ist der einfachste erfolgreiche Weg vom Anfang bis zum Ziel.

1. Der Benutzer öffnet die Preisseite
2. Der Benutzer wählt den Plan aus
3. Benutzer erstellt Konto
4. Der Benutzer gibt Zahlungsdetails ein
5. Der Benutzer bestätigt den Kauf
6. Der Benutzer landet auf der Erfolgsseite

Dies gibt Ihnen das Grunderlebnis.

4. Fügen Sie Entscheidungen und Randfälle hinzu

Echte Benutzer folgen nicht immer dem perfekten Weg. Fügen Sie Entscheidungspunkte hinzu wie:

• Hat der Benutzer bereits ein Konto?
• Ist das Formular gültig?
• War die Zahlung erfolgreich?
• Hat der Benutzer eine monatliche oder jährliche Abrechnung gewählt?
• Hat der Benutzer die Berechtigung zum Fortfahren?
• Was passiert, wenn der Benutzer kündigt?

Diese Zweige verwandeln einen einfachen Pfad in einen echten UX-Design-Benutzerfluss.

5. Vereinfachen Sie den Ablauf

Sobald der Fluss kartiert ist, suchen Sie nach Reibung.

• Können wir einen Schritt entfernen?
• Können wir Bildschirme kombinieren?
• Fragen wir zu früh nach Informationen?
• Ist die nächste Aktion offensichtlich?
• Gibt es eine Sackgasse?
• Sind Fehlerzustände klar?
• Weiß der Benutzer immer, was passiert ist?

Die besten Benutzerflüsse scheinen offensichtlich zu sein, da die Komplexität bereits hinter den Kulissen gelöst wurde.

Benutzerflüsse auf den Punkt gebracht

Benutzerflüsse sind Strukturkarten für das Produktdesign. Sie zeigen, wie Benutzer eine App, Website oder Aufgabe vom Einstiegspunkt bis zur endgültigen Interaktion durchlaufen.

Ein starker Benutzerfluss:

• Beginnt mit einem klaren Benutzerziel
• Zeigt den Einstiegspunkt des Benutzers an
• Ordnet die Schritte, Bildschirme und Entscheidungen im Pfad zu
• Enthält wichtige Randfälle
• Hilft Teams, Reibungen vor dem detaillierten UI-Design zu erkennen
• Erleichtert die Übergabe für Designer, Entwickler, PMs und Stakeholder

Für UX-Teams sind Benutzerflüsse eines der praktischsten Werkzeuge, um Benutzerrecherchen in eine Schnittstellenstruktur umzuwandeln. Sie helfen Ihnen, mit Absicht zu entwerfen, anstatt Bildschirm für Bildschirm zu raten.

FAQ: Benutzerflüsse

Was sind Benutzerströme?

Benutzerflüsse sind Diagramme, die den Weg zeigen, den ein Benutzer durch eine App, Website oder Produktaufgabe nimmt. Sie beginnen normalerweise an einem Einstiegspunkt, etwa einer Homepage oder einem Anmeldebildschirm, und enden, wenn der Benutzer ein Ziel erreicht, etwa eine Anmeldung, einen Kauf oder das Absenden eines Formulars.

Was ist ein Benutzerfluss im UX-Design?

Im UX-Design bildet ein Benutzerfluss die Schritte, Bildschirme, Entscheidungen und Aktionen ab, die ein Benutzer ausführt, um ein Ziel zu erreichen. UX-Teams nutzen Benutzerabläufe, um die Produktstruktur zu planen, Reibungsverluste zu reduzieren und klarere Schnittstellen zu entwerfen, bevor sie hochauflösende Bildschirme erstellen.

Was ist der Unterschied zwischen einem User Flow und einer User Journey?

Eine User Journey zeigt das umfassendere Erlebnis, einschließlich Benutzermotivationen, Emotionen, Schmerzpunkte und Berührungspunkte. Ein Benutzerfluss konzentriert sich auf den spezifischen Pfad, den ein Benutzer innerhalb des Produkts nimmt, um eine Aufgabe abzuschließen.

Was ist ein Benutzeroberflächenfluss?

Ein Benutzeroberflächenfluss zeigt, wie Bildschirme, UI-Zustände, Schaltflächen, Formulare und Interaktionen innerhalb eines Produkts miteinander verbunden sind. Es hängt eng mit einem Benutzerfluss zusammen, konzentriert sich jedoch spezieller auf den Pfad auf Schnittstellenebene.

Wann sollten Sie einen Benutzerfluss erstellen?

Erstellen Sie einen Benutzerfluss nach der ersten Benutzerrecherche und vor dem detaillierten UI-Design. Sie können Benutzerflüsse auch später erstellen, um ein vorhandenes Produkt zu prüfen, Abbrüche zu diagnostizieren oder die Konvertierung zu verbessern.

Was sind Beispiele für Benutzerströme?

Zu den gängigen Beispielen für Benutzerabläufe gehören Anmeldeabläufe, Checkout-Abläufe, Onboarding-Abläufe, Anmeldeabläufe, Kennwortzurücksetzungsabläufe, Buchungsabläufe, Upgrade-Abläufe und Abläufe zum Einladen von Teamkollegen.

Warum sind Benutzerströme wichtig?

Benutzerflüsse helfen Teams zu verstehen, wie sich Benutzer durch ein Produkt bewegen, bevor sie in detailliertes Design oder Entwicklung investieren. Sie offenbaren schon früh im Prozess Reibungen, fehlende Schritte, verwirrende Entscheidungen und unnötige Komplexität.

Wie bringt man einen Benutzer zum Fließen?

Beginnen Sie mit einem Benutzerziel, wählen Sie den Einstiegspunkt, bilden Sie den glücklichen Pfad ab, fügen Sie Entscheidungen und Randfälle hinzu und vereinfachen Sie dann den Pfad. Verwenden Sie Kreise oder Ovale für Start- und Endpunkte, Rechtecke für Bildschirme oder Aktionen, Rauten für Entscheidungen und Pfeile, um die Richtung anzuzeigen.

Probieren Sie Anima Playground für Benutzerflüsse und UX-Design aus

Anima Playground ermöglicht Ihnen den Übergang von der Produktidee zum UX-Flow, zum Design und zum Arbeitscode im Browser. Beschreiben Sie das Erlebnis, das Sie schaffen möchten, verfeinern Sie es mit KI und verwandeln Sie das Ergebnis in ein echtes interaktives Produkt.

Beginnen Sie mit dem Entwerfen mit Anima Playground.