Auseinandersetzung mit Form, Farbe und Ordnungsprinzipien, um Zusammenhänge in größeren Datenmengen sichtbar zu machen. Das Ergebnis ist ein programmierter, klickbarer Prototyp.
Thema: Datenvisualisierung
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.
Themenfindung & Datensatz
Als erstes galt es, einen interessanten Datensatz für die Visualisierung zu finden. Der Datensatz durfte nicht zu klein sein und musste genügend Parameter besitzen. Nach kurzem Suchen stieß ich auf der Plattform „Kaggle“ auf den Datensatz NBA Players 1996-2020. Da ich schon einige NBA-Spiele in meiner Freizeit geschaut habe und der Datensatz viele interessante Statistiken zu den einzelnen Spielern enthält, entschied ich mich dafür diesen zu benutzen um ein besseres Verständnis für den Sport zu bekommen und die teilweise überwältigend wirkenden Statistiken übersichtlich zu visualisieren.
Prozess
Als nächstes wurde der Datensatz sortiert und erste Skizzen wurden angefertigt. Um zu schauen wie das ganze in Farbe aussieht, übertrug ich meine Skizzen auf Figma. Danach fing ich an das Grundgerüst mithilfe von CSS, HTML, JavaScript und den Libraries jQuery und gmynd zu coden.
Konzept
Mein Ziel mit dieser Visualisierung war es zu untersuchen, ob die Rookie Saison ein guter Indikator sein kann wie erfolgreich die restliche Karriere des Spielers verlaufen wird und mit welchen Vorraussetzungen (Alter, Größe, Gewicht) ein Basketballspieler statistisch am erfolgreichsten performen. Mit dieser Überlegung entwickelten sich folgende Ansichten:
World Map
Auf dem ersten Screen ist eine World Map zu sehen. Die World Map soll dazu dienen, schnell herausfinden zu können woher die meisten Spieler in der NBA kommen und ist somit auch eine Übersicht der Spieler-Nationalitäten von 1996 bis 2020. Zusätzlich hab ich mich hier mit der Dauer der NBA Karriere beschäftigt. Die durchschnittliche NBA Karriere dauert 4 Seasons. Mit der Farbcodierung wollte ich Länder hervorheben die Spieler hervorgebracht haben die eine besonders lange NBA Karriere durchlaufen haben. Gleichzeitig kann man so Länder erkennen, dessen Spieler sich nicht gut in der NBA durchsetzen konnten und somit eine relativ kurze Karriere hatten.
Player Ansicht
In der Player Ansicht findet man alle Informationen zu jedem einzelnen Spieler der im Datensatz erfasst ist. Die Spieler sind in einem Scatter Plot angeordnet. Die Y-Achse steht konstant für den Durchschnitt der Punkte, die ein Spieler in seiner ersten Saison gemacht hat. Durch die Buttons Age, Height und Weight lässt sich die X-Achse ändern und die Spieler ordnen sich neu an. Die Farbcodierung zeigt welche Spieler viele Assists gemacht haben und die Größe ist abhängig von der Anzahl der Rebounds. Durch den Scatter Plot lässt sich leicht erkennen, ob es ein Zusammenhang zwischen einem bestimmten Alter, Gewicht und Größe und der Anzahl der erreichten Punkte gibt. Somit lässt sich sagen welche Vorraussetzungen ein Spieler am besten haben muss um viele Punkte, Assists und Rebounds zu erzielen. Außerdem erlaubt diese Darstellung sich jeden Spieler einzeln anzuschauen.