UI Prototyping

von Lucie Drasch, 16. Dezember 2004

Prototyping bedeutet die Basisfunktionen und prinzipiellen Abfolgen eines geplanten Systems mehr oder weniger genau darzustellen, so dass sich ein prinzipieller Eindruck des fertigen Systems und dessen Funktionalität gewinnen lässt. Prototyping ist sicherlich mit zusätzlichen Arbeitsaufwand und Kosten verbunden, doch die Vorteile, die sich daraus gewinnen lassen überwiegen bei weiten. Eine der wichtigsten Funktion von Prototypen ist unter anderem, Ideen zu Benutzerschnittstellen und die Qualität einer Lösung untersuchen zu können, bevor darin investiert wird. Somit lässt sich viel Zeit und Geld sparen, wenn sich damit ein Konzept bereits in Vorfeld als nicht durchführbar oder nicht profitabel erweist. Im Detail lassen sich Prototypen innerhalb des Entwicklungsprozesses noch zu vielen weiteren Zwecken nutzen. Sie können dazu dienen eigene Ideen innerhalb des Entwicklungsteams oder Auftraggebern und Kunden vorzustellen und zu diskutieren. Ein handfestes Modell, das sich betrachten lässt und vielleicht schon einige Funktionen ausführt, wirkt meist viel überzeugender als mündliche Vorstellung. Zusätzlich können Prototypen helfen Designentscheidungen zu treffen und Probleme bei der Umsetzung bereits in einem frühen Stadium zu erkennen. Oft wirken Ideen in der Theorie als durchaus logisch und einfach, erweisen sich jedoch in der praktischen Umsetzung als äußerst problematisch oder kompliziert. Auch bei Farbkombinationen sieht man erst in der Praxis wie sie auf den Betrachter wirken. Prototypen erweisen sich aber auch in anderer Hinsicht als äußert nützlich: Usability-Tests lassen sich dadurch bereits durchführen, bevor das System fertig gestellt ist. Dies hat den Vorteil, dass die daraus gewonnenen Erkenntnisse in die Entwicklung einließen können und dadurch Probleme bereits im Vorfeld umgangen werden können. Würde man Usability-Test erst mit dem fertigen System durchgeführen, müssten im Nachhinein eventuell Änderung daran vorgenommen werden oder Teilbereiche ganz neu überlegt werden, weil Sie vom Benutzer nicht angenommen wurden. Dies hat natürlich einen erheblichen Mehraufwand an Zeit und Geld zur Folge. Auch wenn man im Vorfeld evtl. bereits mit Benutzer über deren Vorstellungen gesprochen hat, sind diese doch besser in der Lage ihre Probleme und Wünsche auszudrücken, wenn sie an einem handfesten Objekt hantieren. Ähnlich verhält es sich wenn man ein System im Auftrag für einen Kunden entwickelt. Der kann mit Hilfe der Prototypen seine Bedürfnisse besser und genauer definieren und aufzeigen, was ihn an der Lösung stört und was ihn gefällt. Auf diese Weise kann der Auftraggeber besser in den Entwicklungsprozess einbezogen werden, auch, oder vor allem wenn dieser technisch nicht sehr versiert ist. Denn wer möchte schon sein wohlüberlegtes und hart erarbeitetes System dem Kunden präsentieren, der höchst unzufrieden unzählige Änderungswünsche vorbringt, die sich dann evtl. gar nicht oder nur schwer in das erarbeitete Konzept integrieren lassen.

Bei der Erstellung eines Prototyps sollte man nicht gleich zu euphorisch vorgehen und bereits ein technisch ausgefeiltes System mit voller Funktionalität erstellen. Üblicherweise ist nur ein bestimmter Weg durch das System aktiv oder nur bestimmte Funktionen werden simuliert, wodurch die grundsätzliche Funktionalität des Ganzen aufgezeigt wird. Durch zu umfangreiches Prototyping wäre die grundlegende Absicht vollkommen verfehlt, denn ein Prototyp sollte nie mehr Kosten und Aufwand als Nutzen verursachen. Um dies zu umgehen sollte man einige Vorüberlegungen anstellen. Zunächst sollte man sich darüber im Klaren sein für welchen Zweck und für welches Publikum der Prototyp gedacht ist. Soll er zur Demonstration im eigenen Entwicklungsteam dienen oder potentiellen Kunden vorgestellt werden? Je nachdem muss das Prototyping mehr oder weniger aufwendig betrieben werden, je nach dem technischen Know-How des Publikums. Die Teammitglieder bringen bereits einiges an Wissen zu Technik und dem zu erarbeiteten Projekt mit, also kann man sich hier auf das wesentliche Beschränken, evtl. nur bestimmte Teilbereiche modellieren und einiges bereits voraussetzen. Bei der Vorstellung beim Kunden sollte der Prototyp sicherlich auch optisch etwas hermachen und einen guten Eindruck des zugrunde liegenden Konzepts liefern. Weiterhin sollte man sich fragen ob man sich einen Überblick über das System verschaffen möchte oder nur einen speziellen Bereich näher betrachten. Ist man sich des Zwecks und der Zielgruppe des Prototyps bewusst ist es auch sinnvoll seine Lebensdauer festzulegen. Wie lange kann er der laufenden Entwicklungsarbeit zugrunde gelegt werden?

Grundsätzlich lassen sich hier vier Arten von Prototypen klassifizieren. Der Demonstrations- oder Akquisitions-Prototyp verfügt über eine geringe Funktionalität und gibt eher das Verhalten an der Oberfläche wieder. Der experimentelle oder funktionale Prototyp ähnelt weniger dem Zielsystem, sondern dient dazu funktionale Aspekte des Systems und deren Umsetzbarkeit zu untersuchen. Die Benutzeroberfläche spielt hier keine Rolle, es werden vielmehr die zugrunde liegenden Algorithmen untersucht. Zur Validierung von Design-Entscheidungen bedienen sich die Software-Entwickler den Labormustern, den so genannten Breadboards, die sehr schnell und billig herzustellen sind. Die evolutionären Prototypen wiederum machen die Entwicklung des Systems mit und werden laufend weiterentwickelt.

Zur Erstellung von Prototypen gibt es verschiedene Tools. Für welches man sich entscheidet hängt wieder von den jeweiligen Anforderungen ab. Grundsätzlich sollte damit das graphische Layout von Bildschirmen und Umsetzung der Grundfunktionen schnell und einfach erfolgen. Dabei sollte jedoch großer Wert auf Flexibilität gelegt werden, da ständige Änderungen nicht die Ausnahme sind. Natürlich sollte das zu entwickelnde System mit diesem Tool adäquat darstellbar sein und die gewählten Ein- und Ausgabegeräte unterstützt werden.

Papier z.B. eignet sich zur schnellen und einfachen Herstellung von konzeptionellen Skizzen, ist aber wenig sinnvoll für komplexere Design-Ideen. Meist möchte man bei Prototyping von Benutzeroberflächen nicht großartig mit Codes arbeiten, praktischer sind Tools mit deren Hilfe sich Bildschirmlayouts einfach und direkt-manipulativ erstellen lassen. Daher ist eines des gängigsten und nützlichsten Tools im Bereich Multimedia und graphische Benutzeroberflächen Macromedia Flash. Darin kann man ebenfalls auf einfachsten Weg mittels Animation diverse Funktionalitäten simulieren. Damit lassen sich vor allem Prototypen erstellen, die dem Endergebnis schon sehr ähnlich sehen was auch als High Fidelity (Hi-fi) Prototyping bezeichnet wird. Im Gegensatz dazu steht das Low Fidelity (Low-fi) Prototyping (z.B. mit Papier) in dem noch viele Details des späteren Systems fehlen und das auch im Erscheinungsbild noch sehr ungenau ist. Low-fi Prototypen sind meist sehr schnell und kostengünstig herzustellen, weisen jedoch einige Nachteile auf. Vor allem in Usability-Tests sind sie problematisch, da sie der Benutzer in der Regel nicht alleine benutzen kann, denn es wird noch eine Person benötigt die die Reaktion des Computers simuliert. Auch bestimmte Funktionen, wie scrollen oder draggen, können nicht wirklich realistisch oder gar nicht wiedergegeben werden.

Prototypen sind also sicherlich ein mächtiges und nützliches Werkzeug, doch sollte man sich vor deren Herstellung immer über Zweck und erhofften Nutzen im Klaren sein und den Aufwand entsprechend abwägen.

Bibliographie

Berkun, Scott (2000): The Art of UI Prototyping.
Online-Dokument: http://www.uiweb.com/issues/issue12.htm [05.12.2004]

Dr. Schneider-Hufschmidt (2004): Gestaltung ergonomischer Benutzungsoberflächen Vorlesung 9+10.
Online-Dokument: http://www.mmk.ei.tum.de/lehre/ebof.html [05.12.2004]

Landay, James / Hong, Jason / Klemmer, Scott (2001): Prototyping.
Online-Dokument: http--guir.berkeley.edu-courses-SummerHCI01-slides-03-prototyping.PPT [05.12.2004]

Bäumer, Dirk / Bischofsberger, Walter / Lichter, Horst / Züllighoven, Heinz (2000): User Interface Prototyping – Concepts, Tool and Experience.
Online-Dokument: http://www.ubilab.org/publications/print_versions/pdf/icse96.pdf [05.12.2004]

Blount Brodersen, Carolyn (2002): Basic User Interface Prototyping. Online-Dokument: http://www.stcsig.org/lw/Spring2002.pdf [05.12.2004]