Alex Gottschalk Zurück zu Projekte

Semester

Interaktionsgestaltung 6
Sommersemester 2019

Kurs

Interface Design

Dozent

Prof. Hans Krämer

Projektpartner

Christian Paulo
Vera Schindler-Zins

Adaptive User Interfaces

Erweiterte Eingabemethoden zur Optimierung individueller Nutzererfahrung für öffentliche Dienstleistungsautomaten - am Beispiel des Fahrkartenautomaten der Deutschen Bahn

Ein AUI als Werkzeug für die Bedienfreundlichkeit

Die meisten aktuellen Produkte haben eine Benutzeroberfläche, welche für alle Nutzer funktionieren muss. Die Anforderungen der Nutzer an das System sind allerdings oftmals sehr unterschiedlich. Ausgehend von der Textgröße, über Feedback, bis zur Benutzerschnittstelle – die Ursachen für Problemen bei der Bedienung können vielseitig sein.

Dabei gibt es eine Lösung, die genau diese Probleme addressiert: Ein Adaptive User Interface oder kurz AUI. Die Entwicklung ist mit einem enormen Mehraufwand verbunden, bringt aber auch enormes Potienzial in Bezug auf die Benutzerfreundlichkeit und Barrierefreiheit mit sich.

Ein Adaptives User Interface passt sich den Fähigkeiten, Bedürfnissen und Präferenzen seiner Nutzer und ihrer Nutzungsumgebung an. Jedem Nutzer kann in jedem Kontext eine individuelle, passende Lösung angeboten werden. Probleme bei der Bedienung gehören dann der Vergangenheit an.

Das perfekte Beispiel

Der Fahrkartenautomat der Deutschen Bahn hat sehr viele unterschiedlichen Nutzergruppen. Im Grunde muss er für absolut jeden funktionieren und somit auch den unterschiedlichsten Anforderungen gerecht werden. Es hat sich uns angeboten diesen als Beispiel für unser Projekt auszuwählen – zum einen haben wir ein Paradebeispiel für unser Projektthema, zum anderen ist es eine Herausforderung das System für die unterschiedlichsten Nutzer zu optimieren.

Rechtfertigung und Alternativlösungen

Die Zahl der Reisenden, die ihr Ticket über den Fahrkartenautomaten beziehen, geht immer weiter zurück – stattdessen werden andere Serviceangebote der Deutschen Bahn verwendet. Jetzt könnte man sagen, dass die Ausarbeiteung des Themas obsolet ist.

Betrachtet man nun die Ursache des Rückgangs, dann ist die enorm schlechte Bedienbarkeit des Automaten ein entscheidender Faktor. Durch die Verbessung der Bedienbarkeit könnte sich dieses Phänomen umkehren lassen.

Die Servicewelt der Deutschen Bahn haben wir nur am Rande mit in unser Projekt einbezogen. Diese würde zwar viele andere Lösungsmöglichkeiten mit sich bringen, doch der Fokus unseres Projektes sollte auf der Erarbeitung unseres übergeordneten Themas liegen – dem Adaptiven User Interface.

Projektumfang

Wir haben uns bei der Ausarbeitung des Konzepts auf den Kauf eines Standard-Tickets beschränkt.

Für unsere unterschiedlichen Nutzer haben wir nun mehrere Navigationswege geschaffen. Diese ermöglichen es, über verschiedene Wege, an immer ein und dasselbe Ziel zu gelangen – den Kauf eines Standard-Tickets.

Dennoch konnten wir den Automaten nicht für absolut jeden zugänglich machen, dies hätte einen zu großen Aufwand mit sich gebracht. Deshalb haben wir unsere Nutzergruppen im Rahmen des Projektes auf die nachfolgenden Personenkreise beschränkt:

  • Menschen mit motorischen Beeinträchtigungen
  • Power User
  • Kinder
  • Senioren
  • Uneingeschränkte Menschen

Mit diesen Einschränkungen hatten wir sowohl einen überschaubaren Funktionsumfang des Automaten, als auch einen großen Anteil unserer verschiedenen Nutzergruppen berücksichtigt. Nun hatten wir eine klare Zielsetzung für die Erarbeitung unseres AUI.

Der richtige Navigationsweg

Auf dem Wilkommenscreen unseres Fahrkartenautomaten wählen wir den Kauf eines Standard-Tickets aus. Im nächsten Schritt können wir nun aussuchen, welchen Navigationsweg wir nehmen möchten. Diese Wege sind auf unsere ausgewählten Nutzergruppen zugeschnitten:

  • Menschen mit motorischen Beeinträchtigungen
  • Power User
  • Kinder
  • Senioren
  • Uneingeschränkte Menschen

Über eine Empfehlung bekommen wir vom Automaten einen passenden Navigationsweg vorgeschlagen.

Eine Künstliche Intelligenz erkennt den Nutzer, sobald er vor den Automaten tritt. Sie schätzt dessen Alter und kann ihm daraufhin ein passendes UI empfehlen. Da wir den Nutzer nur anhand des Alters einschätzen, ist es gut möglich, dass die Einschätzung daneben liegt. Wir wollen den Nutzer nicht bevormunden und sprechen deshalb lediglich eine Empfehlung aus – der Nutzer hat weiterhin die Wahl welche Navigation er auswählen möchte. So wollen wir vor allem den unsicheren Nutzern helfen, erfahrene Nutzer können sich einfach über die Empfehlung des Automaten hinwegsetzen.

Um unsere Idee validieren zu können, haben wie den Vorgang der Einschätzung prototypisch getestet. Hierzu verwendeten wir die JavaScript API face-api.js.

Probelme des Fahrkartenautomaten

Bei unserer Recherche haben wir uns sehr stark mit der Nutzergruppe der Senioren und Kinder auseinandergesetzt. Durch Interviews und diverse Nutzertests konnten wir einige Probleme ausfindig machen, mit denen alle Nutzergruppen zu kämpfen haben.

Der Aufbau und die Navigation durch das System sind nicht sofort ersichtlich. Die Hierarchie und Zugehörigkeit der Elemente ist unklar. Die Farbigkeit einiger Elemente ist ambivalent – ein roter Button führt den Nutzer weiter zum nächsten Screen. Aber vor allem auch die enorme Informationsflut stellte sich als großes Defizit heraus.

Überarbeitung der Form und Benutzeroberfläche

Bevor wir überhaupt mit der Gestaltung unseres AUI anfangen konnten, mussten wir also ein generelles Redesign machen. Dieses haben wir bewusst losgelöst von der CI der DB gemacht, so hatten wir mehr Freiheiten und der Fokus unseres Projektes wird nicht auf die Deutsche Bahn gelenkt.

Durch eine Überarbeitung des Erscheinungsbildes und der Abläufe, sowie dem Hinzufügen von Sounds und Animationen, ist das gesamte System nun insgesamt aufgeräumter und besser verständlich.

Wir haben bewusst hochkant als Bildschirmformat ausgewählt.
Der Screen wurde in drei grundlegende Bereiche unterteilt. Im oberen Bereich befindet sich ein virtuelles Ticket, dieses gibt dem Nutzer die Möglichkeit seine Eingaben jederzeit überprüfen und durch das System navigieren zu können. In der Mitte wird die aktuelle Aufgabe angezeigt, unten befindet sich der Bereich zur Navigation.

Die individuellen Bedürfnisse der Senioren

Gerade für die Senioren genügt es aber nicht die Erkennung von Klickbarem und das Verständnis von Icons zu optimieren. Diese haben immer noch Probleme mit der Orientierung im System und sind der Informationsflut nicht gewachsen. Das mentale Modell des Automaten ist zu komplex oder gewisse Konventionen sind ihnen oftmals fremd.

Eine eigene Lösung für diese Zielgruppe ist deshalb so wichtig, da diese aus Stress, Überforderung, Frust oder gar Angst den Automaten komplett meiden. Sie wollen nicht hilflos und überfordert wirken oder haben Angst vor dem Schwarzfahren, sollten sie es nicht schaffen selbstständig ein Ticket zu lösen.

Für Senioren haben wir einen Modus entwickelt, der deren individuelle Bedürfnisse berücksichtigt.

Zwar haben wir nun mehrere Navigationswege, welche die unterschiedlichen Bedürfnisse der Nutzer adressieren. Allerdings können wir nicht davon ausgehen, dass immer aktiv der richtige Modus ausgewählt wird. Wie schaffen wir es nun, dass jeder Nutzer – auch abgesehen vom Alter – den richtigen Modus erhält?

Änderung der Navigationswege

Wir haben unsere unterschiedlichen Navigationswege unter dem Button Bedienhilfe zusammengefasst – dieser ermöglicht ein Wechsel auch während des Prozess. Diese Option ist allerdings neu, kaum ein Nutzer wird diesen Button benutzen.

Selbstständig Probleme erkennen

Uns war es wichtig, dass der Automat auch selbstständig Probleme bei der Bedienung erkennen und aktiv in die Benutzung einschreiten kann. Es gibt mehrere Indizien für Probleme bei der Benutzung:

Das Interaktionsverhalten – Der Nutzer befindet sich auf einem Screen, es findet aber keine Interaktion statt, oder Interaktionen wiederholen sich, ohne dass ein Fortschritt erzielt wird.

Eye-Tracking – Die Augenbewegungen des Nutzers werden analysiert. In Kombination mit dem Interaktionsverhalten können so Probleme identifiziert und angegangen werden.

Emotionserkennung – Emotionen des Nutzers können erkannt und interpretiert werden.

Wenn das System ein Problem erkennt schreitet es ein. Es wird fragen, ob ich ein Problem bei der Bedienung habe. Feedback erhält der Nutzer im UI. Besteht wirklich ein Problem kann der Nutzer die Hilfe des Automaten wahrnehmen und einen passenderen Navigationsweg wählen.

Auch hier konnten wir unsere Idee prototypisch testen. Die Analyse des Interaktionsverhaltens haben wir allerdings sehr stark vereinfacht – es wir nur betrachtet, wie viel Zeit zwischen Interaktionen vergeht. Die Augenbewegungen haben wir durch die Bewegung mit der Maus imitiert. Mit der JavaScript API face-api.js konnten wir die Emotionserkennung veranschaulichen.

Das nachfolgende Video ist eine Aufzeichung unseres Prototypen. Ausschalggebend für das Problem ist hier das Interaktionsverhalten in Kombination mit den Augenbewegungen.

Navigationspfad ändern

Haben wir nun tatsächlich ein Problem bei der Bedienung, dann können wir einfach einen anderen Navigationsweg auswählen. Der Prozess wird an genau dieser Stelle fortgesetzt.

Vereinfachte Navigation

In diesem Modus verwenden wir ein Conversational UI zur Eingabe der Reiseinformationen. Durch diese Neugestaltung der Eingaben werden die Informationen pro Schritt deutlich reduziert. So oft es uns möglich war, haben wir die Konversation als Ja-Nein-Fragen formuliert. Wir leiten den Nutzer nun Schritt für Schritt, bis hin zu Kauf seines Tickets. Feedforeward hilft ihm diesen Ablauf besser verstehen zu können.

Durch die vereinfachen der einzelnen Schritte dauert der Prozess insgesamt natürlich deutlich länger – die Zielgruppe kommt nun allerdings an ihr Ziel.

Schnell

Für geübte Nutzer kann der Ticketkauf nicht schnell genug ablaufen. Für diese Gruppe haben wir die Schritte reduziert.

Wir haben uns Konventionen vom Smartphone zum Nutzem gemacht, um alle relevanten Eingaben auf nur einer Seite tätigen zu können. Der Nutzer hat nun die Möglichkeit sich auf einem Onepager durch ein Formular zu scrollen – alle Eingaben können hier getätigt werden. Ist das Formular vollständig ausgefüllt kann er sich nun passende Verbindungen anzeigen lassen und anschließend das Ticket kaufen.

Transaktion

Den abschließenden Prozess – den Auswahl einer passenden Verbindung, die Sitzplatzwahl und den Kaufprozess – haben wir stark überarbeitet. Wir haben die Elemente neu georndet und aufgeteilt, die Darstellung vereinfacht und die Komplexität reduziert.

Die Bahncard zu Identifikation

Die Bahncard dient im Moment lediglich als Rabattgutschein. Wie wäre es, wenn wir diese mit einem persönlichen Profil verbinden würden?

Persönlicher Bereich

Für Kinder würde ein persönlicher Bereich enormes Potenzial bieten, da wir diesen die Verantwortung beim Ticketkauf nehmen können. Die Eltern haben die Möglichkeit Ziele einzuspeichern. Kinder können dann nur die Tickets zu exakt diesen Zielen kaufen – es kann eine Zahlungsart hinterlegt werden, sodass ein Kind nicht mehr mit viel Geld aus dem Haus gehen muss.

Der persönliche Bereich eines Erwachsenen bietet natürlich viel mehr Optionen. Der Navigationspfad kann ausgewählt werden, es können Voreinstellungen gespeichert werden, letzte Ziele können eingesehen werden. Der Ticketkauf steht weiterhin vollständig zur Verfügung.

Die aufgezeigten Navigationswege haben bisher überwiegend die unterschiedlichen technischen Kompetenzen der Nutzer in den Blick genommen. Doch nicht nur darin unterscheiden sich unsere Nutzergruppen, sondern auch in ihren körperlichen Konstitutionen – und damit öffnen wir das große Themenfeld der Barrierefreiheit.

Ticketkauf wie am Schalter

Die Sprache ist eine der unmittelbarsten Eingabemethoden für technische Geräte. Sprachsteuerung ist eine Lösung für die Bedienung unseres Automaten - gerade für körperlich eingeschränkte Personen oder Senioren, welche den Schalter dem Automaten bevorzugen.

Der Nutzer wählt die Sprachsteuerung aus und kann sagen, was er möchte – im Fall unseres Prototypen, eine Fahrt vom Ort des Automaten zu einem beliebigen Ziel. Fehlende Angaben werden vom Automaten abgefragt. Am Ende werden alle Informationen vom Nutzer bestätigt und er kann sich passende Verbindungen anzeigen lassen.

Ein paar abschließende Worte zum Projekt

Intelligente Assistenten wie Alexa lassen sich nur mit Sprache steuern. Das 2019 neu erschienene macOS-Update Catalina ermöglicht die Steuerung eines ganzen Betriebssystems per Sprache. Wir sehen ein enormes Potenzial in der Sprachsteuerung und sind optimistisch, dass diese in den kommenden Jahren in sämtlichen Bereichen immer häufiger zum Einsatz kommen wird.

Die Umsetzung eines vollständig adaptiven Systems bringt einen enormen Mehraufwand mit sich. Sowohl die Gestaltung der Oberfläche, die technische Umsetzung, also auch die benötigten Technologien kosten viel Geld.

Man muss natürlich abwägen, ob sich der Aufwand lohnt bzw. an welcher Stelle sich der Mehraufwand auszahlen würde. Aber das Potenzial von einem Adaptiven User Interface ist enorm. Wir sind gespannt wie sich dieses Themenfeld in den nächsten Jahren weiterentwickelt.

Präsentation unseres Themas

PHOENIX DESIGN, eine renomierte Designagentur als Stuttgart, hat uns zu ihrem Lunchtalk eingeladen, um unser Projekt vorzustellen. Hier gehts zum Artikel!