Erkunden / Konzept /

Wireflows

Ein Wireflow visualisiert zu einem frühen Zeitpunkt in einem Projekt den Fluss von Interaktionen durch einzelne Screens oder Dialoge einer zukünftigen Anwendung. Dargestellte Screens und Dialoge werden als Wireframes dargestellt, ihre Verbindungen und auslösende Aktionen beschrieben. Wir zeigen nachfolgend beispielhaft involvierte Screens, geben die notwendigen Aktionen an, die einen Nutzer oder eine Nutzerin dem Ziel einen Schritt näherbringen, und bestimmen, wie sich der Zustand des Interface nach Anwendung dieser Funktionen ändert. Hierbei gehen wir  die einzelnen Schritte eines Soll-Szenarios durch.

Einordnung

Mit einem Wireflow können wir die in einem Szenario beschriebenen Interaktionen in Form von miteinander verknüpften Wireframes visualisieren. Abgebildet wird der Fluss eines Szenarios. Der Ablauf wird segmentiert und die Inhalte von Screens und Screen-Zuständen abbildet.

Abbildung: Beispiel für einen Wireflow

Erläuterungen

Ein Wireflow zeigt nicht mehr den Kontext der Interaktion, sondern die tatsächlich Interaktionen mit einem Interface. Ein Wireflow ist damit nicht mehr lösungsneutral. Es spiegelt erste Designentscheidungen insbesondere im Bezug zur Informationsarchitektur und den verwendeten Patterns wider: Welche Interaktionskontexte gibt es, wie wird navigiert, welche Interaktionen sind notwendig?

Vorgehen

Zunächst werden die Screens eines Interface nur grob skizziert. Gezeichnete Screen-Miniaturen sind häufig hinreichend: Sie brauchen zunächst lediglich anzudeuten, welche Inhalte jeweils auf ihnen zu finden sind. Die beschriebenen Inhalte können mit den zugehörigen Schritten des Szenarios annontiert werden, sodass die Schritte in den Übergängen zwischen Screens für alle Beteiligten verständlich sind.

Konzept im Überblick ...

Szenarien

Szenarien beschreiben ein konkretes Anwendungsbeispiel, bei dem die erarbeiteten Lösungsideen zusammenspielen.

Zum Artikel ...

Storyboard

Das Storyboard visualisiert ein Szenario mit dem Kontext.

Zum Artikel ...

User Story Map

Eine User Story Map stellt eine Zusammenstellung der Anforderungen zur Erfüllung der Szenarien dar.

Zum Artikel ...

Wireflows

Wireflows zeigen, wie die Anforderungen anhand eines User Interfaces entlang der Szenarien erfüllt werden.

Zum Artikel ...

Framework

Ein User Interface Framework zeigt das Navigationskonzept und die Aufteilung der Inhalte auf verschiedene Screens

Zum Artikel ...

Key Screens

Die Keyscreens zeigen welche Elemente und Funktionalitäten auf den Schlüsselscreens vorhanden sein sollen.

Zum Artikel ...