Skip to content

1.1 Design‐Komponenten

LisannBach edited this page Nov 14, 2023 · 8 revisions

Design ist weit mehr als nur Ästhetik - es ist die Brücke zwischen Ideen und Benutzererfahrung. In der Welt der Open-Source-Software spielen Designprinzipien eine entscheidende Rolle bei der Schaffung intuitiver, ansprechender und funktionaler Anwendungen. Dieses Kapitel widmet sich der einführenden Betrachtung des Designs von klima.daten Bad Belzig, wobei der Fokus auf Aspekten wie Farbgestaltung, Informationsarchitektur und Benutzerführung liegt.

Die Primär-, Sekundär- und Tertiärfarbe von klima.daten Bad Belzig orientieren sich am Branding der Stadt Bad Belzig. Bei der Änderung der Farben empfehlen wir Farben mit ähnlichem Kontrast, um die Nutzerfreundlichkeit und Barrierefreiheit sicherzustellen. ir

Intern_Dashboard UX_UI - Frame 7

Des Weiteren wurde ein spezielles Ampelfarbsystem entwickelt, das speziell für die Darstellung von Daten verwendet werden kann, die eine positive oder negative Aussage oder eine Gefahrenstufe darstellen. (Beispiel: Bodenfeuchtesensor)

Intern_Dashboard UX_UI - Frame 9

Rot = #D35545 Grün = #529E7B Gelb = #f8d35e

Für die Farbgestaltung von Datenquellen nutzen wir zudem ein monochromatisches Farbschema (s.Referenzfoto)

monochromatisch

Unser Logo steht Ihnen für die Nachverwendung unter der Lizenz CC BY-SA (https://creativecommons.org/licenses/by-nc/4.0/legalcode.de) zur Verfügung. Der Präfix Klima.daten kann dabei weiterverwendet werden. Sie müssen ledigdlich den Namen Ihrer Kommune oder Region verändern.

  • Download Logo

Die Illustrationen, die auf der Seite eingebettet sind, stehen Ihnen zur Verfügung. Die Farbakzente der einzelnen Illusrationen lassen sich nach Bedarf auf neue Brandingfarben anpassen.

Download unter:

Informationsarchitektur

Die Anordnung von verschiedenen Datenquellen und Themen ist nicht immer ganz eindeutig. Um einer klareren Logik zu folgen, orientiert sich die Klimadaten-Plattform an der Struktur eines integrierten Klimaschutzkonzeptes. In diesen gängigen, kommunalen Konzepten finden sich die Themenbereiche zu Mobilität, Enegerie usw. wieder. Wir empfehlen jedoch iteratuv zu testen, wie Nutzende der Seite die Fülle an Informationen verarbeiten und navigieren.

Aufbau einer Daten-Visualisierung

Um den Prozess von der Erschließung bis zur Darstellung der Daten zu erleichtern, sind sogenannte "Cards" die Grundlage für unsere Datenvisualisierungen. Sie sind immer gleich aufgebaut und beinhalten eine Oberüberschrift (Grobe Einordnung der Datenquelle), einer Überschrift (Name der Datenquelle), dem Fenster mit der Datenvisualisierung, einer Quellenangabe, einem Feld für Legenden und abschließend einer Möglichkeit Nutzende auf die nächste Ebene, d.h. ein Grafana-Dashboard oder einen weiterführenden Link weiterzuleiten.

Screenshot 2023-11-14 110527

Texte/Stil

Die begleitenden und erklärenden Texte sind ein essentieller Bestandteil der Klimadaten-Plattform. Besonders aus klimapsychologischer Sicht sind sie relevant, da sie Distanz zu den eher abstrakten Daten abbauen und psycholigische Nähe und damit ein Gefühl von Relevanz fördern. Im Folgenden Beispiel zeigen wir, wie die Textpassagen geographische und zeitliche Nähe schaffen. Statt hypothetischen Behauptungen, können zudem reale Fakten dazu eingeordnet werden.

Screenshot 2023-11-14 110950

Des Weiteren haben wir im Abschnitt "Klimawissen" begonnen mit barrierefreier Sprache zu arbeiten. Dazu konnten wir Texte der Public Climate School verwenden.