Datenvisualisierung: Auseinandersetzung mit Form, Farbe und Ordnungsprinzipien, um Zusammenhänge in größeren Datenmengen sichtbar zu machen. Das Ergebnis ist ein programmierter, interaktiver Prototyp.
Die Daten werden ohne Zuhilfenahme von bildhaften Elementen (Piktogramme, Fotografien, …) interaktiv dargestellt. Alphanumerische Zeichen (Text, Zahlen) sollen so sparsam wie möglich verwendet werden. Umso wichtiger wird es, gezielt Farbe, Form und Position einzusetzen, um
Mengen sichtbar zu machen,
Kategorien zu kodieren,
Gruppen zu bilden,
Zeitabläufe nachverfolgbar zu machen,
…
Die Darstellung von Daten zwingt schon an sich zu einer parametrischen Denkweise. D.h. die grafischen Elemente müssen flexibel gedacht werden, so dass sie unterschiedliche Zahlenwerte und Bedeutungen annehmen können. Das Denken in Varianten ist also essenziell. Zudem erlauben unterschiedliche Gesamtdarstellungen neue Einblicke in die Zusammenhänge innerhalb der Daten. Durch Interaktion können weitere Zusammenhänge vom Nutzer entdeckt werden.
Zwischen 2009 und 2018 gab es in Deutschland 5 Schoolshootings (Amokläufe). In der gleichen Zeit gab es in Amerika 180 Schoolshootings! Diese schockierenden Zahlen möchte ich in meinem Projekt visuell darstellen.
Umsetzung
Um dem User den Kontext von Amerika klar zu machen, habe ich mich für den ersten Screen für eine Kartenansicht entschieden. Hier sieht man die Standorte der Shootings und kann Ballungen und Auffälligkeiten beobachten. Zusätzlich zeigt die Größe der Kreise die Zahl an Opfer an, der transparente Teil zeigt den Anteil der Verletzen und der Deckende den Anteil der Toten.
Um die Entwicklung über die Jahre besser darzustellen, habe ich diese in Balken aufgeteilt und parallel auf einem Screen angezeigt.
Interaktionen
Um auch in der Kartenansicht durch die Jahre iterieren zu können, habe ich hier eine interaktive Timeline eingebaut. Zusätzlich ist es möglich über die Punkte (Shootings) zu hovern um mehr Informationen zu diesen zu bekommen. Hier stehen die exakten zahlen zu Opfern aufgeteilt in verletzt und getötet.
Die Navigation ist ebenfalls interaktiv. Wenn über den nicht ausgewählten Untertitel gehovert wird, wird dieser weiß um seine Interaktionsmöglichkeit zu zeigen. Um ihn anzuwählen, muss er geklickt werden und bleibt dann weiß um seinen aktiven Zustand anzuzeigen.
Animation
Die Punkte in der Kartenansicht werden in die Balkenansicht animiert.
Außerdem ist der Austausch der interaktiven zur statischen(ganz weißen) Timeline animiert, um diesen Wechsel klar zu machen.
Hinterlasse einen Kommentar