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.
Der Datensatz
[ https://www.kaggle.com/datasets/NUFORC/ufo-sightings ]
stammt von Kaggle.com und basiert auf den Berichten des National UFO Reporting Center (NUFORC). Diese Organisation wurde 1974 von Robert J. Gribble gegründet und dokumentiert UFO-Sichtungen. Anfangs wurden Berichte per Telefon und Post erfasst, seit 1995 betreibt NUFORC eine Website zur Meldung von Sichtungen. Mit über 180.000 dokumentierten Fällen ist es eine der bekanntesten UFO-Meldestellen. Die Organisation arbeitet unabhängig und stellt ihre Daten in zusammengefasster Form öffentlich zur Verfügung.
Ein Beispiel aus der offiziellen NUFORC-Galerie – eingesandte Zeichnungen, die UFO Sichtungen visuell festhalten.
Inhalt des Datensatz
Der Datensatz enthält verschiedene Kategorien, die jede UFO-Sichtung detailliert beschreiben:
datetime – Datum und Uhrzeit der Sichtung
city, state, country – Ortsangaben der Meldung
shape – Beschreibung der Form des Objekts (z. B. rund, dreieckig)
duration (seconds/hours/min) – Dauer der Sichtung in Sekunden oder als Zeitangabe
comments – Zusätzliche Berichte oder Beschreibungen der Zeugen (teilweise ausgefüllt)
latitude, longitude – Geokoordinaten des Sichtungsortes
Für meine Datenvisualisierung habe ich mich auf bestimmte Kategorien konzentriert. Die Ortsangaben mit Latitude und Longitude nutze ich für eine Kartendarstellung, da ich besonders die Frage am spannendsten fand, wo UFO-Sichtungen gehäuft auftreten.
Zusätzlich habe ich die Shape-Kategorie einbezogen, um zu analysieren, ob bestimmte UFO-Formen in bestimmten Regionen häufiger gemeldet werden.
Ein weiterer wichtiger Aspekt ist die Zeitdimension, um zu erkennen, wann UFO-Sichtungen besonders häufig vorkamen. Dafür habe ich nicht nur die Jahre betrachtet, sondern auch Muster in Wochentagen, Uhrzeiten und Monaten analysiert. So lässt sich nachvollziehen, ob es bestimmte Trends oder saisonale Häufungen gibt.
Mein Moodboard
ist inspiriert von der Ästhetik der ersten 80er-Jahre Computerterminals. Die Bilder zeigen retro-futuristische Benutzeroberflächen, wie sie auf den ersten Heimcomputern und Hacker-Seiten zu sehen waren – oft mit grüner Pixel-Schrift auf schwarzem Hintergrund. Die Gestaltung erinnert an unsichere Webseiten und vermittelt ein Gefühl von Unzuverlässigkeit und mysteriöser Technologie. Diese Ästhetik passte meiner Meinung nach perfekt zum Thema UFO-Sichtungen, da sie das Unbekannte, Spekulative und leicht Verschwörerische visuell unterstreicht.
Erste Design Varianten
Für die Darstellung der UFO-Sichtungen auf der Karte habe ich verschiedene Ansätze ausprobiert. Zunächst dachte ich an eine ASCII-Karte, doch das erwies sich als unpraktisch – da man auf reine Textzeichen nicht klicken kann (zumindest nicht ohne zusätzlichen Aufwand). Ein unsichtbares Raster wäre nötig gewesen, was den Aufbau um einiges komplexer gemacht hätte.
Dann testete ich eine Punktdarstellung, doch letztlich entschied ich mich für eine Heatmap aus Pixeln. Diese ließ sich gut mit den Latitude- und Longitude-Werten berechnen und ermöglichte ein klares, eindeutiges Raster und passte zu dem noch zu meinem Moodboard.
Der Prototyp - Map Ansicht
absolute Sichtungennormierte Sichtungen
Zunächst habe ich zwei verschiedene Ansichten meiner Pixel-Heatmap erstellt. Die erste zeigt die absoluten Sichtungen, also einfach wo die meisten UFOs gemeldet wurden. Diese Ansicht allein ist aber noch nicht ganz aussagekräftig, da die Bevölkerungsdichte einen großen Einfluss auf die Darstellung hat – in den bevölkerungsreicheren Staaten, der East & Westcoast gibt es natürlich auch mehr UFO-Sichtungen.
Deshalb habe ich eine zweite Ansicht erstellt, die normierten Sichtungen pro Million Einwohner zeigt. Bei einer dieser Darstellung wird die Anzahl der Sichtungen ins Verhältnis zur Bevölkerung gesetzt.
In der ersten Ansicht, bei den absoluten Sichtungen, sind Kalifornien, Washington und Florida die Spitzenreiter. Doch sobald wir die Sichtungen pro Million Einwohner betrachten, ändert sich das Bild: Hier führen Washington, Montana und Oregon. Die Pixel verschieben sich im Vergleich zur Westcoast eher in den ländlicheren Westen der USA. Diese beiden Ansichten kann man über ein < Switch-Menu > wechseln, was eine interessante Möglichkeit bietet, beide Perspektiven zu vergleichen.
Dropdownmenu als Filterfunktion zu den Shapes
Um die Shape-Kategorie sinnvoll in meine Visualisierung einzubeziehen, habe ich mich entschieden, eine Filter-Funktion einzubauen. Ursprünglich gab es 26 verschiedene Formen, was die Übersichtlichkeit erschwert hätte, also habe ich diese auf vier Hauptgruppen reduziert: runde Objekte, Dreiecke, Lichter und andere Formen.
Jede Ufoform wird visuell durch eine kleine Abbildung im Pixel-Stil unterstrichen. Wenn man mit der Maus über einen Button fährt oder ihn anklickt, wird die Abbildung weiß ausgefüllt, um ein zusätzliches visuelles Feedback zu geben. So erkennt der Nutzer auch immer nach welcher Form gerade gefiltert wird.
Der Prototyp - Timeline Ansicht
(+Verschwörungs/Interpretationstheorien meinerseits^w^)
Für meine zweite Ansicht habe ich eine Timeline erstellt, die zu meinem Pixel-Stil der Heatmap passt. Diese lässt sich über einen Button oben links aufrufen und auch wieder zurück zur Map wechseln. Es gibt vier verschiedene Timelines zu folgenden Kategorien:
Wochentage: Hier lässt sich erkennen, dass samstags die meisten UFOs gesichtet werden. Das ist vielleicht nicht ganz überraschend, da viele Leute am Wochenende frei haben, vielleicht auch mal feiern gehen und trinken, was die Wahrnehmung beeinflussen könnte.
Monate: Im Sommer gibt es mehr UFO-Sichtungen als in den kalten Monaten. Das ist ebenfalls nachvollziehbar, da bei warmem Wetter mehr Menschen abends draußen sind und der Himmel länger sichtbar bleibt.
Jahre: Interessanterweise gab es 2012 einen Peak in UFO-Sichtungen. Möglicherweise lässt sich dies mit dem Weltuntergangs-Szenario in Verbindung bringen, das damals in der Verschwörungstheorie-Szene kursierte, da der Kalender der Maya mit genau diesem Jahr endete.
Uhrzeiten: Die meisten UFO-Sichtungen passieren zwischen 20 und 22 Uhr, was auch logisch ist. In diesen Stunden ist der Himmel dunkel und es ist einfacher, Himmelsphänomene zu beobachten. Außerdem sind die Leute in dieser Zeitspanne eher noch wach und draußen, als später in der Nacht.
Codestruktur
Für meine Datenvisualisierung habe ich den UFO-Datensatz auf Sichtungen in den USA reduziert, um die Darstellung übersichtlicher zu halten. Zur Farbcodierung nutze ich die Chroma.js Library, die Pixel-Farbabstufungen ermöglicht.
Das Dropdown-Menü für die Shape-Filter basiert auf eigens erstellten PNGs, die ich in Figma designt habe. So bleiben die Symbole konsistent im Retro-Stil. Zusätzlich habe ich gezielt Pixel-Fonts ausgewählt, um die Ästhetik der 80er-Computerterminals zu unterstreichen.
Für die normierte Ansicht musste ich ein zweites Datenset hinzufügen (state_poulation_density.js), das die Einwohnerzahlen der US-Bundesstaaten enthält. Die Verbindung zwischen beiden Datensätzen erfolgte über die Bundesstaats-Kürzel, die in beiden Datensätzen hinterlegt sind. Diese Schnittstelle ermöglichte die Berechnung der normierten Sichtungsrate.