Screenflow-Vorlage

Über die Screenflow-Vorlage

Screenflows (auch bekannt als „Wireflows“) sind eine Kombination aus Wireframes und der Erstellung eines Flussdiagramms. Der vollständige Ablauf zeigt, was Nutzer auf jedem Bildschirm sehen und wie dies ihren Entscheidungsprozess in Deinem Produkt oder Service beeinflusst. Mit dieser Information kannst du besser die Entscheidungen erklären, die du im Hinblick auf dein Interaktionsdesign getroffen hast.

Nutze die Screen Flow Vorlage, um neue Möglichkeiten zu finden, die Nutzererfahrung von Anfang bis Ende reibungslos und frustfrei zu gestalten.

Wenn du daran interessiert bist, deine Arbeit weiterzuentwickeln und dich im Bereich des UX-Designs zu vertiefen, wo du die Nutzerreise eher als Flussdiagramm mit Texten und Symbolen als durch Bildschirme darstellen kannst, könnte dich die User-Flow-Vorlage interessieren.

Lies weiter, um mehr über Screen Flows zu erfahren.

Was ist ein Screen Flow?

Ein Screen Flow (oder Wireflow) kombiniert ein Layout mit mehreren Bildschirmen, das wie ein Flussdiagramm verbunden ist, um die Entscheidungspunkte und Bewegungen eines Kunden von Anfang bis Ende abzubilden.

Wireframes allein bieten keinen Kontext dafür, wie ein interaktiver, seitenweiser Nutzerfluss aussehen könnte. UX-Flows für sich genommen sind abstrakter und können dir nicht zeigen, was dein Kunde tatsächlich sieht.

Wireflows oder Screen Flows kombinieren die Stärken beider Methoden und untermauern dein Argument, dass das, was der Nutzer sieht, ausschlaggebend für seine Erfahrung mit deinem Produkt oder Dienst ist.

Wann man Screen Flows verwenden sollte

Drahtgittermodelle helfen UX- und Produktteams, die Kundenreise als kompletten Workflow statt als einzelne Bildschirme zu betrachten. Der Wireflow oder Screen Flow konzentriert sich auf die Bildschirme selbst und die Interaktion des Kunden mit deinem Service oder Produkt.

Ein Designer kann einen Screen Flow abbilden, wenn es nötig ist, um...

• Stelle sicher, dass keine Szenarien fehlen: Mit einer vollständigen Journey kannst du alle potenziellen Anwendungsbeispiele berücksichtigen, die den Bedürfnissen der Kunden entsprechen.

• Verbessere die Nutzerinteraktionen: Lerne deine Kunden bei jeder Möglichkeit im Ablauf kennen, z. B. bei Anmeldungen, Bestätigungen oder Pop-ups.

• Schaffe bessere funktionsübergreifende Kommunikation: Bringe Designer und Entwickler zusammen und ermutige sie, über das gesamte Erlebnis nachzudenken, statt nur über einzelne Bildschirme.

• Engagiere dich in der Bildungsarbeit bei Stakeholdern: Wenn Kunden oder Teams noch nie darüber nachgedacht haben, was der Kunde sieht, wenn er sich durch dein Produkt oder Erlebnis bewegt, hilft das Verfolgen eines Flows dabei, Empathie für die Problempunkte der Kunden aufzubauen.

Erstelle deinen eigenen Screen Flow

Deinen Screen-Flow zu erstellen ist einfach. Miro's virtuelle Kollaborationsplattform bietet die perfekte Canvas, um sie zu erstellen und zu teilen. Starte, indem du die Screen-Flow-Vorlage auswählst, und folge dann diesen Schritten, um deinen eigenen zu gestalten.

1. Definiere deine User Story

Bevor du eine visuelle Abfolge erstellst, beschreibe die Bedürfnisse und Problempunkte deiner Nutzer, die gelöst werden sollen. Dies ist deine Grundlage, um einen Ausgangspunkt für deinen Screen-Flow festzulegen.

2. Entscheide, was deine Hauptbildschirme zeigen sollen

Überlege dir deine Start- und Endpunkte der Reise. Benötigst du eine Landingpage? Einen Bildschirm für das Registrierungsformular? Eine Bestätigungsseite? Identifiziere Änderungen oder zusätzliche Schritte im Prozess, wie etwa aufzuteilende Seiten oder hinzuzufügende Bildschirme. Miro ist der perfekte Wireframe-Ersteller mit einer Wireframes-Bibliothek, die über 15 UI-Komponenten enthält, die du leicht zu deinem Screen Flow hinzufügen kannst.

3. Verbinde die Bildschirme

Füge Pfeile hinzu und bewege sie zwischen den Bildschirmen, um den Nutzer mit der Aufgabe voranzubringen, indem du das Verbindungslinien-Tool von Miro verwendest. Du kannst auch Entscheidungspunkte hinzufügen und zeigen, was in jeder verfügbaren Instanz mit dem Nutzer passiert.

4. Gib deinen Bildschirmfluss zur Rückmeldung an dein Team oder deine Stakeholder frei

Du kannst Miros Erwähnungsfunktion nutzen, um dein Team oder einzelne Personen für schnelle Feedbackrunden, Designkritiken oder Reviews vor Live-Workshopsitzungen mit Kunden zu taggen. Du kannst dein Miro-Board auch mit jedem (auch wenn er noch nicht registriert ist) teilen, indem du auf die Mitglieder einladen-Schaltfläche klickst.

Entdecke weitere Beispiele für Benutzerfluss, die dir helfen, dein nächstes großes Ding zu bauen.

FAQ zur Screen Flow Vorlage

Was ist Screen Flow im UX?

Ein Screen-Flow hilft dir, die Interaktionen deiner Nutzer zu analysieren und konzentriert sich hauptsächlich auf die Bildschirme deines Produkts. Er vereint die Vorteile von Wireframing und Flussdiagrammen, was dir einen detaillierteren Überblick über den Kundenfluss gibt und dadurch mehr Daten für eine bessere Nutzererfahrung liefert.