1 Grafische Benutzungsoberfläche für einen Fahrkartenautomaten Labor1 Grafische Oberflächen Philipp Burgk, Johannes Förstner, Tobias Holl, Ruth Schattmann.

1

Grafische Benutzungsoberflächefür einen Fahrkartenautomaten

Labor1 „Grafische Oberflächen“

Philipp Burgk, Johannes Förstner, Tobias Holl, Ruth Schattmann

2

Aufgabenbeschreibung

• Abläufe– Fahrkarten kaufen– E-Ticket aufladen– Fahrplanauskunft abrufen

• Eingaben/Ausgaben– Klicks, Geld (Münzen), Kreditkarte, E-Ticket– Anzeigen, Ticket, Münzen, Kreditkarte, E-Ticket

3

Beschreibung der Benutzer

•Rentner–Langsame Eingaben–Eingeschränkte Sicht–Tippt oft daneben

•Tourist–Keine Ortskenntnis/orientierungslos–Erstmalige Automatenbenutzung–Falsche Eingaben

•Geschäftsmann–In Eile–Weiß genau, wohin/was er will

4

Aufgabenbeschreibung

•Leistungen (Erlernbarkeit, Geschwindigkeit)

Vorgang Kriterium Hilfe Benutzer

Ticket kaufen • 5 min ohne Vorkenntnisse• 1 min sonst

•Kann lesen/schreiben•Besitzt Bargeld/Kreditkarte

E-Ticket aufladen •5 min ohne Vorkenntnisse• 1 min sonst

•Kann lesen/schreiben•Besitzt Bargeld/Kreditkarte

FahrplanauskunftAbrufen

•5 min ohne Vorkenntnisse• 1 min sonst

•Kann lesen/schreiben

5

Fallstudie – „Ticket kaufen“

•Ticketkauf auswählen•Abfahrtsort festlegen/bestätigen•Zielort festlegen/bestätigen•Rabatt bzw. Anzahl der Tickets festlegen•Evtl. Rückfahrt hinzufügen•Geld einwerfen•Kauf bestätigen•Ticket drucken•Rückgeld entnehmen

6

Fallstudie – „E-Ticket aufladen“

•E-Ticket einstecken•Zahlungsmitteln eingeben (Geld/Kreditkarte)•Betrag bestätigen•Neuen Wert des E-Tickets anzeigen•E-Ticket ausgeben•Rückgeld ausgeben

7

Fallstudie – „Fahrplan abrufen“

•Fahrplanauskunft auswählen•Abfahrtsort auswählen/bestätigen•Ziel auswählen/bestätigen•Uhrzeit/(Datum) auswählen/bestätigen•Fahrplan anzeigen

8

Styleguide

•Font: Calibri•Farben: Blautöne•Metaphern: Holl‘sche Icons

9

Storyboard – „Ticket kaufen“

10

Storyboard – „Fahrplanauskunft“

11

Storyboard – „E-Ticket aufladen (cash)“

12

Storyboard – „E-Ticket aufladen (CC)“