Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

Quarter

Ein intelligentes Erkundungstool für Orte

Problemstellung

Die Grundidee ist einfach: Ich suche einen Ort, der so bisschen ist, wie ein anderer Ort, den ich schon mag. Eine intelligente Suchmaschine für Orte quasi.

Die Idee dazu kam mir, als ich von Wien nach Berlin gezogen bin und auf der Suche nach einer Bar war, die einen ähnlichen Flair hat wie meine Lieblingsbar in Wien. Ich wollte mich aber nicht nur auf Bars, Clubs oder Cafés beschränken; ich wollte ein Tool, um alle möglichen Orte zu entdecken, also auch Stadtviertel, Straßen oder Parks.

Welche Straße in Amsterdam ähnelt der Hamburger Reeperbahn?

Was ist das Kreuzberg von Leipzig?

Oder das Berghain von Barcelona?

Klar ist, dass kein Ort gänzlich einem anderen gleicht. Und um direkte Vergleiche geht es auch nicht. Vielmehr geht es darum, Orte zueinander in Beziehung zu setzen; eine Visualisierung für die Netzwerke zu finden, die Orte auf den Straßen und in unseren Köpfen bilden, und diese Visualisierung interaktiv erkundbar zu machen.

Und weil es eben nicht darum geht, das EINE Berghain von Barcelona zu finden, sondern darum, sich einen Überblick über ähnliche Orte zu verschaffen, jene Orte zu finden, die – mal mehr und mal weniger – auf der „gleichen Wellenlänge“ sind, wollte ich keine klassische, hierarchische Listendarstellung, wie man sie in Apps wie beispielsweise Yelp findet, mit Volltreffer und Siegertreppchen, sondern eine spannendere Form der Visualisierung finden.

Wie die App auf keinen Fall aussehen sollte:

Prozess

Recht schnell war mir klar, dass ich keine Listen darstellen wollte. Und weil es um Orte geht, lag die Idee nahe, sich einer Art Kartendarstellung zu bedienen. Schließlich bin ich auf die EdgeMaps von Marian Dörk gestoßen, die er als „a new visualization technique that integrates the representation of explicit and implicit data relations“ beschreibt. So kann man beispielsweise Philosophen verschiedener Strömungen verorten und gegenseitige Einflüsse und Ähnlichkeiten visualisieren:
http://mariandoerk.de/edgemaps/demo/

Ausgehend von den EdgeMaps und mehreren Personas, die als hypothetische User entworfen wurden, habe ich schließlich versucht, ein Visualisierungssystem zu entwickeln, welches für meine Zwecke geeignet ist. Wichtig war mir hierbei, dass die Darstellung eines Netzwerkes ermöglicht wird und mehrere Variablen auf einen Blick dargestellt werden können.

Frühe Skizzen:

Früher Sketch-Mockup:

Nachdem ich unbeabsichtigt einen der Ortskreise transformiert habe, kam ich auf die Idee, eine weitere Variable hinzuzufügen: Dreidimensionalität beziehungsweise Höhe.

Finales Design

Es gibt grundsätzlich zwei Modi, zwischen denen man im Kontextmenü wählen kann: Den Ortsmodus und den Ähnlichkeitsmodus. Bei ersterem werden die Orte wie in einer stilisierten Landkarte angezeigt, also nach Himmelsrichtungen und Proximität. So kann man beispielsweise nach Orten suchen, die sich in der Nähe befinden. Im Ähnlichkeitsmodus (letztes Bild) werden die Ortskreise nach Ähnlichkeit sortiert; er eignet sich also, wenn einem die Entfernung der Orte egal ist.

Der kleine rote Kreis in der Mitte symbolisiert den Startpunkt der Suche, in diesem Fall also Kreuzberg. Tippt man auf ihn, erscheint ein kleiner schwarzer im roten Kreis; so kommt man immer wieder schnell zum Ausgangspunkt zurück.

Insgesamt ermöglicht diese Visualisierung also die Anzeige von vier Variablen:

  • Proximität (Nähe / Zugehörigkeit)
  • Größe der Ortskreise (Ähnlichkeit zum Ausgangsort)
  • Farbe der Ortskreise (Vom Nutzer frei belegbar, z.B. Preisniveau)
  • Höhe der Ortskreise (Vom Nutzer frei belegbar, z.B. Anteil der Grünflächen)
So kann man schnell und intuitiv die Ergebnisse durchforsten, ohne viel lesen zu müssen.

Tippt man auf einen Ort, verändert sich die aufklappbare Kontextkarte im unteren Bildschirmrand. Hier werden verschiedene Informationen und Fotos angezeigt. Über die drei Buttons kann man sich schnell die Route zum gewählten Ort anzeigen lassen, den Ort zu seiner Sammlung hinzufügen oder eine neue Suche von diesem Ort aus starten.

Orte können andere Orte beinhalten. Durch Zoomen kann man so beispielsweise in den Ortskreis „Wien, Neubau“ hineingelangen und sich Orte innerhalb dieses Stadtteils ansehen.

Der Name der App, Quarter, leitet sich von (Stadt-)Quartier ab.

Fazit / Ausblick

Die App ist recht schnell recht komplex geworden und befindet sich zu diesem Zeitpunkt keineswegs in einem finalen Stadium. Die Navigation und eigentlich das gesamte Konzept bedürften intesivem User-Testing. Aufgrund der Komplexität der Darstellung war es mir jedoch nicht möglich, mit gängigen Programmen wie Principle einen Prototypen herzustellen, der sich wirklich wie die App bedienen lassen würde, wie ich sie mir vorgestellt habe. Insgesamt bin ich aber sehr zufrieden mit meinem vielleicht etwas experimentellen Konzept; zumindest würde ich die App zumindest selbst gerne nutzen.

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im Grundstudium

Betreuung

Prof. Dr. Frank Heidmann

Zugehöriger Workspace

Human-Computer Interaction Design

Entstehungszeitraum

Sommersemester 2018

Noch keine Kommentare