Das Screen-Flow-Template
Validiere visuelle Bildschirmkomponenten in einem Benutzerfluss und gewinne Erkenntnisse über deine Benutzerinteraktion. Verbessere das Erlebnis auf jeder Plattform.
Über das Screen-Flow-Template
Bildschirmabläufe (auch bekannt als "Wireflows") sind eine Kombination aus Wireframes und Flussdiagrammen. Der durchgängige Ablauf stellt dar, was die Benutzer auf den einzelnen Bildschirmen sehen und wie sich dies auf ihren Entscheidungsprozess in deinem Produkt oder deiner Dienstleistung auswirkt. Mit diesen Informationen kannst du die Entscheidungen, die du bezüglich deines Interaktionsdesigns getroffen hast, besser erklären. Verwende die Screen Flow Vorlage, um neue Möglichkeiten zu finden, das Benutzererlebnis von Anfang bis Ende reibungslos und ohne Frustration zu gestalten. Dies kann eine hilfreiche Ergänzung zu User Storymapping Tools sein. Wenn du daran interessiert bist, deine Arbeit weiterzuentwickeln und in den Bereich des UX-Designs vorzudringen, in dem du die User Journey als Flussdiagramm mit Texten und Symbolen statt mit Bildschirmen darstellen kannst, könnte dich die User Flow-Vorlage interessieren. Auch das UI Design Tool kann dir dabei helfen, ein gutes User Interface für deine Benutzer*innen zu erstellen.
Was ist ein Screen-Flow (Bildschirmablauf)?
Ein Screen-Flow (Bildschirmablauf oder Wireflow) stellt ein Layout mit mehreren Bildschirmen zusammen, die wie ein Flussdiagramm miteinander verbunden sind, um die Entscheidungspunkte und Bewegungen eines Kunden von Anfang bis Ende darzustellen. Wireframes allein geben keinen Aufschluss darüber, wie ein interaktiver, seitenweiser Benutzerfluss aussehen könnte. UX-Flows allein sind eher abstrakt und können dir nicht zeigen, was dein Kunde tatsächlich sieht. Wireflows oder Screen Flows vereinen die Stärken beider Methoden und helfen dir zu zeigen, dass das, was der Benutzer sieht, einen großen Einfluss darauf hat, wie er dein Produkt oder deine Dienstleistung erlebt.
Wann sollte man Screen Flows verwenden?
Wireframe Tools helfen UX- und Produktteams dabei, die Customer Journey als einen vollständigen Ablauf und nicht als eine Reihe von Bildschirmen zu betrachten. Der Wireflow oder Bildschirmablauf konzentriert sich auf die Bildschirme selbst und die Interaktion des Kunden mit der Dienstleistung oder dem Produkt. Ein Designer kann einen Bildschirmablauf entwerfen, wenn er ...
Sicherstellen, dass es keine fehlenden Szenarien gibt: Wenn eine durchgehende Reise abgebildet ist, kannst du alle potenziellen Anwendungsfälle berücksichtigen, die auf die Bedürfnisse des Kunden zutreffen.
Verbessere die Benutzerinteraktionen: Lerne den Kunden bei jeder Gelegenheit im Ablauf kennen, z. B. bei Anmeldungen, Bestätigungen oder Pop-ups.
Bessere funktionsübergreifende Kommunikation: Bringe die Designer und Entwickler zusammen und ermutige sie, über das gesamte Erlebnis und nicht nur über einzelne Bildschirme nachzudenken.
Aufklärung der Stakeholder: Wenn Kunden oder Teams noch nie darüber nachgedacht haben, was der Kunde sieht, wenn er sich durch das Produkt oder die Erfahrung bewegt, hilft das Befolgen eines Ablaufs, Empathie für die Schmerzpunkte des Kunden zu entwickeln.
Erstelle deinen eigenen Screen Flow
Die Erstellung eines eigenen Bildschirmablaufs ist einfach. Das Kollaborationtool von Miro ist das perfekte Whiteboard, um sie zu erstellen und zu teilen. Du hast auch die Möglichkeit verschiedene Flussdiagramme zu erstellen. Für den Screen Flow wähle zunächst die zugehörige Vorlage aus und führe dann die folgenden Schritte aus, um deinen eigenen Screen Flow zu erstellen.
Definiere deine User Story Bevor du mit dem Mapping einer visuellen Sequenz beginnst, beschreibe deine Nutzerbedürfnisse und Schmerzpunkte, die es zu lösen gilt. Auf dieser Grundlage erstellst du einen Startpunkt für deinen Screen Flow auf.
Entscheide dich, was deine Hauptbildschirme zeigen werden Überlege dir deine Start- und Endpunkte der Reise. Brauchst du eine Landing Page? Ein Anmeldeformular? Eine Bestätigungsseite? Identifiziere die Änderungen oder zusätzlichen Schritte im Prozess, wie z.B. Seiten, die geteilt werden müssen oder Bildschirme, die hinzugefügt werden müssen. Die Wireframe-Bibliothek von Miro enthält mehr als 15 UI-Komponenten, die du einfach zu deinem Bildschirmfluss hinzufügen kannst, wenn du Inspiration brauchst.
Verbinde die Bildschirme Füge Pfeile zwischen den einzelnen Bildschirmen hinzu und verschieben sie, um den Benutzer durch die Aufgabe voranzubringen, indem du das Verbindungslinien-Tool von Miro verwendest. Du kannst auch Entscheidungspunkte einfügen und dem Benutzer zeigen, was in jeder verfügbaren Instanz passiert.
Teilen Bildschirmablauf mit deinem Team oder Stakeholdern für Feedback Mit der Mention-Funktion von Miro kannst du dein Team oder einzelne Personen für schnelle Feedbackrunden, Designkritiken oder Überprüfungen vor Live-Workshops mit Kunden markieren. Du kannst dein Miro Board auch für andere Personen freigeben (auch wenn diese noch nicht registriert sind!), indem du auf die Schaltfläche Mitglieder einladen klickst.
Was ist Screen Flow in UX?
Ein Screenflow hilft dir, die Interaktionen deiner Nutzer zu analysieren, wobei du dich hauptsächlich auf deine Produktbildschirme konzentrierst. Er kombiniert das Beste aus Wireframing und Flussdiagrammen und gibt dir einen detaillierteren Überblick über deinen Kundenfluss und damit mehr Daten, um ein besseres Nutzererlebnis zu schaffen.
Beginne jetzt mit diesem Template
Storyboard-Template
Ideal für:
Design Thinking
Ein Storyboard wird in der Regel mit der Planung von Szenen eines Films oder Fernsehserie assoziiert. Mittlerweile wurde es jedoch auch in der Geschäftswelt übernommen. Ein Storyboard ist eine Reihe von Illustrationen, die zur Entwicklung einer Geschichte verwendet werden. Du kannst ein Storyboarding-Template immer dann heranziehen, wenn du dich wirklich in einen Kunden oder Benutzer hineinversetzen und verstehen willst, wie er denkt, wie er sich fühlt und wie er handelt. Diese Taktik kann besonders dann nützlich sein, wenn es ein Problem oder eine Ineffizienz bei einem bestehenden Prozess gibt. Du kannst ein Storyboard für bestehende Prozesse oder Workflows anwenden und planen, wie sie in Zukunft aussehen sollen.
Swimlane Diagramm mit Daten Vorlage
Ideal für:
Flowchart, Mapping, Diagrams
Die Swimlane Diagramm mit Daten Vorlage ist ein visuelles Tool zur Darstellung von Prozessen oder Arbeitsabläufen mit Swimlanes, die zusätzliche Daten oder Informationen enthalten. Sie bietet Elemente zur Dokumentation von Prozessschritten, Zeitplänen und Leistungsmetriken innerhalb jeder Swimlane. Diese Vorlage ermöglicht es Teams, die Prozesseffizienz zu analysieren, Engpässe zu erkennen und datengestützte Entscheidungen zur Prozessverbesserung zu treffen. Durch die Kombination von visueller Klarheit mit Dateneinblicken ermöglicht das Swimlane Diagramm mit Daten Unternehmen, Arbeitsabläufe zu optimieren und kontinuierliche Verbesserungen effektiv voranzutreiben.
Das Voice-of-Customer-Template (Stimme des Kunden)
Ideal für:
Marketing, Desk Research, User Experience
Die Stimme des Kunden zu erkennen, ist ein entscheidender Bestandteil jeder Strategie für Kundenerlebnisse. Die Stimme des Kunden ist einfach ein Rahmen für das Verständnis der Bedürfnisse, Wünsche, Vorlieben und Erwartungen deiner Kunden, wenn sie mit deiner Marke interagieren. Die Auswertung deiner Kundenstimme ermöglicht es dir, herauszufinden, was deine Kunden denken, fühlen und über deine Produkte und Dienstleistungen sagen, damit du eine bessere Customer Journey entwickeln kannst. Verwende die Vorlage Voice of Customer, um Antworten auf wichtige Fragen zu deinen Kunden aufzuzeichnen, z. B.: Was sagen sie über unser Produkt? Welche Bedürfnisse haben sie? Wie können wir dieses Bedürfnis erfüllen? Und wer ist diese Persona?
Icor Workflows Vorlage
Ideal für:
Flowcharts, Diagrams, Mapping
Die ICOR® Workflow Vorlage bietet einen visuellen Rahmen für die Dokumentation und Optimierung von Geschäftsprozessen nach der ICOR® Methodik (Input, Control, Output, Resources). Sie enthält Elemente für die Definition von Prozess Inputs, Kontrollen, Outputs und Ressourcenanforderungen. Diese Vorlage ermöglicht es Unternehmen, Abläufe zu rationalisieren, das Qualitätsmanagement zu verbessern und hervorragende Prozesse zu erzielen. Durch die Förderung einer systematischen Prozessdokumentation und -analyse versetzt die ICOR® Workflow Vorlage Unternehmen in die Lage, ihre Effizienz zu optimieren, Risiken zu minimieren und den Stakeholdern einen effektiven Mehrwert zu bieten.
Das Dreistündige-Markensprint-Template
Ideal für:
Marketing, Sprint-Planung, Workshops
Bevor die Kunden an deine Marke glauben, muss dein Team daran glauben. Da wirken Markensprints wahre Wunder. Ein Markensprint, der vom Team bei Google Ventures entwickelt wurde, hilft deinem Team dabei, alle verschiedenen Ideen zu deiner Marke zu sortieren und sich auf die grundlegenden Bausteine deiner Marke auszurichten – deine Werte, deine Zielgruppe, deine Persönlichkeit, dein Leitbild, deine Roadmap und mehr. Egal, ob du eine neue Marke aufbauen oder eine bestehende überarbeiten, Markensprints sind ideal für Auslöser wie die Namensgebung Ihres Unternehmens, das Entwerfen eines Logos, die Beauftragung einer Agentur oder das Schreiben eines Manifests.
Flussdiagramm Produktion Vorlage
Ideal für:
Flowcharts
Die Produktion Flussdigramm Vorlage ist ein gut durchdachtes Tool, das einen Herstellungsprozess von Anfang bis Ende klar darstellt. Sie zerlegt komplexe Abläufe in leicht verständliche Segmente, was es den Beteiligten erleichtert, den gesamten Prozess zu erfassen. Einer der Hauptvorteile der Verwendung dieser Vorlage besteht darin, dass sie komplexe Produktionsabläufe klärt. Durch die visuelle Darstellung von Operationen können Teams potenzielle Engpässe oder Ineffizienzen identifizieren, was die rechtzeitige und fundierte Entscheidungsfindung erleichtert.