Die komplexe, klimarelevante Thematik der Landnutzungsänderungen wird in dieser Website mit Hilfe von grafischen Darstellungen spannend erzählt und übersichtlich aufbereitet. 

Die Leitthemen sind die Strategien und Lösungsansätze gegen den Klimawandel. Durch interaktive Medien werden Inhalte kompakt und effektiv vermittelt. Der Betrachter erhält so einen schnelleren und unmittelbareren Zugang, als bei einer rein textbasierten Informationsvermittlung.
Der Fokus liegt auf den unterschiedlichen Visualisierungsmodellen, durch die die Grundlagen der Informationsgestaltung erprobt werden.
Dazu zählen:
Diagramme und Datengrafiken
Illustrationen und Funktionsdarstellungen
Icons und Piktogramme 
Kartografie und Timelines

Design     
Illustration
Animation
Information Design
Iconography
Website Design
UX / UI
Interaction Design

Tools
Webflow
XD
Adobe Illustrator
Team
Jannis Braun
Leon Beu
AUFBAU
​​​​​​​​​​​​​​Der Fokus für den Aufbau der Website liegt auf einem sinnvollen Storytelling. Anfangs versuchten wir, auf jedes Problem und jede Ursache einzeln einzugehen, doch uns wurde schnell bewusst, dass wir den Themenbegriff zu breit verstanden hatten. Dies hatte zur Folge, dass alle Themenbereiche nur sehr oberflächlich behandelt werden konnten. Mit dem neu ausgelegten Hauptaugenmerk auf die beiden größten Probleme – der Waldrodung und der Moortrockenlegung – fiel der Umfang deutlich geringer aus und wir konnten diese Themen angemessen vertiefen.
FARBE
Auf der Website gibt es drei verschiedene Zwecke, die die Farben erfüllen müssen: Eine Signalfarbe (Orange), ein Farbset für den Hintergrund (hauptsächlich Grautöne) und Farben für Infografiken und Illustrationen (Blau und Grün). Die Farben Schwarz und Weiß haben wir bewusst vermieden, um keine zu harten Kontraste zu erzeugen. Einige Illustrationen wurden zudem noch durch weitere Farbtöne ergänzt. Das Ziel war, ein in sich stimmiges Farbset zu schaffen, das prägnante, sowie zurückhaltende Farben beinhaltet und Raum für Abstufungen bietet.
ILLUSTATIONEN
Auf der Website gibt es zwei verschiedene Illustrationsstile: detailliert und reduziert. Ersteres verwenden wir dreimal auf der Website, als Starter-Grafik und Head-Banner für die Bereiche Wald und Moor. Hierbei orientierten wir uns an geometrischen Grundformen. 
Die Idee für die Starter-Illustration resultierte aus der Überlegung, wie wir eine Änderung einer Landnutzung prägnant darstellen könnten. Das Szenario stellt einerseits einen gesunden Wald, andererseits einen durch den Mensch gerodeten Wald dar. 
Wir entwickelten uns hierbei von einem sehr detailreichen, aber auch inkonsequentem Stil, zu einem geometrischen und angeglichenen Stil, der leicht reproduzierbar ist und weniger vom eigentlichen Inhalt ablenkt.
GRAFIKEN
Unsere Informationsgrafiken hielten wir sehr reduziert, um den Fokus auf die klare und verständliche Vermittlung des Inhalts zu setzen. Durch den Einsatz geometrischer Grundformen, ließ sich dieses Vorhaben umsetzen. 
Der Aufbau dieser Grafik wird durch Pfeile in einem Kreislauf visualisiert. Dem intakten Wald auf der linken Seite steht eine abgeholzte Fläche auf der anderen Seite entgegen. Die Interaktivität trägt hier zur Verständlichkeit der Grafik bei. Durch eine Lottie Animation baut sich der Kreislauf, gesteuert durch die Scrollposition, chronologisch auf und der Ablauf wird deutlich.
Diese Grafik stellte eine Herausforderung dar, da hier eine Gegenüberstellung einer dreidimensionalen Fläche und sechs zweidimensionalen Flächen visualisiert wird. Um diesen Sprung zwischen den Dimensionen zu verdeutlichen, wird auf der rechten Seite die fehlende Dimension gestrichelt angedeutet. Eine Interaktivität war hier aufgrund des Aufbaus und Inhalts der Grafik unserer Meinung nach nicht sinnvoll.
RASTER
Die Website ist in ein dreispaltiges Raster aufgeteilt. In der linken Spalte finden sich Piktogramme, die als optisches Leitsystem durch die Website führen und jeweils einen neuen Teilbereich eines Themas eröffnen. Mittig im Raster befindet sich das einspaltige Textfeld. Die dritte Spalte ganz rechts ist frei von stetigen Elementen. Die Grafiken sind in die zweite Spalte eingehängt und ragen, je nach Größendimension, in die dritte Spalte hinein. Einige Grafiken benötigen eine Legende. Diese wird stets an der selben Stelle neben dem grafischen Element platziert. Die Bild- und Bannerelemente brechen das Raster auf und ziehen sich über die gesamte Bildschirmbreite. 
WEBSITE
Back to Top