Schematische Flussgrafik einer UI Architektur

 All about the flow – Zusammenarbeit bei UI Architektur und Flows harmonisieren

 

 

Insights in diesem Beitrag

  • Kommunikationsherausforderungen zu UI Architektur, Prozessen und User Flows
  • Wie bekomme ich mit vertretbarem Aufwand eine Übersicht meiner Prozesse, Architektur und User Flows abgebildet ?
  • Zusammenspiel von Adobe XD und Miro in diesem Anwendungsfall
  • Erfahrungen in der Kollaboration mit unseren Kunden

 

UI Architektur, Prozesse und User Flows

Das Zusammenspiel von Kommunikation und Gestaltung um die Architektur des User Interfaces einer Anwendung, die notwendigen Prozesse und schlussendlich die User Flows in die wir unsere Kunden schicken, stellt uns vor ein mehrdimensionales Problem.

UI Architektur, Prozess und User Flow stellen drei Möglichkeiten dar, eine unterschiedliche Perspektive auf eine Anwendung einzunehmen.

  • Die UI Architektur bildet die systemische Sicht auf unser Konzept ab, hilft uns eine ganzheitliche Sicht zu entwickeln und Hierarchien zu verstehen
  • Die prozessuale Sicht beschreibt Logik und Funktion der Anwendung und hilft uns die Abhängigkeiten und Abläufe zu erfassen, zu beschreiben und zu gestalten.
  • Unsere User Flows fassen wiederum Prozess und UI Architektur fallgetrieben zusammen und lassen uns die Perspektive der Anwender einnehmen. Sie sind das Reisetagebuch des Nutzers zu unterschiedlichen Orten in unterschiedlichen Situationen.

User Flows machen somit das angestrebte Ergebnis erlebbar, während die Sicht auf Prozesse und UI Architektur vor allem ein strategisches Hilfsmittel zur Synchronisation von Business Development und Produktmanagement, Entwicklung und Design sind.

 

Herausforderungen

Der Hund liegt, wie so häufig, hauptsächlich in der Kommunikation begraben. Oder anders gesagt, im Zugangskonzept zu den benötigten Informationen.

  • Spezialanwendungen (z.B. Adobe XD) sind nur der jeweiligen Profession zugänglich.
  • Im Prozess kommen viele Tools zum Einsatz, die sich teils schlecht oder nicht synchronisieren lassen.
  • Eine Übersicht der Prozesse, Architektur und Flows muss manuell hergestellt werden.
  • Sharing Funktionen für Entwickler und Reviewer bieten häufig eine zu eindimensionale Sicht und überfordern den Leser.
  • Designtools werden schnell unübersichtlich, wenn in einer Datei alle drei Anforderungen abgebildet werden.

 

UI Flow in Miro mit Adobe XD Anbindung

Lösungsansatz und Erfahrungen

Die Erfahrungen dieses Ansatzes sind weder der heilige Gral für alle UX Designer, noch die allseits begehrte eierlegende Wollmichsau. Es ist eine pragmatische Lösung, die in einem Projekt ein konkretes Problem lösen konnte. Die Ziele und Thesen des Ansatzes:

  • mehr Übersicht durch weniger Tools
  • Informationen bündeln
  • Fehlerquellen und Aufwände reduzieren
  • Updatefähigkeit der Flows, Prozesse und Architektur verbessern

Dafür haben wir das Zusammenspiel von Miro und Adobe XD erprobt. Durch das entsprechende Plugin lassen sich Artboards anzeigen und aktualisieren. Folgende Erfahrungen haben wir gemacht:

  • Die Anzahl der Artboards in Adobe XD konnte signifikant reduziert werden, da wir diese im gemeinsamen Board mehrfach referenzieren.
  • Stakeholder außerhalb des Adobe Kosmos finden mit Miro einen besseren, visuellen Zugang zu unseren Konzepten und den Zusammenhängen.
  • Der kollaborative Anteil der Zusammenarbeit lässt sich gewohnt gut in Miro abbilden.
  • Die Ladezeiten der Screens in Miro sind nicht optimal.
  • Für ein komplexeres Projekt lässt sich im gemeinsamen Board ein single-point-of-truth schaffen über mehrere Dateien und Anwendungsfälle hinweg. Kunde und Stakeholder müssen nicht die Übersicht über mehrere Links zu Prototypen halten.

 

Und wie machen wir das jetzt?

Als UX Agentur helfen wir euch gerne bei allen Fragen rund um den menschzentrierten Gestaltungsprozess. Braucht ihr Beratung oder wollt ein Projekt gemeinsam durchführen? Meldet euch bei uns. Wenn ihr nicht genau wisst, was ihr braucht, finden wir es gemeinsam raus.