Skizzieren, Prototypen

Transkript

1 Prototyping

2 Skizzieren, Prototypen Nicht nur»nebenprodukt«von Design, sondern wesentliches»instrument«des Denkens und Lernens Sowohl das Zeichnen als auch das»lesen«von Skizzen sind Qualifikationen, die Nicht-Designer von Designern unterscheiden Wichtig ist nicht das Ergebnis, sondern der Prozess! Übergang zwischen Skizze und Prototyp fließend Quelle:

3 Prototypen, Mock-ups Was ist ein Prototyp? Ein Prototyp ist eine limitierte Repräsentation eines Designs, zu einem sehr frühen Designzeitpunkt um die Benutzerfreundlichkeit zu prüfen, erkunden und eventuelle Fehldesigns möglichst früh zu korrigieren. Was ist ein Mockup? Ein Mock-up in der Softwareentwicklung bezeichnet einen rudimentären Wegwerfprototyp der Benutzeroberfläche einer zu erstellenden Software. Quelle:

4 Low and High Fidelity Prototyping Low Fidelity Prototyping dient zur Prüfung von Ideen und Abläufen schnell, billig und leicht änderbar/wegwerfbar (viele Entwürfe) sehr kommunikativ, da alle Beteiligten in den Entwurf miteinbezogen werden Keine/wenig Funktionalität, daher nur begrenzte Erkennung von Fehlern möglicherweise sind nicht alle Ideen technisch umsetzbar High Fidelity Prototyping dient zur Prüfung von Details und genauen Funktionen mehr Funktionalität, nahe dem Endprodukt besser zu testen da der User mit dem Prototyp interagieren kann teuer und aufwendig zu erstellen, Hemmschwelle des Änderns durch enormen Aufwand Aesthetics Usability Functionality Quelle:

5 Paper Prototyping Low-Fidelity Methode Für Webseiten, Webapplikationen und konventionelle Software geeignet Zuerst Aufgaben auswählen, die User ausführen kann Händisch werden Screenshots entworfen mit Fenster, Menüs, Dialogboxen, Quelle:

6 Paper Prototyping Geeignet für folgende Fragen: Sind Begriffe verständlich? Entspricht die Navigation den Erwartungen der User? Werden die richtigen Infos zur Verfügung gestellt? Seitenlayout (zuviel/zuwenig Infos, am richtigen Platz?) Fehlen Funktionalitäten? Weniger geeignet für: Technische Machbarkeit Antwortzeiten Scrolling Farben und Schriftarten Quelle:

7 Bsp: Graphiken aus PDF exportieren Quelle:

8 Bsp: Page Setup Quelle:

9 Bsp: Power Point Quelle:

10 Bsp: Multi-view Visualisierungen Quelle:

11 BSP: Mobiltelephon Quelle: Quelle:

12 BSP: Fernsteuerung Quelle:

13 Interaktion mit Papierprototypen? Prototyp für Formular ausfüllen Tab-basiertes Design Quelle:

14 Wizard of Oz Video (I-Phone Papier-Prototyp):

15 Paper-Prototyping Test (Video) Bild: Video (Prototyping-Test):