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

EVERYONE LOVES BERLIN

… versucht Orte Berlins durch die Augen von Touristen unterschiedlicher Nationen sichtbar zu machen. Datengrundlage bildet dabei die Plattform Instagram. Die Bilddaten wurden über einen begrenzten Zeitraum gesammelt und repräsentieren einen definierten Bereich Berlins. Die interaktive Karte visualisiert, an welchen Stellen sich Touristen in der Stadt aufhalten und welche Orte sie fotografisch festhalten. Orte, die eine große Anzahl von Instagrambildern aufweisen, treten in der Visualisierung heller hervor. Ergänzend zu der interaktiven Umsetzung beinhaltet die analoge Posterserie eine weitere Möglichkeit, besuchte Orte verschiedener Nationen zu vergleichen und Details zu entdecken.

AUSGANGSPUNKT.jpgAUSGANGSPUNKT.jpg

Foto.JPGFoto.JPG

Unser erster Ansatz zum Thema Sightseeing & Touristen in Berlin entstand während eines allgemeinen Brainstormings, wo es um den ersten Umgang mit Datensätzen und die Verknüpfung verschiedener Parameter ging.

Diesen Ansatz haben wir über das restliche Semester weiter ausgebaut und uns zentrale Fragen gestellt, die uns in diesem Zusammenhang wichtig waren:

- Was schauen sich Touristen in Berlin an? - Wie unterschiedlich wird Berlin gesehen und wo entstehen (evtl. länderspezifische) Hotspots?

Ziel.jpgZiel.jpg

Das Ziel also war es, Touristen in Berlin sichtbar zu machen. Doch wie gelangt man an Daten? Touristenbusse oder Touren durch Berlin manuell erfassen? Das gestaltet sich als sehr aufwändig. Die Abdeckung der Stadt Berlin ist gering, es gibt keinen Einblick über den Tag hinaus und die Touren gleichen sich sehr stark.

Uns interessierte vor allem: Kann man außer den bekannten Touristenattraktionen andere interessante, „unsichtbare“ Orte ablesen, die von Touristen besucht werden?

DATEN Kopie.jpgDATEN Kopie.jpg

instagram.jpginstagram.jpg

Die Lösung fanden wir bei Instagram: hier fotografieren angemeldete Nutzer häufig, über den Tag verteilt, Bilder und zeigen bzw. posten mit den Fotos ihren Aufenthaltsort. Zudem dokumentieren überraschend viele Nutzer minutiös auf diese Art und Weise ihren Alltag, wodurch man ein sehr gutes Bild bekommt, an welchen Orten und zu welcher Zeit sie sich in Berlin aufgehalten haben.

Bildschirmfoto 2014-07-08 um 19.31.04.pngBildschirmfoto 2014-07-08 um 19.31.04.png

Bildschirmfoto 2014-06-01 um 10.47.08.pngBildschirmfoto 2014-06-01 um 10.47.08.png

Um an die Bilder und deren Aufnahmeorte zu kommen, nutzten wir die Instagram-API. Diese ermöglicht es gezielt nach Bildern, die in einem bestimmten Bereich aufgenommen wurden, zu suchen. Da sich die maximale Größe des Suchbereichs als zu klein herausgestellt hat, nutzten wir am Ende sechs dieser Bereiche, um den größten Teil von Berlin abzudecken.

Zusätzlich zum eingeschränkten Suchbereich gibt es weitere Einschränkung der API, welche die Datenerhebung erheblich verlangsamt haben. So erhält man in den Suchbereichen nur Bilder, welche in den letzten 7 Tagen aufgenommen wurden, weswegen sich die Erhebung in Berlin auf knapp 5 Wochen erstreckt hat. Eine weitere Einschränkung waren die maximalen Anfragen an Instagram, welche das Erfassen von maximal 72.000 Bildern pro Stunde erlaubt.

Der Datensatz, den man für jedes öffentliche Bild auf Instagram erhält, beinhaltet unter anderem den Aufnahmezeitpunkt, den Ort sowie den Fotografen. Um eine Visualisierung der Touristen in Berlin erstellen zu können, mussten wir nun noch an Hand der Instagram-Accounts auf die Herkunft der Person hinter dem Account schließen. Anders als bei Twitter oder anderen Plattformen lässt sich das im Profil eines Users nicht angeben und somit auch nicht auswerten. Um dennoch eine Aussage über die Herkunft des Accounts treffen zu können, analysierten wir u.a. sämtliche Bilder, welche der Nutzer in der Vergangenheit auf Instagram gepostet hat.

Um sämtlichen Nutzern, welche in unserem Zeitraum von 30 Tagen in Berlin Fotos machten, ein Land zuordnen zu können, haben wir letztlich etwa 14 Mio. Fotos analysieren müssen. Durch die Limitierung der Anfragen pro Stunde an Instagram hat dies recht lange gedauert.

Insgesamt haben wir für den Zeitraum von einem Monat, 3 Tagen, 8 Stunden, 16 Minuten und 24 Sekunden, 109996 Fotos von 23582 Touristen erfasst, welche die Datengrundlage für die digitale und die analoge Version darstellt und aus denen wir wiederum die Top 10 Besucher-Nationen filtern konnten.

DATEN.jpgDATEN.jpg

Die Zusammenarbeit im großen Team ermöglichte uns ein breites Repertoire an Fähigkeiten, die jeder Einzelne bereit war mit einfließen zu lassen. Diese Vorteile wollten wir nutzen, um neben der digitalen Visualisierung auch eine analoge Darstellung zu finden. Hierbei war es unser Anliegen, die Stärken des jeweiligen Mediums perfekt auszunutzen.

Karteneinbindung

Bildschirmfoto 2014-07-08 um 17.48.25.pngBildschirmfoto 2014-07-08 um 17.48.25.png
Bildschirmfoto 2014-07-08 um 17.49.20.pngBildschirmfoto 2014-07-08 um 17.49.20.png

Als zentrales Thema und maßgebliches Element durfte die Kartenvisualisierung und - einbindung nicht fehlen. Dabei spielten verschiedene Überlegungen eine Rolle, die wir beachten mussten:

- Welchen Abstraktionsgrad darf die Karte haben? - Wie groß ist der Informationsgrad und wie „sichtbar“ darf bzw. muss die Karte sein? - Gibt es Referenzpunkte? In welcher Form liegen diese vor?

Die extrahierten Instagram-Daten wurden als erstes einfach in Form einer Heatmap auf eine Google-Karte gemappt, um den Datenumfang visuell einordnen zu können. Für die letztendliche Umsetzung haben wir uns TileMill bedient und die Karte nach vielen Tests auf wesentliche Elemente heruntergebrochen. Bekannte Plätze dienten uns als Referenz- bzw. Orientierungspunkte, die wir mittels Marker verorteten. Somit konnte eine bessere Vergleichbarkeit und desweiteren eine zusätzliche Informationsebene in der digitalen Version ermöglicht werden.

Gebäude ohne plätze.jpgGebäude ohne plätze.jpg

Dabei musste die Karte auf die Bedürfnisse der jeweiligen Darstellungsformen eingehen. So haben wir in der analogen Umsetzung die Grünflächen eingebettet, um weiße „Löcher“ in der Karte zu vermeiden, die die Deutung der Daten verfälschen könnten.

digital

Visualisierungsansätze

aus.pngaus.png

Präse_final.jpgPräse_final.jpg
entwurf_schwarz.pngentwurf_schwarz.png
entwurf_karte digital-01.pngentwurf_karte digital-01.png

Nach der ersten groben visuellen Verortung der Daten mithilfe einer Heatmap, entwickelten wir die Darstellungsform dieser Datenwolke weiter. Nach ersten Visualisierungen mit einer „unscharfen“ Heatmap, bei der die Übergänge fließend waren, transformierten wir diese in einzelne unterscheidbare Ebenen mit harten Kanten, um die Abgrenzung voneinander für den Betrachter deutlicher zu machen.

Mit der von uns erarbeiteten Karte, konnten wir nun die ersten Ansätze verfolgen, wie wir die Daten auf der Berlinkarte darstellen wollen. Wie unterscheiden wir die erhobenen Datensätze und können diese vergleichen? Wir experimentierten mit verschiedenen Hintergrundfarben, mit der Sichtbarmachung der Infrastruktur zur besseren Orientierung und suchten ein geeignetes Farbschema für die Heatmaps.

technisch

Für die Darstellung der Karte verwendeten wir Leaflet. Die Visualisierung wurde über eine angepasste Version von Leaflet.heat, einer Library für die Darstellung von Heatmaps für Leaflet, von uns realisiert.

Für den Vergleich zweier Nationen sah unser Konzept vor, dass es eine Überlagerung zweier Heatmaps geben sollte. Hierbei sollten sowohl Unterschiede, als auch Gemeinsamkeiten der Nationen erkennbar werden. Sicher hätten wir die Überlagerung durch eine mathematische Verrechnung beider Heatmaps erreichen können. Ebenen-Überlagerungs-Modi, wie man sie aus Photoshop kennt, machen nichts anderes. Jedoch kam uns zu Gute, dass während des Projekts Firefox, Chrome und Opera die Überblendung zweier Elemente mittels eines Überblendungsmodus' zu unterstützen begannen und so entschieden wir uns diese neue Möglichkeit gleich zu nutzen. Einzige Einschränkung: Aktuell (Juli 2014) muss man die Überblendungsmodi erst in den Untiefen der Browser manuell erlauben.

digital_screen_01.jpgdigital_screen_01.jpg
digital_screen_02.jpgdigital_screen_02.jpg
digital_screen_03.jpgdigital_screen_03.jpg

Bildschirmfoto 2014-08-02 um 12.23.08.pngBildschirmfoto 2014-08-02 um 12.23.08.png

Die Marker (als Vergleichspunkte für die Anhäufung von Daten an einem bestimmten Ort) bilden zusätzlich einen Bezug zu den gesammelten Instagramfotos, da diese durch Anwählen ein Pop-Up Fenster mit Fotos zeigen und evtl. als weiterführende Idee zu dem passenden Instagramprofil weiterleiten.

Die interaktive Version von „Everyone loves Berlin“ kann hier ausprobiert werden

analog

Visualisierungsansätze

Um das Thema weiträumiger und ergänzend visuell darzustellen, entschieden wir uns auch die Möglichkeiten der analogen Visualisierung auszuschöpfen. Zunächst beschäftigten uns Fragen wie: welche Vorteile bieten analoge Karten gegenüber digitalen? Wie gelingt es, den Vergleich der Nationen und deren Touristenbewegungen für den Betrachter verständlich aufzuschlüsseln? Welche Ausschnitte von Karten, Größenverhältnissen und Farbschemas kommen in Frage?

1.jpg1.jpg
2.jpg2.jpg
3.jpg3.jpg
4.jpg4.jpg
5.jpg5.jpg
karte_analog.jpgkarte_analog.jpg
Version1.jpgVersion1.jpg
Version3.jpgVersion3.jpg
20140617_Print_lang_Karte.jpg20140617_Print_lang_Karte.jpg

Nach mehreren Ausarbeitungsrunden verschiedenster Kartendarstellungen, gemeinsamen Besprechungen und Diskussionen, entschieden wir uns für zwei Visualisierungsformen:

Poster_A1_Version1.jpgPoster_A1_Version1.jpg

Poster_A1_Version2.jpgPoster_A1_Version2.jpg
Poster_A1_Version3.jpgPoster_A1_Version3.jpg

Zum einen die Darstellung jeweils einer Nation auf einem Plakat. Hier sollte die Betrachtung vor allem die Details in Bezug auf die Kartengestaltung sichtbar machen, also die zugrunde liegende Karte mit Gebäuden, Flüssen, Parks und gesetzten Markern. Außerdem lag die Schwierigkeit darin, die unterschiedlichen Ebenen der Häufigkeit von Fotos durch Touristen visuell voneinander abzugrenzen und sichtbar zu machen, d.h. die richtige Abstufung der Ebenen zu finden.

Poster_lang_schwarz.jpgPoster_lang_schwarz.jpg

Poster_lang_weiß.jpgPoster_lang_weiß.jpg
Plakat_schwarzlang2.jpgPlakat_schwarzlang2.jpg
Plakat_schwarzlang.jpgPlakat_schwarzlang.jpg
Plakat_weißlang5.jpgPlakat_weißlang5.jpg

Zum anderen entschieden wir uns, alle Nationen auf einem Plakat einander gegenüber zu stellen. Dabei gelingt es dem Betrachter besser den von unserer Datenanalyse erfassten Bereich im Umriss Berlins einzuordnen. Auch werden die Unterschiede der einzelnen Nationen im Vergleich untereinander und deren Verstreuungselementen angenehm ersichtlich.

FAZIT.jpgFAZIT.jpg

Bildschirmfoto 2014-06-04 um 17.49.43.pngBildschirmfoto 2014-06-04 um 17.49.43.png

Schwierigkeiten gab es in der Datenerhebung, was sich als sehr zeitaufwändig herausgestellt hat, aber soweit wir wissen, weltweit einzigartig ist.

Illustrator zeigt große Schwächen und Probleme in Sachen Kartengestaltung – auch die Erarbeitung in TileMill ist mit immens großem Zeitaufwand verbunden. Die Arbeit mit großen Datensätzen, ist in den letzten Jahren erst für den Otto-Normal-Laptop-Besitzer möglich geworden, aber trotzdem immer noch aufwändig.

Wir haben uns durchaus über weiterführende Explorationsmöglichkeiten, in Bezug auf die gesammelten Daten und Fotos, Gedanken gemacht. Mit den Möglichkeiten, die wir hatten und der Aufgabenstellung, die wir uns gegeben haben, können wir zufrieden sein.

Alles in allem ein spannender Kurs, in dem wir ein schönes Projekt entwickeln konnten. Das Feedback und auch die Auseinandersetzungen mit anderen Projekten waren hilfreich und interessant. Als relativ großes Team konnten wir unsere verschiedenen Stärken nutzen und sowohl eine Version für Print, als auch eine digitale Umsetzung entwickeln und uns im Hinblick darauf mit den jeweiligen Herausforderungen an das Medium auseinandersetzen.

heart95.pngheart95.png

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Prof. Dr. Sebastian Meier

Entstehungszeitraum

Sommersemester 2014