Konzept

Ziel



Mit meiner Infografik möchte ich gerne die Betrachter dazu bringen über die Tiere, die Umwelt und sich selbst nachzudenken und vlt. dabei hilft etwas gegen diese Probleme zu tun und vielleicht Lösungen für einige dieser Probleme finden kann.

Idee



Auf dieses Thema komme ich, weil ich mich sehr viele Gedanken machen, wie es mit der Menschheit, den Tieren und der Umwelt weiter geht. Heute geht es Krieg wegen Öl, Geld und Macht, doch wie schaut es in 50 Jahren aus? Gibt es dann Krieg um Essen und Trinken, weil die Landwirtschaft mit der Nachfrage hinterher kommt? Und wer wird alles als erstes Essen bekommen? Die die das Geld und die Macht habe? Werden dann noch mehr Menschen unter Hunger leiden und noch mehr an Hunger sterben? Diese und noch viele weitere Fragen stelle ich mir (und das sollte jeder machen) immer wieder. Dann habe ich mir Informationen und Dokumentationen zu den Themen Weltbevölkerung, Trinkwasser, die sogenannten Nutztiere und die Nahrungen geholt und dann versucht aus ganz viel Information die wichtigsten und die vielleicht einen auch noch zu nachdenken anregen..

Diagrammarten



Bei den Diagrammarten, habe ich mich für einen senkrechten Balkendiagramm und einem Donut-Diagramm entschieden. Dabei habe ich beim Balkendiagramm die Anzahl der Menschen in der Vergangenheit und in der Zukunft. Für den Anteil von Salz-und Süßwasser weltweit haben ich den Donut-Diagramm entschieden, weil man wenige Zahlen hat und es so übersichtlich aussieht.

Farbgestaltung



Bei den Farben war ich mir von Anfang an sicher. Hier habe ich mich an die Naturfarben - blau grün und weiß orientiert. Der Body ist weiß, blau und grün kommen nur dezent bei den Diagrammen zum Einsatz. Durch die Piktogramme und die Bilder der Einzelnen Themen kommt noch mal etwas Farbe ins Spiel. Die Farben der Piktogramme sind warm gehalten und sollen angenehm für die Augen sein.

Gestaltung Anordnung



Die Infografik ist ein One-Pager und verläuft von oben nach unten. Oben rechts ist ein Hamburgermenü, wo man dann zur Dokumentation und Vorschauseite kommt. Die Infografikseite ist in vier Themen untergliedert, wobei jedes Thema mit einer Überschrift und einem Hintergrundbild versehen ist. Jedes Thema hat Unterpunkte, die mit großer Schrift hervorgehoben werden. Da es sich um eine Infografik handelt, werden Einzelne Punkte durch Piktogramme dargestellt. Damit möchte ich den Betrachter animieren weiter auf der Seite zu bleiben und nicht von zu viel Text abgeschreckt wird.


Animation und Animationstechnik

Animationen sind dezent gehalten worden, da ich meine das zu viele Animation eine Infografik nicht informativer und besser macht. Zu einem habe ich bei allen Hintergründen den Parallax-effekt verwendet. Hier sieht man je nachdem wie man scrollt (nach oben oder nach unten) einen weiteren Schnitt vom Bild. Die Diagramme sind ebenfalls animiert. Hier füllen sich die Diagramme mit den Farben blau und/oder grün. Und dann gibt es noch einen Count-up, also ein Zähler. Bei der Technik habe ich mich mit jQuery auseinander gesetzt. Die kleine Navigation ist mit JavaScript, CSS und HTML erstellt worden. Hier ist die Besonderheit, das wenn man drauf klickt, drei weitere kleine Kreise (oder auch Buubles) rauskommen und die alle drei Unterseiten (Infografik, Konzeption und die Vorschau der MED14B) zeigt.