schoolshootings

Aufgabe

Die Herausforderung in dem Projekt war es die Zusammenhänge in Datenmengen sichtbar zu machen und ein interaktives System zu entwickeln, dabei soll das System allein durch Form, Farben und Animationen und ohne alphanumerische Zeichen, Infos vermitteln.

Grundidee

Mein Projekt greift auf die Daten der schoolshootings in der USA. Die Grundidee ist durch zwei Ebenen, verschiedene Infos zu vermitteln. Dabei beantwortet die Datengrafik 4 verschiedene Fragen:

1. Welche Region ist besonders von Amokläufen mit großem Ausmaß betroffen?
2. Wie ist dabei die Verteilung an den betroffenen Schulen?
3. Wie haben sich die Fälle in den letzten 20 Jahren verändert?
4. Wie verteilen sich die Amokläufe über Monate hinweg?

Screens

Auf dem ersten Screen sieht man eine Übersicht wo die Amokläufe stattfanden und wie groß der Ausmaß dabei war. Der äußere, rote Ring zeigt dabei den Ausmaß an verstorbenen Opfern und der innere blaue Ring der verletzten Opfer an. Durch das Hovern über die einzelnen Elemente, erhält man mehr Infos zu den Ereignissen.

Den zweiten Screen erreicht man durch das Toggeln der Überschrift. Man gelangt zur Verteilung der Ethnicity, die durch jeweils 4 Viertelkreisen dargestellt wird. Die 4 häufigsten Ethnien sind dabei white, black, hispanic und asian. Es wird deutlich wie die Verteilung an den Schulen war, das Volumen der Viertelkreise weist auf die prozentuale Verteilung an der jeweiligen Schule.

Wird nun mit dem Trackpad hochgewischt, erreicht man die zweite Ebene, die Zeit. Hier wird deutlich wann die shootings, über das Jahr verteilt, stattfanden. Visualisiert werden die Shootings durch Linien, welche im Kreis angeordnet sind. Dabei zählt das Jahr 1999, die erste Linie auf Null. Im Uhrzeigersinn werden dann alle shootings bis 2019 aufgereiht. Durch Lücken erkennt man eine unregelmäßigkeit bei den shootings.

Nun lässt sich auch diese Ebene, durch das Klicken auf die Überschirft toggeln. So kann man tiefer in die Zeit tauchen und erhält eine Übersicht der Monate. Diese Ansicht ist ähnlich aufgebaut wie die Jahre, die Linien starten auf Null im Monat Januar und reihen sich im Uhrzeigersinn bis Dezember auf.

Umsetzung

Die Umsetzung erfolgte mit der Programmiersprache Javascript. Außerdem standen uns mehrere libaries zur Verfügung, beispielsweise arbeiteten wir mit jQuery, snap und gmynd libaries unserer Professoren.Grund