Benutzerfluss-Diagramme – was darunter zu verstehen ist, warum sie wichtig sind und wie sie erstellt werden.

Das Benutzererlebnis (User Experience, UX) auf eurer Website oder in eurer Mobile App kann ausschlaggebend dafür sein, ob jemand bei euch kauft, eine langjährige Anwenderin bzw. ein langjähriger Anwender wird oder zur Konkurrenz wechselt. Ein Benutzerfluss-Diagramm kann euch dabei unterstützen, ein optimales Benutzererlebnis zu entwickeln, um Besucherinnen und Besucher auf eurer Website zu halten und sie als langfristige Kundinnen und Kunden zu gewinnen.

In diesem Leitfaden gehen wir auf die folgenden Themen ein:

Was ist ein Benutzerfluss?

Der Benutzerfluss bezeichnet den Pfad bzw. die Schritte, die eine Kundin oder ein Kunde auf einer Website oder in einer Mobile App durchläuft. Der Begriff Benutzerfluss kann sich auch auf eine Visualisierung bzw. Abbildung dieser vollzogenen Schritte beziehen. Mitunter wird dies auch als Flussdiagramm oder UX-Fluss bezeichnet. Das Diagramm bildet die Schritte ab, die eine Anwenderin oder ein Anwender vom Einstiegspunkt bis zum Ende ihrer bzw. seiner Interaktionen durch ein Produkt vollziehen kann.

Diagram Description automatically generated

Der Zweck eines Benutzerfluss-Diagramms ist es, euch dabei zu unterstützen herauszufinden, an welchen Stellen auf eurer Website oder in eurer Mobile App ihr bestimmte Informationen bereitstellen müsst, um die Anwenderinnen und Anwender davon zu überzeugen, die jeweils gewünschten Aktionen durchzuführen, die sie zu einer erfolgreichen abschließenden Interaktion bewegen.

Benutzerfluss und User Journey werden oft verwechselt. Während sich der Benutzerfluss auf den Pfad der Anwenderinnen und Anwender durch eure Website oder Mobile App konzentriert, umfasst eine User Journey oder Customer Journey sämtliche Interaktionen einer Anwenderin oder eines Anwenders mit eurer Marke auf einer Plattform oder einem Kanal. Dieser Pfad beginnt lange vor dem Besuch eurer Website oder der Nutzung eurer Mobile App und kann sich auch noch fortsetzen, nachdem eine Anwenderin oder ein Anwender euer Produkt verlassen hat. Der Benutzerfluss ist ein Teil der gesamten Customer Journey.

Bedeutung von Benutzerfluss-Diagrammen.

Benutzerfluss-Diagramme sind wie Straßenkarten, die euch helfen, bestmögliche Benutzererlebnisse zu entwickeln. Sie erfüllen mehrere wichtige Zwecke.

Vollzieht die Schritte eurer Anwenderinnen und Anwender nach.

Verschafft euch einen Einblick in die Erlebnisse eurer Anwenderinnen und Anwender beim Navigieren durch eure Website oder Mobile App. Es kann leicht passieren, dass ihr mit dem Produkt eures Unternehmens so vertraut seid, dass Navigation und Benutzererlebnis einfach und unkompliziert erscheinen. Allerdings entspricht das nicht notwendigerweise der Erfahrung eurer Kundinnen und Kunden.

Ein Benutzerfluss-Diagramm hilft euch, den Verlauf auf eurer Website oder in eurer Mobile App aus der Anwenderperspektive nachzuvollziehen. Ihr könnt beobachten, auf was sie dabei stoßen, Reibungsverluste und Hürden identifizieren, Methoden finden, um das Erlebnis nahtlos zu gestalten, und sicherstellen, dass ihr eure Ziele mit den Bedürfnissen eurer Anwenderinnen und Anwender in Einklang bringt.

Visualisiert das Benutzererlebnis.

Ein Benutzerfluss kann euch auch einen Überblick über eure Mobile App vermitteln und veranschaulichen, wie alle Teile und Seiten zusammenarbeiten. Möglicherweise konzentriert ihr euch für ein bestimmtes Projekt auf einen Teilaspekt eurer Website und verliert dabei das große Ganze aus den Augen. Ein Benutzerfluss visualisiert das gesamte Erlebnis, sodass ihr es für jede Customer Journey optimieren könnt.

Ein Benutzerfluss-Diagramm veranschaulicht, wie Seiten und Schritte zusammenwirken und dabei die Navigation einer Anwenderin oder eines Anwenders in eurem Produkt entweder erleichtern oder erschweren. Mithilfe dieser Ansicht könnt ihr leicht Sackgassen, verwaiste Seiten und ungünstig angelegte Pfade erkennen.

Profitiert von einer einfacheren Optimierung eures Benutzerflusses.

Ein weiterer Grund für den Einsatz von Benutzerfluss-Diagrammen ist, dass ihr mit Änderungen experimentieren könnt, bevor sie live geschaltet werden. Wenn eine Änderung der Navigation vorgeschlagen wird oder ein neuer Abschnitt zur Website hinzugefügt werden soll, nehmt diesen zunächst in das Benutzerfluss-Diagramm auf. Auf diese Weise könnt ihr einfach veranschaulichen und erörtern, an welcher Stelle sie nicht nur in die Website-Architektur, sondern auch in die User Journey passt.

Durch die Visualisierung von Änderungen im Benutzerfluss bleibt eure Mobile App anwenderorientiert. Außerdem kann euer Team Probleme identifizieren, bevor sie auftreten. Ihr vermeidet übereilte, unerprobte Änderungen, die den Benutzerfluss ernsthaft beeinträchtigen könnten und deren nachträgliche Korrektur mit einem beträchtlichen Zeit- und Ressourcenaufwand verbunden wäre.

Erleichtert den Erhalt von Feedback.

Bei der Konsolidierung von Feedback verschiedener Team-Mitglieder, insbesondere von Kolleginnen und Kollegen aus Vertrieb und Marketing, die keine UX-Profis sind, stellt ein Benutzerfluss-Diagramm eine effiziente Methode zur Erfassung der Erkenntnisse aller Beitragenden dar.

Da es sich bei Benutzerfluss-Diagrammen um ein visuelles Medium handelt, ist es einfacher, den Beteiligten aller Abteilungen die Mobile-App-Navigation zu veranschaulichen. Ein Benutzerfluss-Diagramm weist einen einfachen Formensatz, leicht zu verfolgende Pfade und nur wenig Text auf, sodass Mitarbeitende unkompliziert Feedback geben können.

So erstellt ihr Benutzerfluss-Diagramme.

Die Erstellung eines Benutzerfluss-Diagramms erfordert Recherchen über Anwenderinnen und Anwender, genaue Kenntnisse über den Wert eures Produkts und kreatives Denken.

1. Macht euch ein genaues Bild von eurer Customer Journey.

Der erste Schritt bei der Erstellung eines Benutzerfluss-Diagramms besteht darin, eure Anwenderinnen und Anwender und deren Customer Journey zu verstehen.

Ihr könnt eure Anwenderinnen und Anwender kennenlernen, indem ihr Käuferprofile erstellt. Ein Käuferprofil ist eine Darstellung eines wichtigen Zielgruppensegments und kann euch dabei unterstützen, die Bedürfnisse, Wünsche, Motivationen und Verhaltensweisen eurer Anwenderinnen und Anwender zu verstehen. Mithilfe von Käuferprofilen könnt ihr herausfinden, welche Informationen auf jeder Seite eurer Website enthalten sein müssen, um Anwenderinnen und Anwender davon zu überzeugen, zum nächsten Schritt im Ablauf zu navigieren.

Zusätzlich zu den Käuferprofilen solltet ihr eine Customer Journey Map erstellen, in der jeder Schritt beschrieben ist, den eine Kundin oder ein Kunde bei euch vom ersten Kontakt bis zum Kauf durchläuft. Das Verständnis der gesamten Customer Journey für jedes Profil gibt Aufschluss darüber, wo ihr mit eurer Website oder Mobile App ansetzen müsst, und kann entscheidende Erkenntnisse für das Benutzererlebnis liefern, das sie bieten sollten. Für Anwenderinnen und Anwender, die sich zu Beginn ihrer Customer Journey mit eurer Website beschäftigen, ist ein anderer Benutzerfluss erforderlich als für Profile, die gegen Ende ihrer Customer Journey mit eurer Mobile App interagieren.

2. Ermittelt euer Ziel und stimmt es mit dem Ziel eurer Anwenderinnen und Anwender ab.

Bestimmte Abschnitte oder Seiten eurer Website dienen unterschiedlichen Zielen – vom Tätigen eines Kaufs über das Abonnieren eures Newsletters bis hin zur Anmeldung für eine kostenlose Testversion oder die Registrierung für ein Webinar. Doch möglicherweise spiegeln diese nicht die Ziele eurer Anwenderinnen und Anwender wider.

Das Identifizieren der Ziele von Anwenderinnen und Anwendern kann sich schwierig gestalten. Aber ihr könnt dazu die Profile und die Customer Journey Map heranziehen, die ihr erstellt habt. Geht den Problemen eurer Kundinnen und Kunden in den verschiedenen Phasen der Customer Journey nach, wenn sie eure Mobile App nutzen. Sobald ihr die Ziele eurer Anwenderinnen und Anwender kennt, könnt ihr den Benutzerfluss so gestalten oder anpassen, dass er sie dort abholt, wo sie sich gerade befinden, ihnen das bietet, wonach sie suchen, und sie zu dem von euch gewünschten Endpunkt führt.

Es mag widersinnig erscheinen, mit den Zielen der Anwenderinnen und Anwender zu beginnen und nicht mit euren eigenen. Aber ihr müsst wissen, was eure Anwenderinnen und Anwender wollen, ehe ihr sie davon überzeugen könnt, bis zum Ende eures Benutzerflusses zu navigieren.

3. Ermittelt, wie eure Anwenderinnen und Anwendern euch finden.

Nachdem ihr nun wisst, wo euer Benutzerfluss endet, könnt ihr als Nächstes klären, wo er beginnt. Überprüft eure Customer Journey Maps und erstellt eine Liste aller Wege, auf denen Anwenderinnen und Anwender euch, euer Produkt und eure Website finden. Euer Benutzerfluss kann zahlreiche Ausgangspunkte haben.

Zu den üblichen Einstiegspunkten für ein Benutzerfluss-Diagramm gehören die folgenden:

Die Art und Weise, wie Anwenderinnen und Anwender auf eure Website gelangen, sagt viel über ihre Bedürfnisse aus und darüber, wie lange sie brauchen, um zu eurem Endpunkt zu gelangen. So weiß beispielsweise ein Anwender, der über direkten Traffic auf eure Website gelangt, vielleicht schon, was er will, und steuert direkt zu eurem Produkt, während ein Anwenderin, die auf eine Anzeige klickt, eure Marke vielleicht noch nicht kennt und aufs Geratewohl auf eurer Website „herumklickt“.

4. Ermittelt, welche Informationen eure Anwenderinnen und Anwender benötigen.

Als Nächstes müsst ihr die Lücken zwischen dem Endpunkt und den verschiedenen Ausgangspunkten eures Benutzerflusses schließen, um genau herauszufinden, wie ihr das Erlebnis eurer Zielgruppe optimieren und sie durch eure Website führen könnt. Nutzt eure Käuferprofile und die Customer Journey Map, um diese Schritte festzulegen, Probleme anzugehen, Bedenken zu zerstreuen und Käuferinnen und Käufern die benötigten Informationen bereitzustellen.

Wenn beispielsweise potenzielle Kundinnen und Kunden immer wieder über eine bezahlte Anzeige auf eure Website gelangen und dann auf die Info-Seite klicken, bedeutet dies, dass eure Zielgruppe wissen möchte, bei wem sie hier kaufen würde. Um das Benutzererlebnis zu optimieren, könntet ihr auf der zielgerichteten Landingpage einige Informationen zu eurem Unternehmen einfügen oder einen eindeutigen CTA erstellen, der von der Produktseite zur Info-Seite führt.

Das Timing für die Präsentation von Informationen ist ebenfalls entscheidend, um sicherzustellen, dass Anwenderinnen und Anwendern das geboten wird, was sie brauchen, um im Benutzerfluss voranzukommen. Überlegt euch, was eure Anwenderinnen und Anwender erreichen möchten, was sie zögern lässt und welche Fragen sie in den einzelnen Phasen haben. Optimiert dann die Schritte in eurem Benutzerfluss, um diese Probleme zum richtigen Zeitpunkt anzugehen.

5. Bildet den Benutzerfluss ab und visualisiert ihn.

In diesem Stadium wisst ihr, was eure Anwenderinnen und Anwender brauchen und wann sie es brauchen – und zwar bei jedem Schritt des Benutzerflusses vom Ausgangs- bis zum Endpunkt. Nun solltet ihr dies visualisieren. Für die Abbildung eures Benutzerflusses könnt ihr ein physisches oder digitales Whiteboard oder ein Software-Programm verwenden, das die Erstellung und Zusammenarbeit erleichtert.

Unabhängig vom verwendeten Tool gibt es einige Standardsymbole, die ihr in eurem Benutzerfluss verwenden werdet.

Bedeutung von Formen und Symbolen.

Benutzerfluss-Diagramme haben eine relativ universelle Formen- und Symbolsprache, sodass jedes Diagramm leicht zu verstehen ist. Verwendet diese Formen, um die verschiedenen Pfade und Entscheidungen in einem Benutzerfluss darzustellen.

In Kombination mit knappen Texten erleichtern diese Formen und Symbole es euch, zu verfolgen, was in jeder Phase eines Benutzerflusses vorgeht.

6. Holt Feedback ein, nehmt Optimierungen vor und finalisiert.

Sobald ihr euer Benutzerfluss-Diagramm fertiggestellt habt, solltet ihr es mit anderen Team-Mitgliedern teilen, um Feedback zu erhalten.

Gebt es an alle Beteiligten in eurem Unternehmen weiter, beispielsweise an die Mitglieder von Design-, Entwickler-, Product-Engineering- sowie Vertriebs- und Marketing-Teams. Die unterschiedlichen Perspektiven all dieser Beteiligten können dazu beitragen, mögliche Reibungspunkte im Benutzerfluss zu identifizieren und bessere Möglichkeiten zu finden, um das Benutzererlebnis zu straffen und zu optimieren. Berücksichtigt das eingegangene Feedback und nehmt ggf. Änderungen vor.

Legt euer fertiges Benutzerfluss-Diagramm den UX-Designerinnen und -Designern, Web- und Software-Entwicklerinnen und -Entwicklern sowie Ingenieurinnen und Ingenieuren vor, die daraus eine praktische digitale Ressource entwickeln. Ihr könnt den Benutzerfluss mit realen Anwenderinnen und Anwendern testen und dieses Feedback nutzen, um eure Website oder Mobile App weiter zu verbessern.

Beispiele für Benutzerfluss-Diagramme.

Hier zwei Beispiele für Benutzerfluss-Diagramme aus der Praxis:

Dieser einfache UX-Fluss nutzt hauptsächlich universelle Formen und Symbole sowie Farben, um die einzelnen Schritte zu darzustellen.

Dieser Benutzerfluss enthält zusätzlich noch Text entlang der Pfeillinien, um die Ergebnisse jeder Entscheidung zu vermitteln, beispielsweise ob die Anwenderin bzw. der Anwender auf „Ja“ oder „Nein“ geklickt hat.

Erstellt eure ersten Benutzerflüsse.

Benutzerfluss-Diagramme unterstützen euch bei der Planung digitaler Ressourcen und sorgen für ein optimales Benutzererlebnis, sodass es einfacher wird, aus Besucherinnen und Besuchern Kundinnen und Kunden zu machen und aus Kundinnen und Kunden lebenslange Anwenderinnen und Anwender. Wenn ihr bereit seid, das Benutzererlebnis eurer Website oder Mobile App zu transformieren, solltet ihr bei den Erkenntnissen ansetzen, die ihr mithilfe eurer Käuferprofile und der zugehörigen Journey Maps gewinnen könnt.

Adobe Customer Journey Analytics liefert eurem Unternehmen wichtige Daten zur Entwicklung von Customer Journeys, die ihr zur Erstellung von Benutzerfluss-Diagrammen für eure Website oder Mobile App verwenden könnt.

Seht euch dieses Einführungsvideo dazu an, wie Adobe Customer Journey Analytics euch dabei unterstützen kann, solide Benutzerflüsse zu entwickeln, indem Daten zum Kundenverhalten aus mehreren Jahren in zentralen Oberfläche zusammengeführt werden.