Continuity-Seminar-Dokumentation (unfertig) 2006-02-16

»Continuity«
Nachforschungen und Experimente zur Psychologie der Interaktion

Gelungene Interaktionsgestaltung schafft ein positives Gefühl: man kann in
die Tätigkeit eintauchen – ganz gleich, ob es sich hierbei um das (vermeint-
lich passive) Anschauen eines Kurzfilms handelt oder um Computerspielen.
Selbst die Bedienung eines Fahrkartenautomaten kann sich “natürlich an-
fühlen” oder eben nicht.
Wie aber stellt man dieses Gefühl her? Hierzu werden eine Vielzahl von Fak-
toren ausbalanciert. Welche Faktoren dies sind wird u. a. von Psychologen
in Form von Denkmodellen vorgeschlagen. Betrachtet man diese, ergeben
sich Fragen: Wie genau können diese Erkenntnisse zur Lösung von Entwurfs-
fragen herangezogen werden? Wie produziert man also eine hohe Erlebnis-
qualität? Wann (und vor allem warum) fühlt sich etwas “richtig” und “stim-
mig” an?

Dokumentation Continuity-Seminar / Oliver Wrede /
FH Aachen / WS 05/06 /
Kristina Mickartz, Niklas Schneider, Tobias Jordans /
http://nexus.design2.fh-aachen.de/seminare/wrede/continuity/

Dokumentation Continuity-Seminar / Oliver Wrede / FH Aachen / WS 05/06 / Kristina Mickartz, Niklas Schneider, Tobias Jordans / http://nexus.design2.fh-aachen.de/seminare/wrede/continuity/ / Seite

Phasen

Recherche Mindmap Beispiele Fahrkartenautomat

Im Seminar-Weblog exemplarisch: Analyse Redesign Redesign
unter http://nexus. Flow im Neptunbad Fokus: Usability Fokus: Übergänge
design2.fh-aachen.
de/seminare/wrede/ – Umfeld Logik im Screen Logik zwischen
continuity/ – DB-System den Screens
– andere Systeme

Dokumentation Continuity-Seminar / Oliver Wrede / FH Aachen / WS 05/06 / Kristina Mickartz, Niklas Schneider, Tobias Jordans / http://nexus.design2.fh-aachen.de/seminare/wrede/continuity/ / Seite 2

Phasen


design2.fh-aachen.
– andere Systeme


Recherche Mindmap

Zu Beginn des Seminars stand ein ausführlicher Rechercheteil, der dazu diente Befinden sich Herausforderung und Fähigkeiten auf einem ausgeglichenen Level
einen Einstieg in die Thematik zu finden, indem wir uns mit Aspekten aus den und entsprechen externe und intrinsische Bedingungen dem Optimum, ensteht
Bereichen der Flowtheorie nach Csikszentmihalji, Learnability und Usability aus- ein sogennannter Makroflow. SInd nicht alle Voraussetzungen optimal gegeben,
einandersetzten und dazu sammelten. Im günstigsten Fall sollte diese Recherche kann trotzdem ein sogenannter Mikroflow enstehen, wobei sich mehrere MIkro-
schon einen dieser 3 Bereiche als besonders herausragend im Hinblick auf die flows zu einem Makroflow aufschaukeln können. Ein Makroflow kann allerdings
Gestaltung nach „Flowkriterien“ identifizieren. nicht in einen oder mehrer Mikroflows zurückfallen. Ein Makroflow ist demnach
ein emergentes Ereignis.
Von der Fülle an Artikeln und Informationen die sich zu diesem Thema fanden Es gilt also, absolute „Flow–Killer“ wie Angst und Langeweile zu vermeiden und
überwältigt, mußten wir relativ schnell einen anderen Ansatz, als das bloße Sam- Zustände der Angeregtheit und Kontrolle zu verstärken.
meln, verfolgen. Wir kamen zu dem Entschluss, dass es am sinnvollsten wäre, Bei der näheren Betrachtung maßen wir dem Aspekt der Erlernbarkeit (Learnabi-
die Informationen in einer MindMap zu strukturieren, und zu versuchen durch lity) eine große Bedeutung zu. Um ein Flow–Erlebnis haben zu können, darf eine
Clustern die relevanten Themenfelder herauszuarbeiten und damit zugänglich zu Person weder über– noch unterfordert werden. Dies setzt voraus, dass Elemente
machen. der Tätigkeit immer intuitiv, unterbewusst oder zumindest ohne bewussten
Wir ordneten Schlagworte, Definitionen und Denkmodelle aus Büchern, Websei- Aufwand erlernbar sein müssen. Komponenten für die Erlernbarkeit sind: Ver-
ten und Artikeln den Haupt–Themengebieten Flow, Learnability und Continuity trautheit, Konsistenz, Generalisierbarkeit, Voraussagbarkeit und Einfachheit (der
zu. Tätigkeit, der Aufgabe, des Designs). Durch einen unbewussten Lernprozess ver-
bessern sich die Fähigkeiten der Person fließend während der Ausübung der Tä-
Flow ist ein optimales Ereignis der menschlichen Wahrnehmung und ist nach tigkeit und passen sich immer neuen Herausforderungen der auszuführenden
Csikszentmihalji die Basis für gesteigerte Lebensqualität. Tätigkeit an.
Flow beschreibt nach unserer Einordnung eine Kette von störungsfreien Hand- Die Bedeutung des Unterbewusstseins wird ausführlich von Malcolm Gladwell in
lungsabläufen, die von aussen, z.B. durch positives Feedback, angetrieben (er- dem Buch Blink! beschrieben. An Hand mehrerer Beispiele untersucht Gladwell
lebnisbezogen / experiencial) oder intrinsisch motiviert (reflextionsbezogen / den Moment, indem wir unbewusst schnellste Entscheidungen treffen. Diese
conceptual) sein können. Abhängig von der Ausgeglichenheit der Herausforde- Form der Beurteilung bezeichnet er als Rapid Cognition. Eine solche Art der un-
rung, die die Aufgabe oder Tätigkeit (challenge) darstellt und den Fähigkeiten der terbewussten und schnellen Wahrnehmung, Verarbeitung und Bewertung spielt
Person (skill) entsteht bei der Lösung der Aufgabe bzw. Ausübung der Tätigkeit ebenso bei Flow–Erlebnissen eine große Rolle.
Langeweile, Angst, Teilnahmslosigkeit oder eben Flow. Wir stellten fest, dass auch das, was wir unter Continuity verstehen, erst enste-


hen kann, wenn bestimmte Voraussetzungen erfüllt sind, die sich teilweise mit Bei einer Gegenüberstellung der Voraussetzungen für Flow bzw. Continuity fan-
den Vorgaben von Csikszentmihalji überschneiden. Kriterien übernahmen wir aus den wir heraus, dass um einen Zustand des Flow zu erleben, mehr Kriterien
dem Artikel von Thomas P. Novak und Donna L. Hoffman „Measuring the Flow Ex- unbedingt gegeben sein müssen als bei Continuity. Somit ist ein Zustand der
perience Among Web Users“ (veröffentlicht auf der Interval Research Corporation Continuity eher oder einfacher zu erreichen als ein Flow.
1997). Anhand folgender Kriterien lassen sich sowohl Flow als auch Alle Bereiche des Flow, der Learnability, dem, was in dem Buch Blink! beschrieben
wird und dem, was wir mit dem Begriff der Continuity einrahmen, überlagern
Continuity festmachen: sich teilweise, gehen ineinander über, haben Schnittmengen – je nach Definition
– Learnability und Schwerpunkt variieren diese Überschneidungspunkte.
– Involvement
– OSL (Optimum Stimulation Level)
– Interactive Speed (Interaction)
– Skill
– Challenge
– Control
– Arousal
– Focused Attention
– Playfulness
– Positive Affect
– Exploratory Behaviour
– Time Distortion
– Importance


Ein Versuch, in eigenen Denkmodellen zwei mögliche Betrachtungspunkte der Grafik
Relationen aufzuzeigen:

1. Flow im Zentrum [Grafik 1] – das konzentrierteste Themengebiet. Je weiter Flow
die anderen Themen vom Zentrum entfernt sind, desto weniger konzentriert
sind sie, desto weniger Voraussetzungen müssen erfüllt sein, damit dieser Zu-
stand entsteht und desto häufiger kann man diesen im Alltag erleben.
Learnability

Continuity
2. Continuity als Teil von dem, was Flow ausmacht [Grafik 2]: von allen Voraus-
setzungen, die erfüllt sein müssen, damit Flow enstehen kann, müssen für einen
Blink
Continuity–Zustand nur wenige gegeben sein. Aspekte wie Learnability, kogni-
tive Voraussetzungen und Anwendungen, die Flow oder Continuity begünstigen
können, sind extern einwirkende Faktoren, die Einfluss nehmen, aber nicht di-
rekt Teil sind.

Keines der Modelle lässt sich als richtig oder falsch definieren – beide sind Dar-
stellungen möglicher Betrachtungsweisen.

Durch unsere Analyse, Synthese, Gruppierung, Umstrukturierung und Neuver-
knüpfung der Themen Flow, Learnability und Continuity haben wir uns einem Er- Grafik 2
gebnis insofern angenähert, als dass wir innerhalb der Gruppe ein gemeinsames
Verständnis aller Begriffe hatten, uns diese zugänglicher waren – doch befanden
wir uns noch immer auf einer abstrakten Ebene weit entfernt von konkreten, Continuity ()
anschaulichen Beispielen.

Eine Annäherung an die gestalterische Praxis war die Analyse der Flowkriterien Flow (7)

lty

Bl niti neh
bi
nach Beeinflussungsfaktoren:

re nu en

in
na

Ko ah
er i lf
he y

k
Was sind Faktoren, die die Konzentration, Ziel–, Rückmelde– und Kontrollkom-

ic it
nt e
ar

g r
zu o h

W
n
Le

petenz, Selbstverlorenheit, Zeitverlust, Autotelie, selbstgestellte Herausforde- / C die

ve mu
ow n

rungen und Fähigkeiten einer Person beeinflussen können? Wie kann die Ge-
Fl de
ho

staltung gegen eventuelle Beeinträchtigung wirken? Wie kann Gestaltung diese
et

ng
M

Faktoren verstärken bzw. verringern? Welche Rolle spielt das Umfeld?


Phasen


design2.fh-aachen.
– andere Systeme


Um die Recherche im Themenumfeld Continuity
zu überprüfen, sammelten wir Beispiele, bei
denen das Benutzer-Erlebnis durch optimierte
Abläufe und Interaktionsgestaltung, besonders
gut ist oder verbessert werden könnte.

Exemplarisch hierfür die Beschreibung des
Neptun-Bad-Fitness-Centers.

_Schlüsselmetapher wird ausgebaut - TGS _Das Terminal - 1. Anlaufstelle in der _Das Training an den Geräten
Schlüssel in der Umkleide Trainingshalle
Der obere Balken zeigt den „Range Of Moti-
Auch die Umkleidekabinen lassen sich mit dem Im Plan Menü werden mir alle zu absolvierende on“ (ROM) an. Der ROM beschreibt den auf
TGS Schlüssel auf- und zuschließen. Übungen, Anzahl der Wiederholungen und die mich eingestellten Bewegungsablauf und die
während des Trainings zu bewegende Arbeits- Geschwindigkeit mit der die Übung auszufüh-
Wird der TGS ans Schloss gehalten, so leuchtet last angezeigt. ren ist. Der ROM Balken hilft einem die Übung
es von innen her grün auf... richtig durchzuführen und sich ggf. selbst zu
Zusätzlich gibt es die Möglichkeit sich die zu korrigieren. Man braucht jetzt nur noch das Dis-
absolvierenden Übungen in Form von kleinen play im Auge behalten, um die Übung korrekt
Videos nochmal anzuschauen. auszführen.

Über einen „Drucken“ Button kann man sich Die kleine gelbe Raute unter dem Balken läuft
seinen Plan auch direkt am Terminal ausdru- immer vor und zeigt mir die Geschwindigkeit an
cken lassen und mitnehmen. mit der die Bewegung auszuführen ist.
Weiterhin finden sich Angaben über Übungs-
umfang (Sätze Wiederholungen), sowie das
momentan aufgelegte Gewicht.

In der Mitte des Displays befindet sich ein Icon.
Wird die Übung korrekt ausgeführt, ist ein Smi-
ley zu sehen. Bin ich zu schnell, erscheint ein
Hase, wenn ich zu langsam bin eine Schildkrö-
te. Wenn ich meinen Bewegungsradius „verlas-
se“, beispielsweise überdehne, wird das ROM
Icon angezeigt, das mich mahnt meinen „Range
Of Motion“ einzuhalten.

_Auschecken _Auschecken

Wenn ich jedoch Auschecke ohne mein kom- Hat man Interesse, kann man sich jetzt noch mehr in Niklas‘ PDF t
plettes Programm absolviert zu haben werde Statistiken und Graphiken anzeigen lassen, die
ich darauf aufmerksam gemacht und muss einem die bisherigen Trainingsergebnisse und
bestätigen, dass ich wirklich auschecken möch- Leistungssteigerung vor Augen führen.
te, bevor die Daten vom Schlüssel übertragen So kann man selbst nocheinmal kontrollieren,
werden. wann man welche Übung gemacht hat und in
welchen Schritten man Fortschritte macht.
Nach dem Übertragen der Daten wieder der Andere Statistiken sind eher spielerischer Na-
Startbildschirm. tur, wie z.B. die Tour de France Statistik, die
Aufschluß darüber gibt, wieviele Kilometer des
berühmten Rennens man auf dem Rad im Stu-
dio schon zurückgelegt hat.


Analyse Fahrkartenautomat
Problemanalyse Umfeld
Das Umfeld, in dem eine Mensch-Maschine-Interaktion stattfindet, beein-
flusst das Benutzungserlebnis genauso nachhaltig wie das Interface selbst.

Die Problempunkte, die wir in der folgenden Illustration auflisten, sollen
exemplarisch zeigen, wie vielfältig die beeinflussenden Faktoren sind.
Die Antwort, die ein Köllner „Automaten-Guide“ uns auf die Frage gab,
warum so viele Menschen Probleme beim Fahrkartenkauf hätten, erfasst das
Problem zu oberflächlich:
„Die Menschen sind einfach zu ungeduldig...
eigentlich ist die Bedienung ganz einfach.“

Eine ganzheitliche Interface-Optimierung muss das Screendesign verlassen
und auch die Flow- und Continuity-Killer im Umfeld betrachten und opti-
mieren.


Automaten-Vielfalt Lärm-Verschmutzung
– Zwei Automaten „Fahrkarten“ und „Fahraus-
– Zwei Automaten „Fahrkarten“ und „Fahraus- –
– Lautsprecherdurchsagen
weise“ mit unklarer Funktionsdifferenzie-
weise“ mit unklarer Funktionsdifferenzie- – Gespräche in der Umgebung
– Gespräche in der Umgebung
rung –
– Verkehrsgeräusch
– Verkehrsverbünde haben unterschiedliche
– Verkehrsverbünde haben unterschiedliche
Oberflächen Funktionen
Oberflächen Funktionen

Gestaltung der Oberfläche
– Position von Eingabe-, Ausgabe- und Bezahl-
Felder
– Flächen- und Farbegestaltung
– Informationstexte auf der Oberfläche

Schmutz und Sauberkeit
– Aufkleber-Chaos auf den Automaten
– zerkratzte/zerstörte Elemente
– Sauberkeit am und um den Automaten

Tarifsystem Zeitdruck
– hohe Komplexität des DB-Systems
– hohe Komplexität des DB-Systems – die Gefahr, den Zug zu verpassen
– die Gefahr, den Zug zu verpassen
– noch komplizierter in Kombination mit Ver-
– noch komplizierter in Kombination mit Ver- – wartende Menschen in der Schlange
– wartende Menschen in der Schlange
kehrsverbünden... – der Kauf dauert länger, als man möchte
– der Kauf dauert länger, als man möchte


Beispiele anderer Fahrkartenautomaten
Andere Verkehrsverbünde haben andere Systeme. Häufig sind sie besser zu
bedienen. Meist orientieren Sie sich stärker an den Interface-Vorschlägen
der Automatenhersteller.

Die DB kauft die Automaten zwar von Drittherstellern ein, verwendet aber
ihre eigene Bedieneroberfläche.


P Berliner Verkehrs Betriebe
– Display angewinkelt
– gute Tochscreens
– Karte eingebaut
– klare und einfache Gliederung der Funkti-
onen
– klare Button-Stadien
– Animationen bei Schritt Geldkarte und
Fahrkarte


P S-Bahn Berlin
– Display angewinkelt
– gute Tochscreens
– klare und einfache Gliederung der Funkti-
onen am Screen und am Automat
– Addieren von Fahrkarten

S-Bahn Essen p
– gute Umsetzung externer Button
– logische Menüführung


Q S-Bahn Berlin
– Geldkarten-Schlitz nicht gekennzeichnet
entzieht Benutzer der Kontrolle (Karte wird
ganz eingezogen)
– Werbung lenkt Aufmerksamkeit ab


Beispiel DB-Fahrkartenautomat
Das Tarifsystem der Deutschen Bahn (DB) stellt in seiner Komplexität hohe
Anforderungen an Strukur und Gestaltung eines Fahrkartenautomates.

Das aktuelle Design der Bahn hat an einigen Stellen gute Lösungen gefun-
den, zum Beispiel die Auswahl von Start- oder Ziel-Städten über die On-
Screen-Tastatur.
An vielen anderen Punkten jedoch, sehen wir Verbesserungspotential.
Beobachtungen am Bahnsteig zeigten, dass der „Fluss“ des Fahrkarten-Kaufs
häufig durch inkonsistente Bedienelemente und unklare Schritt-Abfolge
unterbrochen wurde.

Im Folgenden bennen wir einige dieser Problempunkte.


Die Fahrkartenautomaten der unterschiedlichen Verkehrsvereine und Ver-
kehrsmittel (Zug, S-Bahn, Bus) sind schlecht zu unterscheiden.
Farblich deutlichere Unterscheidungsmerkmale der verschiedenen Auto-
maten.
Deutliche Logopositionierung und Logogröße.

Der Anweisungstext ist viel zu lang.
Anleitung kürzer.
Statt einer langen Anleitung eindeutige Führung durch den Kaufvor-
gang.

Das Nummernfeld ist weit vom Touchscreen und dem Eingabeschlitz für
Geldkarten entfernt.
Das Nummernfeld, der Touchscreen und der Eingabeschlitz für Geldkar-
ten sollten sich unmittelbar nebeneinander befinden.

Der Touchscreen ist senkrecht in den Automaten eingelassen.
Eine angeschrägte Position erleichtert die Eingabe.

Klickbare Flächen (Buttons) sind nicht deutlich genug abgehoben von
nicht klickbaren Flächen.
Unterscheidung von klickbaren und nicht klickbaren Flächen in Form
und Farbe (Schatten, dezenter 3D–Effekt)

Bezeichnugen sind nicht allgemein benutzerverständlich. Manche Begriffe
sind nicht selbsterklärend und machen ein Nachlesen erforderlich, für das
an einem Automaten selten Zeit ist.

Benennung, Größe und Anordnung der Buttons erscheint willkürlich.
Eine Kategorisierung unter Begriffen wie z. B. Kartenkauf, Service und
Angebote würde die Orientierung auf dem Bildschirm erleichtern.

Der Statusanzeiger befindet sich nicht unter dem drückenden Finger,
sondern darüber. Ein Klick erfolgt nie dort, wo der Benutzer den Finger
ansetzt.
Ein optisches Feedback darf den Benutzer nicht verwirren. Eine kor-
rekte Kalibrierung ist erforderlich.


Die Sortierung der angezeigten Bahnhöfe scheint willkürlich.

Begriffe auf Buttons geben nicht an, wohin der nächste Klick führt.
Die Sortierungssystematik und Bezeichnugen müssen selbsterklärend sein.

Die Reaktionszeit des Interaces ist teilweise so lang, dass sich Benutzer
fragen, ob das System komplett abgestürzt sei.
Schnelleres Betriebssystem

Die „Menüführung“ in der Statusanzeige links ist zu unauffällig. Der
ungeübte Benutzer kann nur schwer erkennen, in welchem Status er sich
befindet.
Deutlich sinnvollere Strukturierung der Bedienelemente und
Eingabeschritte.
Buttons mit denselben Funktionsprinzipien müssen sich ähneln.
Nur Buttons mit den selben Funktionsprinzipien dürfen sich sich ähneln.

ABC–Tastatur muss als Kompromiss verstanden werden, auf der jeder Be-
nutzer suchen muss. Eine QWERTZ–Tastatur erleichtert nur Computernut-
zern die Eingabe.

Der Bildschirm ist überfüllt mit klickbaren Elementen.
Eine Trennung durch untergelegte farbige Flächen brächte Ordnung auf
dem Screen.
Eine Systematisierung der Größe der Buttons würde ebenfalls mehr Platz
schaffen.


Die zwei grauen Flächen mit rotem Balken bieten dem Betrachter keine
Möglichkeit der Hirarchisierung, obwohl beide Flächen unterschiedliche
Informationen beinhalten.
Deutliche Unterscheidung von Elementen mit differierenden Inhalten.
Anordnung und Farbgebung nach Hirarchien.

Die Anordnung von Text zu Flächen ist unlogisch, viel Raum wird ver-
schenkt.

Bezeichnungen wie „Auswahl“ und „Fahrkarte (für obige Auswahl)“ sind
missverständlich.
Eindeutige Bezeichnungen wie „Ihre Angaben“ und „Ticketpreis“ sind
verständlicher.

Die Abbildungen rechts, die zum schnellen Verständnis der Zahlungsmög-
lichkeiten dienen sollen, können in dieser Anordnung nur verwirren.
Eine Betitelung wie „Ihre Zahlungsmöglichkeiten“ oder vollständige
Sätze „Bitte zahlen Sie jetzt mit folgenden Karten“ sind sinnvoll.
Anleitungen zur Zahlung sollten direkt auf die Geldkarteneingabe ver-
weisen können.
Es ist ausreichend, den Ticketpreis einmal an sichtbarer, eindeutiger
Stelle zu positionieren.


Phasen


design2.fh-aachen.
– andere Systeme


DB-Redesign / Fokus: Usability

Im ersten Schritt der Überarbeitung, haben wir uns fast ausschließlich mit
der Optimierung der Usability befasst.

Die zentralen Ziele waren dabei:
– Übersicht schaffen
– unnötige Schritte und Button entfernen
– ein Design-System etablieren
– zentrale Usability-Probleme wie Button-Stadien beheben

Es gibt aus dieser Phase zwei End-Entwürfe von Niklas und Tobias.


Express-Kauf Express-Kauf zurück zur
13.12.2005 23:05 Uhr
 abbrechen 13.12.2005 23:05 Uhr
 abbrechen
 Übersicht ANSICHT: REgIoN NRW 13.12.2005 23:05 Uhr

Fahrkarten Auskunft Service Bitte passen Sie diese Angaben an! Bitte wählen Sie Ihren Abfahrts-Bahnhof!
durch  Tastatur oder Karte
 Platzreservierung von nach
 Express-Kauf  Fahrplanauskunft Hamburg Abfahrts-Auswahl


 Vorbestellte Karten abholen  Deutschland
(Bahn-Tix)  Aachen Hbf  Köln Hbf
 Tarif-Info  bahn.corporate-Firmen-
Aschaffenburg... 
 Normalkauf kunden AVV Düsseldorf
Köln
Schritt-für-Schritt  Spezial-Angebote im Angelika... 
Herbst, ...  1 Erwachsener  2. Klasse  keine BahnCard Aachen
Düren
 Schönes-Wochenende-Ticket Aschaffenburg... 
Abfahrt
Freiburg
 Ländertickes und
Anschluss-Ticket NRW-Tarif Angelika... 
 sofort  nur RB/RE/...  direkte Verbindung
 Wochen-/Monats-/Jah-
res-Karten Aschaffenburg... 

 Die Rückfahrt kann im
München Angelika... 
Anschluss automatisch gebucht Verbindungen anzeigen 
Winter-Special Für 29 EUR durch ganz Deutschland fahren  mehr werden.

Express-Kauf zurück zur Express-Kauf Angaben Express-Kauf Angaben
 abbrechen
 Übersicht 13.12.2005 23:05 Uhr
 abbrechen
 ändern Di 13.12.2005 23:05 Uhr
 abbrechen
 ändern Di 13.12.2005 23:05 Uhr

Wie viele Personen fahren mit? Bitte wählen Sie Ihre Verbindung aus! Bitte EC-Karte einstecken!
kein ICE/IC/EC, 1 Erwachsener, 2. Klasse, keine BahnCard Drucken
Aachen Hbf  Köln Hbf
Aachen Hbf  Köln Hbf kein ICE/IC/EC 1 Erwachsener 2. Klasse keine BahnCard
Erwachsener 2 + - Ihre Hin- und Rückfahrt-Details
Sortierung: Abfahrt Ankunft Dauer Preis Abfahrt in 9 Min. Umsteigen (5 Min. Aufenthalt) Ankunft
eigene Kinder
(6-14 Jahre) 2 + - 
früher
13.12. 20:19 21:10 12,30 € 
20:19
Aachen Hbf
RE 20:55
Köln Hbf
RB 21:10
Düsseldorf Hbf
RE RB 3:00
Abfahrt am 14.12.2005 Ankunft

Kind (6-14 Jahre) 1 + - 13.12. 20:44
RE RB
21:15
RB 2:46
12,30 €  9:20 RE 12:00
Düsseldorf Hbf Aachen Hbf

 Kinder ab 15 Jahre gelten als Erwachsene. 13.12. 20:19 21:10 12,30 € 
RE RB 3:00 29,90 €
 Ab 5 Personen ist ein
Mini-Gruppenticket gün- später 14.12. 20:44 21:15 12,30 € 
Eingabe in Übersicht übernehmen  
RE RB 2:46 EC-Karte einstecken 
stiger!  Details

Alle Screens im PDF t

Tobias Jordans


Fahrkarten Service Angebote Bitte wählen sie ihren Abfahrtsbahnhof Zu wieviel Personen reisen Sie?
Expresskauf Fahrplanauskunft Spezial Angebote
Aachen... Atze Bodo Chur Erwachsene Mehr...

Normalkauf Platzreservierung Angebote Ahrweiler Berta Christian... Dortmund...
der Partner

Adam Birgit Caro Dalia Kinder (6-14 J.) Mehr...

Schönes-Wochenende Ticket Abholung
Ticket Axel Brigitte Christoph Dieter
Erwachsene mit eigenen Mehr...
Mehr Fahrkarten... bahn.corporate Kindern bzw. Enkeln (6-14 J.)
Firmenkunden
Mehr...
Sie können hier den Namen des
gewünschten Bahnhofs eingeben Q W E R T Z U I L !
A S D F G H J K P

Y X C V B N M O Ä
Zurück Abbruch Zurück Abbruch Bitte bestätigen sie ihre Auswahl Ok

Bitte wählen Sie Zeitpunkt und Art der Verbindung Bitte wählen Sie Datum, Uhrzeit und Sind ihre Reisedaten korrekt?
für die Hinfahrt Art der Verkehrsmittel für die Rückfahrt Von Aachen HBF
nach Düsseldorf HBF
für 2 Erwachsene
Heute Datum Uhrzeit Verkehrsmittel
mit BahnCard 25 - 2. Klasse
13.01.2006 13:24 Uhr in der 2. Klasse
Morgen
Hinfahrt am 16.12.2005
Alle
Anderes Datum... 1 2 3 1 2 3 um 11:30 Uhr
mit alle außer ICE
4 5 6 4 5 6
Alle außer ICE Verbindung direkt
7 8 9 7 8 9 JA, meine Daten sind korrekt !
Direktverbindung Rückfahrt am 16.12.2005 Mögliche Verbindungen anzeigen
0 0 Alle außer ICE/IC/EC um 18:40 Uhr
Über... mit alle außer ICE NEIN,meine Daten sind nicht korrekt
Verbindung direkt und ich möchte sie ändern !

Zurück Abbruch Bitte bestätigen sie ihre Auswahl Ok Zurück Abbruch Bitte bestätigen sie ihre Auswahl Ok Zurück Abbruch


Niklas Schneider


DB-Redesign / Fokus: Übergänge

Nachdem gezeigt wurde, dass das Interface schon durch eine veränderte
Struktur und grafische Aufbereitung starke Verbesserungen erfährt, ver-
suchten wir den Bedienungsfluss durch die Animationen zwischen den
Einzelscreens weiter zu optimieren.

Ziel dieser Übergänge soll sein:
. Die Aufmerksamkeit des Benutzers halten und durch dramaturgisch ge-
plantes Einblenden der Elemente lenken.
2. Dem Benutzer die Orientierung auf dem Folgescreen erleichtern da die
Veränderungen nachvollziehbarer sind.

Ein System, das diese Kriterien erfüllt, birgt Vorteile für den Benutzer:
– Das Gefühl, die Kontrolle zu haben und involviert zu sein, wird bestärkt.
– Das übergeordnete Interaktionsmodell kann leichter verstanden werden.
– Die kognitive Last wird reduziert / man findet sich schneller zurecht.
– Die Bewegungen sprechen den Spieltrieb an und machen die Bedienung
dadruch attraktiver.
Paper Prototypes
– Die Animation verstärkt die Eingabebestätigung.
Um diesen Anforderungen gerecht zu werden, mussten wir die bestehenden
Layouts, die rein Scree-für-Screen gestaltet waren, stark überarbeiten.
Wir fanden ein mentales Modell, das sich gut animieren lässt und leicht zu
verstehen ist.
Für die Entwicklung dieses Modells bedienten wir uns mehrerer Papier-
Prototypen. Nur mit dieser Technik war es möglich, schnell Korrekturen am
Animationsmodell vorzunehmen und diese direkt im Interface zu testen.


13.12.2005 23:05 Uhr 13.12.2005 23:05 Uhr 13.12.2005 23:05 Uhr
 Kauf  Kauf
abbrechen abbrechen
Fahrkarten
Expresskauf Expresskauf
Express-Kauf  zurück

Eingabe Zielbahnhof

Normalkauf (Schritt-für-Schritt)  von Aachen Hbf  Tastatur oder Karte

besondere Tickets  über –  | Z

nach Köln Hbf  q w e r t z u i o p
Auskunft
Fahrplanauskunft  mit Regionalverkehr (RE/RB/S)  a s d f g h j k l

Sonderangebote Tarif-Info  Reisende 1 Erwachsener, 2. Klasse, keine BahnCard  y x c v b n m ö ä ü

Leertaste
Abfahrt oder Ankunft
Service
Platzreservierung, Karten abholen, bahn.corporate  am sofort (25.01.2006)  Aachen... Mönchengladbach...

um sofort (9:20 Uhr)  Köln... Berlin...

Winter-Special Verbindungen suchen  Düsseldorf... Frankfurt...
Für 29 EUR durch ganz Deutschland fahren  mehr

13.12.2005 23:05 Uhr 13.12.2005 23:05 Uhr
 Kauf  Kauf
abbrechen abbrechen

Expresskauf Expresskauf
zurück

Auswahl der Verkehrsmittel

von 

über – 

nach Aachen Hbf  alle

mit Regionalverkehr (RE/RB/S)  Regionalverkehr (RE/RB/S)

Reisende 1 Erwachsener, 2. Klasse, keine BahnCard  alle außer ICE/Thalis

alle außer ICE/EC/IC/Thalis

am sofort (25.01.2006) 

um sofort (9:20 Uhr) 

Verbindungen suchen 

13.12.2005 23:05 Uhr 06.02.2006 20:05 Uhr
 Kauf  Kauf
abbrechen abbrechen

Expresskauf
Expresskauf 
ändern
Verbindungen ab 06.02.06 9:20 h
Köln Hbf Y Aachen Hbf, Regionalverkehr
von 
mit 1 Erw., 2. Klasse, ohne BahnCard
Animationsbeispiel in Flash t
über –  Sortierung: Abfahrt Ankunft Preis

 20:19 21:10 12,30 €
nach Aachen Hbf  früher 
RE RB 1:09

mit Regionalverkehr (RE/RB/S)  20:39 21:15 13,50 € 
RE 0:54

Reisende 1 Erwachsener, 2. Klasse, keine BahnCard  21:19 22:10 12,30 € 
RE RB 1:09

21:39 22:15 13,50 € 
RE 0:54

am sofort (25.01.2006)  22:19 23:10 12,30 € 
RE RB 1:09

um sofort (9:20 Uhr)  22:39 23:15 13,50 € 
RE 0:54
Tobias Jordans
später 00:19 01:10 12,30 €
Verbindungen suchen  

RE RB 1:09


Fazit


Continuity-Seminar-Dokumentation (unfertig) 2006-02-16

Weitere ähnliche Inhalte

Andere mochten auch

Continuity-Seminar-Dokumentation (unfertig) 2006-02-16