Pfandflaschenautomat - Interaction Map

Als Aufgabe galt es, eine Interaction Map zu erstellen. Das ausgewählte Thema war der Prozess einer Pfandflaschenrückgabe. Dazu haben wir zunächst eine Testperson gebeten, eine Pfandflasche zurückzugeben. Diesen Prozess haben wir im Detail analysiert. Das Ergebnis dieser Analyse haben wir dann in eine interaktive iPad-App umgesetzt. In dieser App kann man zwischen verschiedenen Menüs navigieren und Ebenen filtern.

Erkenntnis Button

Wichtig war es für uns, die Erkenntnisse aus unserer Analyse miteinzubauen, ohne Ästhetik und Überschaubarkeit zu verlieren. Dazu haben wir einigen Feldern Info-Buttons hinzugefügt. Klickt man auf einen Button, erscheint ein Pop-up mit der jeweiligen Erkenntnis.

Erkenntnis Pop-up

Das Erkenntnis Pop-up besteht aus einer Skizze und einer kurzen Erklärung. Die Pop-ups können vom User geöffnet und wieder geschlossen werden. Des Weiteren gibt es auf der Ebene „Display“ einen klickbaren Prototypen, der die Anzeige des Pfandautomaten simuliert.

Lo-Fi

Auf einem Whiteboard haben wir die verschiedenen Ebenen der Interaction Map festgehalten. Für die verschiedenen Ebenen haben wir unterschiedliche Post-It Farben benutzt. Die in der Feeling-Ebene mit den Farben pink und grün deutlich zu erkennen ist. Zu diesem Zeitpunkt hatte unsere Map vier Ebenen: Die Doing-, die Thinking-, die Feeling- und die Zeitebene. In der Thinking-Ebene haben wir alle möglichen Gedanken des Nutzers notiert, darunter auch fragen die man sich unterbewusst selbst stellt, wie z. B. „Wie weit lege ich jetzt die Flasche rein?“. In der Feeling-Ebene haben wir die positiven und negativen Gedanken notiert, die der Nutzer hat. Im Rewe haben wir eine Videoaufnahme vom Prozess der Pfandrückgabe gemacht, damit konnten wir die Zeiten für jeden Schritt messen und festhalten.

Mid-Fi

Im nächsten Schritt haben wir alle Post-Its auf ein Miro-Board übertragen. Außerdem haben wir die Ebenen in Kategorien und Subkategorien eingeteilt. Es entstand zum Beispiel eine technische Ebene mit mehreren Unterebenen.
Die Maschine ist ein wichtiger Faktor beim Einlegen. Um diese zu verstehen haben wir sie in die Ebenen Logik, Display und Band aufgeteilt. Die Logik-Ebene der Maschine beschreibt, was die Maschine in jedem Schritt macht. In der Display-Ebene haben wir grafisch gearbeitet und für jeden Bildschirmzustand eine jeweilige Bilderschirmaufnahme hinzugefügt. Hier war auch deutlich zuerkennen, wann welcher Sensor einsetzt und wie sich dann Band in den einzelnen Zuständen verhält.

Hi-Fi / Finales Projekt

Startseite

In der finalen Version haben wir das Design der Startseite modern und schlicht gehalten. Statische Felder wie die Icon-Felder, die Schaubilder in der Ebene für den Kontext und auch die globalen Ebenen haben wir rechteckig gehalten. Die dynamischen Ebnen, welche gefiltert werden können, sind in abgerundeter Form.

Person und Kontext

Die Ebene für die Testperson und den Kontext ist nun scrollbar. Das Schaubild vom Rewe konnte dadurch vergrößert werden. Auch die Informationen haben mehr Freiraum bekommen und können leichter erfasst werden. Die Erkenntnisse zur Positionierung des Automaten haben wir in der App weggelassen, da sie nicht aktiv mit der Pfandrückgabe verknüpft sind. Das Schaubild vom Rewe wurde vergrößert, um die Position vom Pfandautomaten und den Rewe besser zu erkennen.

Interaction Map

Die Interaction Map hat sechs Ebenen. Neben den verschiedenen Ebenen der Testperson, gibt es noch eine technische Ebene für den Display. Diese Ebene enthält einen klickbaren Prototypen des Automaten, die dem Benutzter ermöglicht die Zustände selbst zu erleben. Wichtig waren uns, die Erkenntnisse aus unserer Analyse einzubauen, ohne die Ästhetik und Überschaubarkeit zu verlieren. Dazu haben wir den Feldern aus der Interaction Map Info-Buttons hinzugefügt. Klickt man auf einen Button, erscheint ein Pop-up mit der jeweiligen Erkenntnis. Das Erkenntnis Pop-up besteht aus einer Skizze und einer kurzen Erklärung. Die Pop-Ups können jederzeit vom User geöffnet und wieder geschlossen werden. Die Ebenen können in der Sidebar gefiltert werden. Dazu muss man auf das Filter-Icon oben rechts klicken und die jeweilige Ebene entfernen oder hinzufügen.