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

Flaneur App - Die Flanierangel fürs iPhone

Flaneur App - Die Flanierangel fürs iPhone

Ein spielerischer Ansatz zur Exploration unbekannter Straßen

.

Prototyp

präsi.008.jpgpräsi.008.jpg
präsi.007.jpgpräsi.007.jpg
präsi.005.jpgpräsi.005.jpg
präsi.006.jpgpräsi.006.jpg
präsi.004.jpgpräsi.004.jpg
präsi.009.jpgpräsi.009.jpg
präsi.010.jpgpräsi.010.jpg

Idee

Die Digitalisierung von Kartenmaterial hat die Art und Weise, wie wir mit unserer Umwelt interagieren und diese wahrnehmen grundlegend verändert. Mit detaillierten, mehrebenigen Kartenmaterial laufen wir, starend auf unsere Smartphones, zielgerichtet zum nächsten Ort. Werden wir die Fähigkeit verlieren ziellos zu schlendern, uns zu verlieren oder uns sogar von der uns umgebenden Welt immer mehr entkoppeln? Die Flaneur App ist ein Gegenentwurf zu dem Trend der Verkomplizierung im digitalen Kartenbereich und soll verhindern, dass Baudelaire's flâneur in Vergessenheit gerät.

Konzept

Die Flaneur App ist ein Service zur Exploration des urbanen Umfelds. Durch die automatische Standort-Positionierung und Ausrichtung der Karte in Blickrichtung erhält man einen groben Orientierung und Abbildung der Umgebung. Ganz einfach und unkompliziert erhält man einen örtlichen Vorschlag, um in diese Richtung zu flanieren: man wählt 1 Kategorie (Essen, Trinken, Kultur oder Nachtleben) aus, wirft durch 1 Geste in 1 Richtung, erhält 1 Ergebnis und 1 Detailansicht. Falls die vorgeschlagenen Örtlichkeit nicht gefällt, erhält man durch das erneutes Werfen ein weiteres, anderes Ergebnis.

Umsetzung: Technik

Die Flaneur App sollte möglichst von jedem und überall verwendet werden können. Der Prototyp wurde komplett in HTML5 umgesetzt: HTML, Javascript, CSS und mit der Hilfe von der Kartenbibliothek polymaps.org.

Wir entschieden uns absichtlich für die “JEP” Just Enough Prototyping Technik um unser Konzept so schnell wie möglich auf Machbarkeit und Usability zu testen. Dadurch konnten wir bereits nach den ersten 2 Wochen nach Beginn des Kurses einen ersten Testlauf mit Probanden durchführen und das Konzept sowie die Umsetzung im Kurs diskutieren. Die Ergebnisse flossen dann iterativ in den Prototypen ein. Die Umsetzung erfolgte also parallel zur Designphase, welche durch die Flexibilität der Webtechnik ermöglicht wurde.

Bevor wir allerdings mit der Umsetzung loslegen konnten, war eine umfassende Recherche der verfügbaren Web Karten Bibliotheken von nöten. Wir testeten Google Maps, Modest Maps, Leaflet und Polymaps auf ihre Performance und Funktionalität. Letztendlich entwichelten wir unsere App auf Grundlage von Google Maps und Polymaps gleichzeitig, weil die benötigte Rotationsfunktion nicht trivial umzuseten war.

Api

Um die Ergebnisse anzuzeigen brauchten wir eine möglichste umfangreiche Datenbank, die vor allem für den Raum Berlin zufriedenstellende Ergebnisse liefern konnte. Nach der genaueren Überprufung von Apis, wie ueberblic, yelp, nokia maps, google places oder youspots, entschieden wir uns für qype, da sie sehr gute Ergebnisse liefert und eine überschaubare Api vorhanden ist.

Die Auswahl der Ergebnisse ist auch ortsabhängig: in der Kategorie Drinken beispielsweise werden morgens eher Cafés angezeigt, abens eher Cocktailbars und Kneipen.

Umsetzung: Design

Bevor wir den endgültigen visuellen Stil der Applikation gefunden haben, probierten wir zahlreiche versichende visuelle Richtungen aus. Der erste, instinktive Ansatz war der des “Skeuomorphism” – also eine fotorealistische Abbildung der Angel-Metapher. Letztendlich war es uns aber nicht möglich diesen Stil kontinuierlich im gesamten Workflow abzubilden und so haben wir weiter mit unterschiedlichen Designrichtungen experimentiert.

Die Schwierigkeit die Angel-Metapher ohne visuelle Brüche zu übersetzten hat uns zeitweise sogar zum Umschwung auf einen Dart-Pfeil anstelle der Angel gebracht. Nicht zuletzt durch konstruktives Feedback der Testnutzer haben wir jedoch eine stimmige und schlüssige visuelle Gestalt für die Angel-Metapher entwickelt.

Comic.pngComic.png
Skeuomorph_0.pngSkeuomorph_0.png
Skeuomorph_1.pngSkeuomorph_1.png
Dart.jpgDart.jpg
Screen Shot 2012-08-23 at 13.32.40.pngScreen Shot 2012-08-23 at 13.32.40.png

Ausblick

Die Flaneur App soll in naher Zukunft als webapp veröffentlicht werden. Der voll funktionsfähige Prototyp dient hierfür als Grundlage. Desweiteren soll die Flaneur App als native Applikation im App Store erscheinen. Der genaue Zeitrahmen hierfür steht jedoch noch nicht fest. Die momentane studienbedingte örtliche Distanz der Entwickler gestaltet den Prozess jedoch langwieriger als erwartet. Wir hoffen nichtsdestotrotz bald Neuigkeiten verkünden zu können.

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Dr. Till Nagel

Entstehungszeitraum

Sommersemester 2012