Prototyping, Teil 1: Zustandsdiagramme mit Microsoft Visio

Ganz egal wie man einen Prototyp oder ein ganzes Projekt entwirft und umsetzt, ist ein planvolles Vorgehen dabei empfehlenswert. Die gilt zwar meistens aber eben nicht immer: Denn auch das vordergründig manchmal unorganisiert wirkende Experimentieren und der eher virtuose Umgang mit Ideen und Technologien kann durchaus gewollt und zielführend sein. Schließlich benötigt man ja Phasen, in denen man Anforderungen erarbeitet und ausprobiert und hinsichtlich des zu erwartenden Ergebnis (also wie wirkt das eigentlich auf den Anwender), der Umsetzbarkeit (geht das überhaupt) und des Aufwandes (wie viel Zeit und Geld kostet das) bewertet. Doch auch das klappt nur dann, wenn dies nicht willkürlich sondern als Bestandteil des Entstehungsprozesses geplant wird.

Für das planvolle Vorgehen gibt es eine Vielzahl an Werkzeugunterstützung auf dem Markt. Für die Projektverwaltung, die sich u. a. um die Einteilung der Entwickler und um das Einhalten von Terminen kümmert, bietet sich beispielsweise bei größeren Projekten Microsoft Project an. Für die Planung der eigentlichen Inhalte sind jedoch andere Werkzeuge notwendig.

Draf, Flipchart
Der erste Entwurf auf dem Flipchart (gut, eine Kamera im Mobiltelefon zu haben).

Die Struktur eines Projektes lässt sich über Diagramme entwerfen – grundsätzlich kann dies mit einem Flipchart oder auch einem x-beliebigen Malprogramm geschehen. Wichtig ist ein gemeinsames Verständnis für die Bedeutung der Diagramme. Sprachen wie UML helfen dabei.

Draft, Visio
Der zweite Entwurf als Statechart in Visio.

Ein beliebtes Werkzeug ist hier Microsoft Visio – z. B. unter Verwendung eines Zustandsdiagramms (Statechart). Die Zustände im Diagramm entsprechen bei einer klassischen Website den einzelnen HTML Seiten, die Übergänge von einem Punkt zum nächsten stehen für ein meist benutzerdefiniertes Ereignis wie einen Mausklick. Bei Rich Applications oder auch Spielen ist so eine 1 zu 1 Beziehung oft nur mit komplexen Zuständen beschreibbar (komplexe Zustände sind Zuständen, die ihrerseits wieder aus Zuständen bestehen). Animationen ließen sich zwar ebenfalls mit einem Zustandsdiagramm entwerfen, doch hier reichen dank der linearen Abfolge einfachere beim Trickfilm auch Dope Sheet genannte Listen. Microsoft Excel kann hierfür als Alternative zu spezialisierten Werkzeugen herhalten.

Bereits diese Diagramme oder Listen zeigen, ob die geplante Anwendung schlüssig ist. Außerdem erhält man so ein Gefühl für den Umfang. Aber das Beste ist, dass dieses Diagramme eine hervorragende Grundlage für erste Prototypen der Benutzerführung sind. Dieser Prototyp kann dann Schritt für Schritt mit den Details „verschönert“ werden, so dass am Ende das fertige Produkt steht (denn es muss sich nicht unbedingt nur um einen Wegwerfprototypen handeln).

3 thoughts on “Prototyping, Teil 1: Zustandsdiagramme mit Microsoft Visio

  1. Alsdo das ja nu ein bischen duenn nur Visio vorzustellen und zu sagen das man damit auch Diagramme erstellen kann. Viel lieber wuerde ich ein paar Beispiele zur Erstellung von Sequenz-, Use Case- und Class Diagrammen sehen! 🙂 Ich benutze zwar auch Visio aber ich denke da laesst sich noch eine Menge lernen.

  2. Hi Sascha,

    da hast Du natürlich recht. Aber hier wollte ich auch im Zusammenhang mit einem Workflow nur mal grob einen Überblick geben – mehr nicht. Anschauliche Beispiele sind gerade bei Sequenz-Diagrammen und Use Cases auch wirklich rar, aber wenn ich irgendwann mal mehr Zeit habe, dann wäre das wirklich eine gute Idee, da mal mehr zu zu machen…

    Grüße,

    Sascha.

Comments are closed.