Mind the Gap! Wie Schnittstellen zu Schnittmengen werden

Hinweis: Die Autoren dieses Artikels sind Philipp Klett und Christopher H. Müller. Klett ist Senior Usability-Engineer und User Experience Consultant mit mehreren Jahren Entwickler-Erfahrung, Müller Inhaber und CEO von Die Ergonomen Usability AG aus Zürich.

Der aktuelle Prozess der Softwareentwicklung lässt sich aktuell grob in vier Phasen unterteilen: Analyse, Konzeption, Entwicklung und Einführung. In jeder Phase werden spezielle Werkzeuge verwendet, um ein für die entsprechende Phase und aus der Sicht des Spezialisten möglichst optimales Ergebnis zu erhalten. Durch diese klare Trennung der Phasen entstehen sogenannte «Gaps» – nicht klar definierte Übergabe-Bereiche zwischen zwei Phasen. Jeder Gap ist eine potenzielle Fehlerquelle. Am Ende einer Phase werden die Ergebnisse in die nächste Phase übergeben: 1.) Analyse-Spezialisten dokumentieren den Ist-Zustand und erheben Anforderungen für das neue Projekt – das Ergebnis sind Anforderungsdokumente. 2.) Konzepter entwickeln aus den Anforderungen ein Konzept – daraus ergibt sich das Konzept beziehungsweise ergeben sich Konzeptvarianten. 3.) Entwickler setzen das Konzept auf der Zielplattform um, aus Papier wird digitaler Code – das Softwaresystem ist komplett. 4.) Schulungsspezialisten und Support sorgen für eine reibungslose Einführung der neuen Software – das Resultat sind zufriedene, effiziente Nutzer der Software.

Wo so viele verschiedene Menschen mit unterschiedlichen Werkzeugen, Ansichten, Denk- und Arbeitsweisen aufeinandertreffen und zusammenarbeiten müssen, kommt es zwangsläufig zu (Übersetzungs-)Fehlern. Das Ergebnis aus der vorangegangenen Phase muss immer interpretiert werden. Gründe dafür: Die verwendeten Hilfsmittel passen nicht zusammen; das Verständnis für die Tätigkeit der Personen in den anderen Phasen ist gering; es werden unterschiedliche Sprachen verwendet (Phase 2: Bildsprache <> Phase 3: Programmiersprache)

User Experience Design / Development

Was in der Konzeptphase entworfen, visualisiert und evaluiert worden ist, muss in ein funktionierendes und intuitiv benutzbares System umgesetzt werden. Normalerweise werden dazu auf der Basis von Mock-ups aus der Konzeptionsphase Prototypen entwickelt und evaluiert. Parallel beginnt das Grafik- beziehungsweise Screendesign mit der Gestaltung und Ausarbeitung von Icons, Logos oder Farbkonzept. Werden bei der Evaluation die Usability-Kriterien erfüllt, werden die verschiedenen Prototypen an die Entwickler übergeben und von diesen im finalen System umgesetzt.

Bei der Umsetzung müssen sie dabei unter anderem Style-Guides, visuelle Prototypen, Skizzen, Dokumentationen und Ablaufdiagramme beachten, denn die Informationen über das endgültige, gewünschte Ergebnis liegen in all diesen Dokumenten verstreut. Als würde das nicht reichen, gibt es meist noch mündliche Absprachen und Änderungen zu beachten, die man in der Kaffeeküche oder auf dem Gang getroffen hat und die natürlich nicht dokumentiert sind. Ziemlich sicher ist dann auch die Dokumentation nicht auf dem neusten Stand.

Es existiert meist eine klare Trennung zwischen den Phasen Konzeption und Entwicklung. Ergebnisse aus der einen Phase werden mit mehr oder weniger geeigneten Hilfsmitteln in die nächste Phase übergeben und dort von anderen Personen weiterverarbeitet. Das ist nicht effizient. Wissen und Erfahrungen aus der Arbeit in einer Phase können oft nicht dokumentiert werden und geraten dadurch in Vergessenheit. Die Folge: Es gibt Redundanzen und Fehler werden wiederholt.

Die Lösung

Für einen möglichst reibungslosen Ablauf der Übergabe empfiehlt es sich dringend:

1.) Prozesse und Übergabeparameter (Schnittstellen) genau zu definieren.

2.) Personen zu integrieren, die mehrere «Sprachen» sprechen und phasenübergreifend agieren können.

3.) Verständnis für andere Fachbereiche zu schaffen, also Hand in Hand statt gegeneinander zu arbeiten.

4.) Werkzeuge und Hilfsmittel anzugleichen und wo möglich zu reduzieren und

5.) Phasenübergreifende Softwareentwicklung zu leben.

Ziel ist es, die Anzahl Schnittstellen und damit Gaps zu verringern und zu überbrücken, Kompetenzen zu bündeln, und vorhandenes Wissen und Erfahrungen nahtlos weiterzureichen. Wenn das gelingt, dann resultieren daraus eine effizientere Vorgehensweise und ein besseres Endprodukt.

Integrierte GUI-Entwicklung

Durch integrierte GUI-Entwicklung wird der Gap zwischen Konzeption und Entwicklung effektiv verkleinert. Auf die üblichen Werkzeuge wie Storyboards oder Prototypen wird nicht verzichtet. Sie werden in reduziertem Umfang im Rahmen der GUI-Entwicklung eingesetzt, um komplexe Features mit Benutzern evaluieren zu können. Wo sinnvoll und so früh wie möglich wird aber schon mit der Umsetzung der Konzepte begonnen. Anstatt in der Konzeptphase Zeit für aufwendiges Erstellen von Dokumentation, Style-Guides und grafischen Prototypen aufzuwenden, wird die Entwicklung komplett funktionierender und benutzerfreundlicher User Interfaces direkt auf der Zielplattform realisiert.

Beim Einsatz agiler Methoden wie Scrum kann ein solcher Prozess in zeitlich vorgelagerten User-Experience-Sprints (UX-Sprints) umgesetzt werden. UX geht also in Vorleistung und entwirft eine (Diskussions-)Grundlage für den Entwicklungs-Sprint. So kann ein daraus resultierendes funktionierendes GUI auf der Zielplattform schon sehr früh realisiert, ausgebaut und ins Projekt mit eingebunden werden. Regelmässig wird der aktuelle Entwicklungsstand mittels Usability-Test oder Experten-Evaluation aus Benutzersicht auf Herz und Nieren geprüft. Diese Inputs fliessen wiederum in die nächsten UX- und Entwicklungs-Sprints mit ein.

Die Vorteile

Eine enge Zusammenarbeit zwischen Konzeptern, User Experience (UX) Experten und Entwicklern reduziert Missverständnisse, der Koordinationsaufwand wird gesenkt und die GUI-Entwickler werden direkt entlastet. Iteratives User Centered Frontend Design senkt die Projektrisiken und erhöht die Usability und damit die Akzeptanz des Endprodukts. Die laufende Überprüfung der Machbarkeit von Design und Bedienkonzept deckt Probleme frühzeitig auf.

Entwicklern wird die mühsame und unbeliebte Frontend-Design-Arbeit abgenommen. Sie müssen die fertigen Screens und/oder Elemente, im Optimalfall die komplette View nur noch mittels zuvor gemeinsam definierter (oder vorgegebener) Schnittstellen an Model und Controller anbinden. Dieses Model-View-Controller-Vorgehen (MVC) wird unter anderem von Microsoft schon seit längerem propagiert. Die Softwaremodule Model (Daten), View (Oberfläche) und Controller (Funktionalität) werden dabei klar voneinander getrennt entwickelt und sind so flexibel und einfacher austauschbar. Beispiel: Die Oberfläche einer Desktop-Applikation kann einfach durch eine spezielle Mobile-View ersetzt werden, die Funktionalität und die Daten bleiben gleich. Durch Weiterverwendung dieser konsistenten Elemente kann man so mit geringem Aufwand eine mobile Applikation, beispielsweise für Windows Phone 8, entwickeln.

Ein Beispiel aus der Praxis

In einem aktuellen Projekt wurde für eine browserbasierte Applikation (IE8) auf SAP-Basis eine komplette Oberfläche in ASP.NET unter anderem mit Web Forms erstellt. Dazu wurden Prototypen zur schnellen Visualisierung und effizienten Abstimmung zwischen Auftraggeber, Design beziehungsweise User Experience und Entwickler verwendet. Alle benötigten Grafiken und Icons wurden in optimaler Qualität erstellt und direkt an der richtigen Stelle platziert. Die so erstellten Screens wurden von den Entwicklern eins zu eins ins bestehende System integriert. Dabei wurden mit Dummy-Daten und -Schnittstellen zur Datenanbindung gearbeitet, CSS zur Gestaltung der Oberfläche (z. B. autoskalierende Tabellen) und Javascript für Interaktivität und Effekte (z. B. Onscreen-Touch Keyboard). Der letzte Schritt der Integration der Oberfläche ins aktuelle System inklusive SAP-Datenanbindung ging sehr schnell und reibungslos vonstatten.

Im gleichen Zuge wurde eine mobile Variante für einige Funktionalitäten erstellt. Diese sollte auf industrietauglichen Handhelds mit geringer Auflösung im vorinstallierten Browser IE6 Mobile laufen, aber gleichzeitig auch auf modernen Smartphones optimal bedienbar sein. Dank Prototyping auf der Plattform (erst mit jQuery Mobile, was dank fehlender Browser-Unterstützung scheiterte, letztlich dann mit «altmodischem» HTML, JavaScript und CSS) konnte iterativ und zeitnah Feedback eingeholt und so die gewünschte Richtung der Entwicklung effizient gesteuert werden.

Oft hat es Sinn, einen oder sogar zwei Schritte weiter zu gehen. Nicht nur Dokumente zu produzieren, die das Ergebnis möglichst genau beschreiben sollen und doch nicht können, sondern usability-optimierte GUIs zu entwickeln – mit dem Benutzer-Input aus der Evaluation im Hinterkopf und aus einer Hand direkt auf der Zielplattform entwickelt.

Entwickler sind Experten

Sie besitzen wertvolles Fachwissen auf ihrem Gebiet und programmieren routiniert die genialsten Tools. Viele Experten leiden aber oft unter einer gewissen Betriebsblindheit. Der Softwaremarkt ist im Wandel: Es reicht nicht mehr, eine Software nur zu programmieren und dann den Benutzer seinem Schicksal zu überlassen. Um erfolgreich Software entwickeln zu können, müssen heute viele Disziplinen und unterschiedliche Persönlichkeiten zusammenarbeiten. Von Projektmanagern und Marketingfachleuten über Designer und Entwickler bis hin zum Endkunden. Hier ist es wichtig, den Blick von aussen zuzulassen – durch Usability-Experten und vor allem durch Benutzer! Mit möglichst geringem Zeit- und Kostenaufwand sollen möglichst viele Fehler gefunden und ausgemerzt werden. Darin haben Usability-Experten grosse Erfahrung. Durch die richtige Auswahl an Werkzeugen, Methoden und Testpersonen kann genau das erreicht werden: Eine möglichst fehlerfreie und gut zu bedienende Software.

Durch klar definierte Schnittstellen wird die Kommunikation weniger fehleranfällig. Es muss weniger interpretiert werden und Ihre Entwickler können sich endlich «auf das Wesentliche konzentrieren» – ihre Arbeit. Die Ziele und Anforderungen sind klarer definiert, die Projektsicherheit wird deutlich gesteigert. Und die Projektverantwortlichen sparen letztlich Zeit, Geld und Nerven – darum geht’s!