Dashboards

von der Datenflut zur

datengetriebenen Entscheidung

Elisabeth Engel

@_lizzelo_

https://unsplash.com/photos/npxXWgQ33ZQ

Eines Tages im November...

https://i.stack.imgur.com/QRBYR.png

... tauchen weitere Rechner im Netzwerk auf

Hoppla, das Dashboard des Chefs!

http://192.168.178.143:8080/

#   Datenflut

überfordernd

Management Controlling Board

57.000 €

Was sind das für Daten?

Datenpunkte

Aufbereitung

Tabelle

Visualisierung

Info

Rohdaten

Maier

01.01.2012

Huber

01.07.2016

???

??

?

Name Einstellungsdatum LOC
Maier 31.01.1978 53279
Huber 01.07.1980 16507

Datengetrieben

?

Icon made by freepik from www.flaticon.com

!

Fragegetrieben

Klare Fragestellung

Entscheidungs-

empfehlung

Icon made by freepik from www.flaticon.com

Nutzergetrieben

???

Nutzer

+

?

Klare Fragestellung

Dashboard

Entscheidungs-

empfehlung

!

10 Sekunden

Key Takeaway

Idee

Test

Entwurf

Erstellungsprozess

Papier

Tabellen Diagramm

"Entscheiden Sie, ob ..."

Key Takeaway

Visualisierungen

Visualisierungsarten

Dimensionen

Enkodierung

Farben

Visualisierungsarten

https://extremepresentation.typepad.com/files/choosing-a-good-chart-09.pdf

https://extremepresentation.typepad.com/files/choosing-a-good-chart-09.pdf

https://extremepresentation.typepad.com/files/choosing-a-good-chart-09.pdf

https://extremepresentation.typepad.com/files/choosing-a-good-chart-09.pdf

https://extremepresentation.typepad.com/files/choosing-a-good-chart-09.pdf

Tortendiagramme

Shop Kontext

Zeit

Ort

Erfolg / Misserfolg

Zugriffsart

Personengruppe

Dimensionen-Quiz

Shop Kontext

Enkodierung

Kombination

Form

Farbe

http://www.mmi.ifi.lmu.de/lehre/ws1920/iv/slides/iv_ws19_02_perception.pdf

Pre-attentiv wahrnehmbar

attentiv wahrnehmbar

Enkodierung

https://www.interaction-design.org/literature/article/preattentive-visual-properties-and-how-to-use-them-in-information-visualization

zu viel Enkodierung

  • "Sonnenschein"
  • "Irgendwelche Kreise"
  • "Menschen um einen Tisch"
  • "Komisches Logo"

Verständlichkeit für den Nutzer

Bedeutung &

Wertung

Farben

Farbblindheit

colororacle.org

colorbrewer2.org

Farbschema

Achsen

50

51

52

400

600

Glaube keiner Statistik...

500

100

200

300

400

600

Glaube keiner Statistik...

500

100

300

200

800

700

Proportion

10 %

Variant B

20 %

Variant A

Glaube keiner Statistik...

Glaube keiner Statistik...

http://www.stat.columbia.edu/~gelman/communication/Bateman2010.pdf

Konkretes Beispiel

Was können wir verbessern?

Icon made by freepik from www.flaticon.com

???

Nutzer:

?

Klare Fragestellung:

"Wie ist die Leistung des Teams?"

Selbstorganisiertes Team

1. richtige Daten-Grundlage schaffen

2. Clutter entfernen

3. passende Visualisierung wählen

4. aussagekräftige Enkodierung wählen

5. Beschriftungen einfügen

6. Kontext geben

7. Details bei Bedarf einblenden

- Details bei Bedarf einblenden

- Kontext geben

- Beschriftungen einfügen

- aussagekräftige Enkodierung wählen

- passende Visualisierung wählen

- Clutter entfernen

- richtige Daten-Grundlage schaffen

Visualisierungen optimieren

Key Takeaway

Pinterest • informationisbeautiful.net • behance.net • dailyinfographics.com

coolinfographics.com • visualcomplexity.com • flowingdata.com

improving-visualisations.org/visuals

Inspirationen

Dashboards

Aufteilung

Interaktionen

http://192.168.178.143:8080/

Aufteilung

Feedback einholen

http://192.168.178.143:8081/

Zoomen

Verschieben

Filtern

Sortieren

Verbinden

Hervorheben

Interaktionen

http://192.168.178.143:8080/

Best Practises

Datenflut beherrschen

Klein einfangen ...

Variant A

Variant B

Variant C

Blue Button Test 

Red Button Test

Yellow Button Test

Mit echten Daten testen

Key Takeaway

Vorwissen der Nutzer beachten

https://unsplash.com/photos/REZp_5-2wzA

260 000 Piloten  

7 Mrd. Laien  

Wissen & Verständnis aufbauen

"Challenger" suchen & prüfen:

 

Lässt sich aus den Daten meine Frage beantworten?

    - Daten repräsentativ?

    - Daten durch andere Einflussfaktoren verzerrt?

    - Datenausschnitt passend gewählt?

 

 

Gegencheck

Key Takeaway

Tools

Anforderungen

Tool-Vergleich

Anforderungen

vielseitig

kostengünstig

explorativ

per UI

konfigurierbar

spezialisiert

blackrockdigital.github.io/startbootstrap-sb-admin-2

Eigenentwicklung

Datenquellen: beliebig

Styling: beliebig

Besonderheiten: je nach Framework

vielseitig

kosten-

günstig

explorativ

per UI

konfigurierbar

spezialisiert

Grafana

vielseitig

kosten-

günstig

explorativ

per UI

konfigurierbar

spezialisiert auf Monitoring

Datenquellen: 50+ Plugins für Datenquellen (z.B. MySQL, Elasticsearch)

Styling: Themes per SASS anpassbar

Besonderheiten: Alerting

play.grafana.org

Tableau

vielseitig

kosten-

günstig

explorativ

per UI

konfigurierbar

spezialisiert auf Exploration

Datenquellen: 80+ Connectors  (z.B. Microsoft, Oracle, SAP, Mongo DB, MySQL)

Styling: Formatierung per UI

Besonderheiten: Drag & Drop, Daten Präsentation

www.tableau.com

Zoho Analytics

vielseitig

kosten-

günstig

explorativ

per UI

konfigurierbar

spezialisiert auf

BI & Analyse

Datenquellen: 65+ Datenquellen (z.B. Google Drive, Dropbox, Amazon, CRMs)

Styling: Chart Formatierung per UI

Besonderheiten: Drag & Drop & intelligenter Frage-Assistent

www.zoho.com/analytics/

MS Power BI

vielseitig

kosten-

günstig

explorativ

per UI

konfigurierbar

spezialisiert auf Unternehmensdaten

Datenquellen: 80+ Datenquellen (z.B. Excel, IBM, SAP, Azure)

Styling: Formatierung per UI

Besonderheiten: Excel Integration & Kombination mit Azure

powerbi.microsoft.com

TL;DL

Entscheidungs-

empfehlung

?

Nutzer mit klarer

Fragestellung

10 Sekunden Regel

!

https://unsplash.com/photos/dyYP4nCi7_o

Ja, das kann sich oft so anfühlen...

https://unsplash.com/photos/PO7CGnoDFUI

doch es lohnt sich! 

Dank ans Team

!?!

!?!

!?!

!?!

Diskussion

Fragen?

 

Empfehlungen?

 

Anmerkungen?

Folien

Kontakt

slides.com/elisabethengel/dashboards

Credits

interfacewerk GmbH

Matthias Groch

Anna Rieder

Sebastian Ullherr

  • Information Dashboard Design: The Effective Visual Communication of Data

  • https://dataschool.com/how-to-design-a-dashboard/

  • policyviz.com/helpmeviz

  • infoactive.co/data-design

  • datavizcatalogue.com

  • improving-visualizations.org

  • storytellingwithdata.com

  • blog.tr3dent.com/2016/03/21/top-10-data-visualization-experts-to-follow-on-twitter

  • lisacharlotterost.github.io/2016/04/22/Colors-for-DataVis

Quellen & interessante Links

Dashboards - von der Datenflut zur datengetriebenen Entscheidung

By Elisabeth Engel

Dashboards - von der Datenflut zur datengetriebenen Entscheidung

Dieser Vortrag zeigt den Weg von der Erstellung einzelner Visualisierungen hin zu einem einsatzfähigen und flexiblen Dashboard. Dabei wird aufgezeigt, wie Datenmengen so aufbereitet werden können, dass daraus Geschäftsentscheidungen direkt abgeleitet werden können. Zudem werden verschiedenen Dashboardlösungen anhand ausgewählter Kriterien evaluiert, um dem Zuhörer zu ermöglichen, eigene, kostengünstige Dashboards zu erstellen.

  • 2,689