Die zunehmende Verbreitung agiler Organisationsformen wie SCRUM und SAFe hat die Freiheitsgrade von Entwicklungsteams erheblich erweitert. Die daraus resultierende End-to-End-Verantwortung ermöglicht es Teams, Entscheidungen autonom zu treffen und Entwicklungsprozesse flexibel zu gestalten. Gleichzeitig stellt diese Dezentralisierung Banken und IT-Dienstleister beim Bau umfangreicher Software vor die Herausforderung, einheitliche Design- und Qualitätsstandards übergreifend zu etablieren und über verschiedene Teams und Plattformen hinweg konsistent einzuhalten. Diese Herausforderungen zeigen sich beispielsweise bei der inkonsistenten Verwendung von Icons, Grafiken und Schriftarten sowie der einheitlichen Gestaltung von Buttons und Navigationselementen. Aber auch der Aufbau von Widgets und die Struktur ganzer Benutzeroberflächen müssen einheitlich gestaltet werden, um eine nahtlose und intuitive Nutzererfahrung zu gewährleisten. Um diesen Herausforderungen zu begegnen, ist ein Vorgehen notwendig, um die Designkonsistenz und -qualität über die gesamte Plattform hinweg sicherzustellen.

Ausgangssituation: Komplexität und Inkonsistenz in einem agilen Umfeld

Die entwickelnden Teams des IT-Dienstleisters, die in über 70 agilen Teams parallel an unterschiedlichen Funktionen für eine übergreifende Software einer Omnikanalplattform arbeiteten, hatten aufgrund der agilen Strukturen weitreichende Freiheiten in der Gestaltung ihrer Features. Als der IT-Dienstleister ein umfassendes Redesign der Omnikanalplattform initiierte, war das Ziel, eine klare visuelle Identität zu schaffen, die sich durch alle Anwendungsbereiche der Omnikanalplattform – von der mobilen Anwendung über das Online-Banking bis hin zu spezialisierten Bankermodulen – zieht. Um an dieser Stelle bereits Designunterschiede und Inkonsistenzen zu vermeiden, wurde für jeden Teil der Omnikanalplattform eine Kontrollinstanz installiert.

Diese fungierte als unabhängige Instanzen, die sicherstellen sollten, dass neue Funktionen und Prozesse den definierten UI/UX-Standards entsprachen. Während die UI/UX-Designer für die konzeptionelle Gestaltung und die Umsetzung von Designrichtlinien innerhalb der Teams verantwortlich waren, hatte die Kontrollinstanz die Aufgabe, die finalen Entwicklungsarbeiten abschließend zu überprüfen und eine übergreifende Konsistenz mithilfe der zentralen Designvorgaben sicherzustellen. Jedoch zeigten sich im Laufe der Zeit Schwächen in der praktischen Umsetzung dieses Vorgehens.

Herausforderungen und Probleme dieses Prozesses

Obwohl der Ansatz mit den Kontrollinstanzen zunächst zu einheitlicheren Designs führte, wurden zeitnah Schwierigkeiten deutlich:

1. Reduzierte Eigenverantwortung der Teams: Der Kontrollprozess stand im Konflikt mit dem agilen Gedanken der End-to-End-Verantwortlichkeit. Während die Entwicklerteams ursprünglich für die gesamte Umsetzung eines Features verantwortlich waren, verschob der Prozess die Verantwortung für die Designqualität auf externe Kontrollinstanzen. Dies führte dazu, dass einige Teams sich stärker auf die abschließende Kontrolle verließen und die Einhaltung der Designrichtlinien im Vorfeld weniger sorgfältig prüften.
2. Inkonsistente Prozesse und Prüfstandards: Jede Kontrollinstanz der Omnikanalplattform entwickelte eigene Prozesse und Prüfkriterien, was dazu führte, dass die Anforderungen nicht einheitlich angewandt wurden und Widersprüche zwischen den Kontrollinstanzen deutlich wurden. Für Entwicklerteams, die Funktionen über mehrere Plattformen hinweg entwickelten, führte dies zu zusätzlichen Herausforderungen und widersprüchlichen Anforderungen, da sie sich auf unterschiedliche Maßstäbe einstellen mussten.
3. Zeitliche Engpässe und Verzögerungen: Die Kontrollen und Freigaben wurden häufig erst kurz vor der geplanten Veröffentlichung eines Features angefragt. Da es für die Teams pro Jahr nur eine begrenzte Anzahl an Veröffentlichungszeitpunkten gab, führte dies regelmäßig zu Engpässen und erheblichem Zeitdruck. Um Liefertermine einzuhalten, wurden einige Funktionen sogar ohne vollständige Prüfung ausgeliefert.
4. Effektivität der Nachkorrekturen: Ein weiterer Schwachpunkt bestand in der nachgelagerten Bearbeitung von Designfehlern. Da viele Teams Lieferversprechen einhalten mussten, wurden Designfehler häufig erst nach Veröffentlichung behoben. Die Kontrollinstanzen dokumentierten die Designmängel, die von den Teams in späteren Phasen bearbeitet werden sollten. Da sich die Teams jedoch meist auf neue Aufgaben konzentrierten, wurden diese Mängel als ungeplanter Aufwand mit geringer Priorität wahrgenommen und oft verzögert behoben.

Neuer Lösungsansatz: Einführung des UI/UX-Refinements

Um den Ansatz mit den Kontrollinstanzen nachhaltig in das agile Entwicklungskonzept des IT-Dienstleisters einzubinden, wurde das UI/UX-Refinement eingeführt. Diese grundlegende Umgestaltung des Prozesses setzt darauf, die Qualitätssicherung in die initialen Phasen der Entwicklung zu verlagern und die Kommunikation zwischen den UI/UX-Designern, Kontrollinstanzen und Entwicklungsteams zu verbessern. Der neue Ansatz des UI/UX-Refinements kann in drei Punkten zusammengefasst werden:

1. Frühe Iterationen und Konzeptvorstellung: Bereits während der Konzeptionsphase erstellt der UI/UX-Designer ein erstes Design unter Einhaltung der zentralen Designvorgaben. Dieses Konzept wird in einem frühen Stadium mit der Kontrollinstanz verfeinert. Diese führt dabei ein detailliertes Review durch und dokumentiert konstruktives Feedback. Dieses Vorgehen wird iterativ wiederholt, bis das Konzept finalisiert ist. So können Designfehler bereits in einer frühen Phase identifiziert und behoben werden, ohne den Entwicklungsprozess zu verzögern. Um eine hohe Designqualität sicherzustellen, wurde das iterative UI/UX-Refinement als fester Bestandteil der Vorbereitung eines Features etabliert. Dadurch wird sichergestellt, dass Konzepte vor der Entwicklung ausreichend geprüft und optimiert wurden.
2. Integrierte, kontinuierliche Qualitätskontrolle: Nachdem das Konzept von beiden Seiten – Designer und Kontrollinstanz – als final akzeptiert wurde, beginnt die Entwicklungsphase. Im Anschluss an die Entwicklung übernimmt der Tester des agilen Teams die Verantwortung, das finale Design mit dem umgesetzten Produkt abzugleichen. Hierzu wurde im Rahmen der Erstellung des Features entsprechende Akzeptanzkriterien für die Tester definiert. Dies reduziert die Abhängigkeit von der Kontrollinstanz vor der finalen Veröffentlichung, beugt so möglichen Kapazitätsengpässen vor und verschiebt die Verantwortung für die Designkonformität zurück in das entwickelnde Team.
3. Einheitliche Vorgehensweise und standardisierte Prüfprozesse: Das UI/UX-Refinement bietet ein einheitliches, transparentes Vorgehen, das alle Kanäle und Teams auf der Omnikanalplattform gleichermaßen betrifft. Durch die frühzeitige Überprüfung können Inkonsistenzen verringert werden und durch zusätzliche Trainings sowie Sprechstunden wird eine höhere Qualität in der Anwendung der Standards geschaffen. Die UI/UX-Designer stehen nun stärker in der Verantwortung, eine gründliche Selbstprüfung durchzuführen, bevor das Design der Kontrollinstanz vorgelegt wird.

Vorteile und Zukunftsperspektiven des UI/UX-Refinements

Das UI/UX-Refinement bietet verschiedene Vorteile:

• Frühzeitige Fehlererkennung: Die Integration der Designprüfung in frühen Phasen reduziert das Risiko, dass Designfehler erst kurz vor der Veröffentlichung entdeckt werden.
• Agile Zusammenarbeit: Der iterative Ansatz fördert den Austausch zwischen Teams und verbessert die Abstimmung im Entwicklungsprozess.
• Stärkung der Eigenverantwortung: Teams übernehmen mehr Eigenverantwortung für die Qualität des Designs und der Implementierungen.
• Integrierte Qualitätssicherung: Qualitätssicherung wird nicht mehr als externe Hürde wahrgenommen, sondern als natürlicher Bestandteil des Entwicklungsprozesses.
• Konsistente Designstandards: Der Refinement-Prozess hilft dabei, eine einheitliche Designsprache auf der gesamten Omnikanalplattform zu gewährleisten, was sich auch in der Nutzererfahrung widerspiegelt.

Dank des frühzeitigen iterativen Feedbacks im UI/UX-Refinement traten 70 % weniger Designabweichungennach der Entwicklung auf. Gleichzeitig sank die Zahl der Supporttickets zu unverständlichen oder inkonsistenten Benutzeroberflächen um mehr als die Hälfte.

Das UI/UX-Refinement ermöglicht eine frühzeitige Fehlererkennung und schafft eine verlässliche Grundlage für konsistente Designstandards. Durch die enge Abstimmung zwischen UI/UX-Designern und Kontrollinstanzen werden potenzielle Probleme früh identifiziert und iterativ verbessert. Die Integration dieses Refinement-Prozesses in ein agiles Framework wie SAFe kann als Best Practice für vergleichbare Projekte dienen, dass sich diese Form der Qualitätssicherung nahtlos in agile Arbeitsweisen einfügt und ähnliche Vorteile auch in anderen Entwicklungsumgebungen bieten kann.

Autoren: Sebastian Tolzin (Consultant) & Markus Appelbaum (Manager)