diff --git a/docs/viz/bloomberg-hongkong-overview.png b/docs/viz/bloomberg-hongkong-overview.png new file mode 100644 index 0000000..a563240 Binary files /dev/null and b/docs/viz/bloomberg-hongkong-overview.png differ diff --git a/docs/viz/bloomberg-hongkong-zoom-1.png b/docs/viz/bloomberg-hongkong-zoom-1.png new file mode 100644 index 0000000..5c5da43 Binary files /dev/null and b/docs/viz/bloomberg-hongkong-zoom-1.png differ diff --git a/docs/viz/bloomberg-hongkong-zoom-2.png b/docs/viz/bloomberg-hongkong-zoom-2.png new file mode 100644 index 0000000..35908e4 Binary files /dev/null and b/docs/viz/bloomberg-hongkong-zoom-2.png differ diff --git a/docs/viz/data-storytelling.rst b/docs/viz/data-storytelling.rst new file mode 100644 index 0000000..2852550 --- /dev/null +++ b/docs/viz/data-storytelling.rst @@ -0,0 +1,141 @@ +Data-Storytelling +================= + +Die meisten Data-Stories haben folgende Elemente gemeinsam: + +* Kontext +* Figur +* Ereignisse +* Wirkung + +.. figure:: plastic-bottles-reuters.png + :alt: Täglich verkaufte Menge an Plastikflaschen im Vergleich zum Eifelturm. + + Quelle: `Drowning in Plastic, Reuters + `_ + +Um große Zahlen wie diese verständlich zu machen, können sie in Einheiten +umgerechnet werden, mit denen Menschen vertraut sind. Das britische Office for +National Statistics (ONS) hat einen *Context Calculator* veröffentlicht, mit dem +sich große Geldbeträge in eine vertraute Perspektive umrechnen lassen. + +.. raw:: html + + + +* :abbr:`ONS (Office for National Statistics)`-Nettobeitrag +* Nettobeitrag der Europäischen Kommission +* % der Staatsausgaben 2018 + +Journalistische Techniken +------------------------- + +Die umgekehrte Pyramide +~~~~~~~~~~~~~~~~~~~~~~~ + +Die umgekehrte Pyramide ist eine Metapher zur Strukturierung von +Nachrichtenartikeln. + +#. Die wichtigsten und interessantesten Informationen eines Artikels sollten + demnach bereits in den ersten Sätzen enthalten sein. Eine hilfreiche Technik, + um zu bestimmen, was diese Botschaft enthalten sollte, ist eine andere + journalistische Technik, *die fünf W’s*: + + Wer, Was, Wann, Wo und Warum + +#. Details können später im Text folgen. + +#. Zusätzliche Hintergrundinformationen sollten zuletzt erwähnt werden. + +.. figure:: inverted-pyramid.svg + :alt: Umgekehrte Pyramide + +Mantra der visuellen Informationssuche +~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ + +Das Mantra der visuellen Informationssuche wurde 1996 von Ben Shneiderman +geprägt: `The Eyes Have It: A Task by Data Type Taxonomy for Information +Visualizations `_. + + „Interessanterweise entspricht das journalistische Dreieck mehr oder weniger + dem Mantra interaktiver Grafiken: **zuerst Überblick, zoomen und filtern, + und Details auf Anfrage**“ + +– Barbara Tversky in `Data-Driven Storytelling +`_ + +Das Mantra der visuellen Informationssuche wurde mit Blick auf die interaktive +und explorative Datenvisualisierung entwickelt, gilt aber auch für die +erklärende Datenvisualisierung. Demzufolge sollte zunächst ein Überblick gegeben +werden. In einer datengetriebenen Geschichte kann eine Visualisierung des +längerfristigen Trends oder der Gesamtverteilung oder der Beziehungen in einer +Datenvisualisierung gezeigt werden, um den Kontext zu skizzieren und das Thema +und die Daten vorzustellen. Alle Datenpunkte werden angezeigt. Die Übersicht +kann auch aus einer einzelnen Schlüsselkennzahl bestehen, wie einem globalen +Durchschnitt oder einer Gesamtsumme. + +Dann kommen Zoom und Filter: Die Sicht auf die Daten wird so verändert, dass +interessante Elemente in den Daten in den Fokus rücken und uninteressante +Elemente herausgefiltert werden. Ausreißer werden hervorgehoben, Korrelationen +werden angezeigt, kleinere interessante Muster werden kommentiert, die +Gesamtsumme wird in ihre Komponenten zerlegt, etc. + +.. figure:: bloomberg-hongkong-overview.png + :alt: Seit Inkrafttreten des Gesetzes im Juni 2020 wurden mehr als 150 + Personen von Hongkongs Abteilung für nationale Sicherheit verhaftet. + + Quelle: `Bloomberg: How Hong Kong’s National Security Law Is Changing + Everything + `_ + +.. figure:: bloomberg-hongkong-zoom-1.png + :alt: Eine Person wurde wegen eines Gewaltdelikts inhaftiert, 14 weitere + wurden der Planung von Anschlägen beschuldigt. Weitere 14 Personen + wurden wegen finanzieller Aktivitäten verhaftet, darunter eine + Crowdfunding-Kampagne zur Unterstützung junger pro-demokratischer + Demonstranten bei der Ausreise nach Taiwan. + +.. figure:: bloomberg-hongkong-zoom-2.png + :alt: Die meisten von ihnen wurden wegen Vergehen im Zusammenhang mit ihren + öffentlichen Äußerungen, Positionen und anderen politischen Aktivitäten + angeklagt. Dazu gehören der Medienmagnat Jimmy Lai und der ehemalige + Studentenführer Joshua Wong. + +Anthropografie +-------------- + +Bei der Darstellung von Daten über Menschen, wie im vorigen Beispiel über +verhaftete Menschen in Hongkong, helfen, sich mit diesen Menschen zu +identifizieren. Hierfür wurde der Begriff Anthropografie erst kürzlich geprägt, +um in Datenvisualisierungen Empathie zu wecken. + +Persönliche Ansprache +--------------------- + +Das Publikum sollte sich selbst in den Daten wiederfinden. Mit *Zoom* und +*Filter* können die für eine einzelne Person wichtigsten Daten visualisiert +werden, :abbr:`z.B. (zum Beispiel)`: + +* lokale Statistiken +* der Wirtschaftszweig, in dem sie arbeiten +* Schlüsselzahlen für ihre Altersgruppe + +Viele Titel interaktiver Charts sprechen die Leser*innen direkt an und laden sie +ein, selbst zu interagieren und ihre eigenen Daten zu finden. Ein Beispiel für +diese Technik ist `population.io `_: + +.. figure:: population-interface.png + :alt: Screenshot der Benutzeroberfläche von population.io mit der Überschrift + »Wie groß ist mein Anteil an der Weltbevölkerung? Wie lange werde ich + leben?« + +:abbr:`ONS (Office for National Statistics)` hat das „You“ in die Überschrift +von *How health has changed in your local area* gesetzt: + +.. figure:: ons-health-local-area.png + :alt: Screenshot eines interaktiven Artikels mit der Überschrift „Entdecke + die Daten in deinem Gebiet“ über einem großen Suchfeld mit + Dropdown-Liste. + +Nach der Auswahl des Interesses werden Text und Visualisierungen des Artikels +aktualisiert und konzentrieren sich auf den ausgewählten Bereich. diff --git a/docs/viz/index.rst b/docs/viz/index.rst index f5ac08d..4122ae8 100644 --- a/docs/viz/index.rst +++ b/docs/viz/index.rst @@ -32,4 +32,5 @@ Daten mit schönen und zugänglichen Visualisierungen erzählen. diagram-anatomy/index cognitive-load types/index + data-storytelling dashboards diff --git a/docs/viz/inverted-pyramid.svg b/docs/viz/inverted-pyramid.svg new file mode 100644 index 0000000..d0ece6b --- /dev/null +++ b/docs/viz/inverted-pyramid.svg @@ -0,0 +1,464 @@ + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/viz/ons-health-local-area.png b/docs/viz/ons-health-local-area.png new file mode 100644 index 0000000..0569e34 Binary files /dev/null and b/docs/viz/ons-health-local-area.png differ diff --git a/docs/viz/plastic-bottles-reuters.png b/docs/viz/plastic-bottles-reuters.png new file mode 100644 index 0000000..58e9453 Binary files /dev/null and b/docs/viz/plastic-bottles-reuters.png differ diff --git a/docs/viz/population-interface.png b/docs/viz/population-interface.png new file mode 100644 index 0000000..7a3ae3c Binary files /dev/null and b/docs/viz/population-interface.png differ