Cleverclip Logo
Best interactive infographics

Die besten interaktiven Infografiken 2020

Natalie Ediger, 26. November 2020· Infografiken

Interaktive Infografiken: Wir stellen die Besten vor

Die Infografik hat bereits vor einiger Zeit einen Ehrenplatz auf unserem Blog erhalten. Sie gilt als kleines Powertool im Content Marketing, denn sie ermöglicht es, eine Vielzahl komplexer Informationen leicht verständlich, anschaulich und präzise zu präsentieren. Jetzt legen wir aber noch eine Schippe drauf. Denn statt einer gewöhnlichen Infografik bringen wir sie im heutigen Blogpost zum Leben. Na ja, so in der Art. Sprechen und atmen kann sie zwar nicht, dafür spricht sie aber beim Nutzer mehrere Sinne gleichzeitig an. Es dreht sich heute alles um die interaktive Infografik.

Bei einer interaktiven Infografik ist der Nutzer nicht nur passiver Betrachter, sondern kann direkt mit den Inhalten interagieren und z.B. durch das Klicken und Scrollen mehr Informationen zu einem Thema erhalten. Dadurch lassen sich selbst komplexe Botschaften und Informationen in eine einzige Infografik unterbringen ohne als zu aufdringlich wahrgenommen zu werden. Und abgesehen davon, machen interaktive Infografiken doch einfach Spass!

Eine interaktive Infografik regt die User zum Interagieren an

Damit Sie auch genug Inspiration erhalten, habe ich mich auf die Suche nach den besten interaktiven Infografiken gemacht. Voilà,  hier kommt die crème de la crème, die derzeit im Web kursiert.

Die besten interaktiven Infografiken

“The Seas of Plastic”

interaktive Infografiken

Hier geht’s zur interaktiven Version.

Die Plastikverschmutzung unserer Ozeane ist eine globale Umweltherausforderung und wird hier in einer interaktiven Infografik festgehalten. Der Nutzer steuert eine 3D-Darstellung der Erde und sieht so die über die letzten Jahrzehnte angesammelte globale Ozeanverschmutzung.

Spot – Das nächste Level von Cloud Computing und Cloud Hero

Cloud Computing ändert sich rasant und so entstand Spot von NetApp. Damit können die Kunden von BNC ihr Cloud Computing optimieren und die passenden Services finden.

Interaktive Infografik zum Cloudhero

Die Chronologie des Universums

Es ist zwar keine interaktive Infografik im herkömmlichen Sinne, sondern eher eine Video-Infografik. Aber mindestens genauso interaktiv. Die dramatische Musik kombiniert mit den beeindruckenden Grafiken schaffen eine geheimnisvolle Atmosphäre und nehmen so den Zuschauer auf eine atemberaubende Reise durch die Geschichte des Universums. Der ideale Weg, um komplexes Wissen fesselnd zu vermitteln und langfristig im Gedächtnis der Zielgruppe zu bleiben.

Die  “New New York Skyline”

interaktive Inhalte

Hier geht’s zur interaktiven Version.

Corona hat vielleicht Ihre lang ersehnte Traumreise in den Big Apple zerplatzen lassen. Einen kleinen Einblick in New Yorks Wolkenkratzer gibt es dennoch. Das Magazin National Geography zeigt Ihnen nämlich in einer interaktiven Infografik, wie sich die Skyline seit 2004 verändert hat. Sogar eine 3D-Ansicht ist möglich. Koffer packen und los geht’s!

“How to build a human brain” – GIF Infografik

GIF interaktive Infografik

Quelle: spielcreative.com

Wir klicken hier zwar nicht auf spektakuläre Schaltflächen oder werden selbst Teil eines immersiven Erlebnisses. Dennoch ist diese Infografik im GIF-Stil für Lernzwecke sehr gelungen.

Die Grafik führt den Nutzer auf eine visuelle Reise durch alle 40 SSW und packt so eine Vielzahl wertvoller Informationen unter einen Hut – ohne aber überladen zu wirken. Die zusätzliche Animation weckt sofort die Aufmerksamkeit. Ich frage mich, warum solche Illustrationen nicht öfters in Klassenräumen Verwendung finden. Zumindest würden die Schüler im Biologieunterricht besser aufpassen. 😉

Landingpage – Optimale Vorgehensweise

Hier geht’s zur interaktiven Version.

Wie erstellt man eine effektive Landingpage? Genau das möchte E-mail Monks mit dieser animierten Infografik beantworten. Dabei fährt der Zuschauer durch die “Landingpage Road” und erreicht so nach vielen Stationen das Ziel. Ein buntes, einladendes Design runden das Ganze ab. Na dann, gute Fahrt!

Wirtschaftliches Ungleichgewicht in den USA

interaktive Infografiken

Hier geht’s zur interaktiven Version.

Das “Economic Policy Institute”, eine amerikanische Non-Profit-Organisation kreierte diese aufschlussreiche Infografik, um die Gesellschaft bzgl. wirtschaftlicher Disparitäten aufzuklären und gleichzeitig zu zeigen, wie sie behoben werden können.

Der Nutzer kann dabei selbst auswählen über welche ökonomischen Themengebiete er mehr erfahren möchte und erlangt so spezifisches Fachwissen.

Wie funktionieren Lautsprecher? – Animierte Infografik

Hier geht’s zur interaktiven Version.

Irgendwelche technologie begeisterten Musiker hier? Diese Infografik könnte nämlich für Sie besonders interessant werden. Die GIF-Animation veranschaulicht detailliert, wie ein Lautsprecher bzw. eine Musikbox aufgebaut ist und Klang erzeugt. Ein perfekter Beweis, wie wirkungsvoll eine Infografik bei der Erklärung komplexer, technischer Produkte sein kann.

Klimawandel interaktiv erklärt

Hier geht’s zur interaktiven Version.

Die globale Erderwärmung ist eine grausame Realität, gegen die wir schnellstmöglich ankämpfen sollten. In diesem Zusammenhang hat “The solutions project” ein ganz klares Ziel: Die USA soll bis 2050 komplett auf erneuerbare Energien umsteigen. Um das Projekt in den Gang zu setzen, haben sie eine interaktive Karten-Infografik erstellt, die den aktuellen Stand des Energieverbrauchs illustriert. Der Nutzer kann auf jeden beliebigen US-Bundesstaat klicken und erhält so detaillierte Informationen. Infografiken in Form von Karten sind generell eine ideale Möglichkeit, um geografisch bezogene Daten anschaulich zu vermitteln.

Cleverclip’s Road to perfection

Eine interaktive Infografik der etwas anderen Art. Malcom Gladwell behauptet in seinem Buch “Outliers-The story of success”, dass wir nach 10’000 Stunden Ausübung, Meister in einer bestimmten Aktivität werden. Meine Kollegen und Kolleginnen bei Cleverclip haben ihn sehr beim Wort genommen und darauf basierend eine “road to perfection” erstellt.

Ob Zwiebelschneiden, Schuhebinden oder Tauchen, der Nutzer kann in null Komma nichts erfahren, wie gut er in einer beliebigen Aktivität wirklich ist. Übrigens, falls es noch Spielraum nach oben gibt, geben wir natürlich auch ein paar Expertentipps. Klicken Sie hier, um direkt mitzuspielen oder lesen Sie den gesamten Case.

13 Gründe, warum unser Gehirn Infografiken liebt

Interaktive Infografik

Hier geht’s zur interaktiven Version

Wenn wir schon die ganze Zeit von Infografiken sprechen, sollten wir vielleicht uns nochmal vor Augen führen, warum sie denn so wichtig sind. Das dachte sich wohl auch das Team von NeoMam Studios und visualisiert somit 13 Gründe warum unser Gehirn Infografiken liebt. Die Infografik ist unterhaltsam, übersichtlich gestaltet und obendrein sehr informativ. Genau so muss es sein!

Alltagsroutine berühmter Persönlichkeiten

Hier geht’s zur interaktiven Version.

Wie viel Stunden am Tag hat Mozart geschlafen? Wie oft am Tag hat Benjamin Franklin gegessen? Und wie viel Stunden kreativer Arbeit widmete sich Picasso? Das können Sie jetzt ganz einfach mit dieser interaktiven Infografik herausfinden. Basierend auf “Daily Rituals” von Mason Currey können Sie nach verschiedenen Kategorien filtern und anschliessend über die Balken mit dem Mauszeiger fahren, um mehr Informationen zu erhalten.

Wie das Elterneinkommen die College-Ausbildung der Kinder beeinflusst

Hier geht’s zur interaktiven Version.

Es ist nicht ganz eine klassische Infografik, aber trotzdem eine sehr interessante und interaktive Methode, um Fakten mit Hilfe von Storytelling zu vermitteln. Hier dürfen Sie zunächst selbst aktiv werden und Ihre Schätzung zeichnen. Daraufhin wird Ihre Schätzung mit der tatsächlichen Situation verglichen und Ihnen zusätzliche Informationen vermittelt.

Wie weit ist es bis zum Mars?

Wie weit ist es bis zum Mars?

Hier geht’s zur interaktiven Version.

Eine beeindruckende Art und Weise, um dem Nutzer zu zeigen, wie weit der Mars von der Erde entfernt ist. Durch zusätzliche eingeblendete Informationen wird die gesamte Reise durch das Weltall ein unterhaltsames Abenteuer.

Der Pfad des sozialen Wandels

Hier geht’s zur interaktiven Version.

Eine spannende interaktive Infografik, die den sozialen Wandel in den USA veranschaulicht. Dabei werden sechs grosse Themenbereiche analysiert: Mischehen, Prohibition, Frauenstimmrechte, Abtreibung, gleichgeschlechtliche Ehe und Legilisierung von Marihuana. Durch Klicken auf die jeweiligen Staaten erfährt der Nutzer, wie sich diese Bereiche entwickelt haben bzw. auch in Zukunft noch verändern könnten.

Der Flüchtlingsstrom nach Europa

Hier geht’s zur interaktiven Version.

Auch nicht mehr ganz auf dem neuesten Stand, jedoch nach wie vor sehr informativ. Hier wird die Flüchtlingsbewegung seit 2012 in Europa gezeigt. Jeder Punkt steht dabei repräsentativ für etwa 25 Menschen. Der Nutzer kann über die einzelnen Länder mit dem Mauszeiger fahren und somit weitere Details erhalten. Auf einer Zeitleiste lassen sich auch die genauen Jahreszahlen und Monate einstellen.

Wie lässt sich so eine atemberaubende interaktive Infografiken erstellen?

Nachdem Sie jetzt (hoffentlich) inspiriert genug sind, um sich selbst ans Werk zu machen, stellen Sie sich vielleicht die Frage aller Fragen: “wie erstelle ich eigentlich interaktive Infografiken?”.

Wie Sie auch vielleicht bei den Beispielen gesehen haben, werden die meisten Infografiken “interaktiv”, indem der Nutzer beim Scrollen und Klicken zusätzliche Informationen erhält. Bevor Sie mit der Erstellung Ihrer interaktiven Infografik beginnen, sollten Sie also genau überlegen, welche Informationen interaktiv gestaltet und welche Elemente (z.B. Links oder Schaltflächen) verwendet werden sollen.

Interaktive Infografiken werden meistens mit HTML5, Javascript und JQuery umgesetzt. Dabei entsteht im Prinzip zunächst eine statische HTML-Seite mit integrierten Scripten, die anschliessend die Dynamik ermöglichen. Für die kreative Gestaltung einer Infografik gibt es ausserdem eine Vielzahl von Online Tools. Hier eine Auswahl besonders beliebter Programme:

  1. Visual.ly

  2. Canva

  3. Visme

  4. Kartograph (für interaktive Karten)

  5. Bitable

  6. Adobe Express

Wichtige Schritte bei der Erstellung einer interaktiven Infografik

Unabhängig davon, ob es sich um eine interaktive oder statische Infografik handelt, sollten einige generelle Faktoren immer berücksichtigt werden:

Ziel- und Zielgruppenanalyse

Welche Informationen sollen veranschaulicht werden? Legen Sie zu Beginn das Ziel fest und analysieren Sie Ihr Publikum genau. Schliesslich soll die Infografik sowohl designtechnisch, als auch inhaltlich mit den Bedürfnissen der Zielgruppe und der Markenbotschaft im Einklang sein.

Zentrale Kernbotschaft und Mehrwert

Die Infografik sollte eine zentrale Kernbotschaft sowie lediglich die wichtigsten Punkte, die das Publikum innerhalb von kürzester Zeit nachvollziehen kann, vermitteln. Achten Sie auch darauf, dass die Infografik dem Publikum einen entscheidenden Mehrwert liefert.

Aussagekräftige Überschriften

Kurze, aber ausdrucksstarke Überschriften suggerieren bereits auf den ersten Blick spannenden Content. Achten Sie darauf, dass die Überschriften relevant für den Inhalt der Infografik aber auch “catchy” genug sind, um die Neugier der Zielgruppe zu wecken.

Visuell ansprechend

Eine effektvolle Infografik zeichnet sich vor allem durch eine gute Balance zwischen Grafiken und Negativraum aus. Ohne ausreichenden Negativraum wirkt jede Infografik schnell erdrückend. Auch die Farbgebung spielt eine Rolle: Generell gilt die Faustregel sich auf maximal drei Farben aus der Farbpalette zu beschränken, wobei die hellste Farbe den Hintergrund kennzeichnet und die zwei dunkleren, verschiedene Elemente bilden.

Nicht zu viel Branding

Alle markenspezifischen Inhalte können sehr schnell als aufdringlicher Verkauf wahrgenommen werden und die erzählerische Magie der Infografik entkräften. Neben der selbstständigen Erstellung mit Hilfe von online Tools, bietet sich natürlich auch die Zusammenarbeit mit einer professionellen Agentur an. Dies ist vor allem dann sinnvoll, wenn das Thema komplex ist und vielerlei Informationen und Fakten enthält. Trotz höherer Kosten, weiss eine Agentur genau, wie die Informationen präsentiert werden sollen, um dem Publikum einen entscheidenden Mehrwert zu liefern. Das Kreativteam hilft Ihnen dabei, interaktive Elemente professionell zu integrieren und somit ein atemberaubendes Nutzererlebnis mit meinem ansprechenden Design zu schaffen. Eine gute Agentur wird sich auch stets bemühen ein gutes Preis-Leistungsverhältnis für verschiedene Budgets zu finden.

Wir bei Cleverclip beispielsweise, arbeiten gemeinsam mit dem Kunden, um die ideale Herangehensweise für die Projektumsetzung zu finden. Unsere Projekte beginnen meistens mit einem Kreativ-Workshop, in welchem wir alle nötigen Informationen bzgl. des Themas und der Zielgruppe sammeln und alle aufkommenden Fragen beantworten. Gemäss des Kundenfeedbacks, erarbeiten wir einen passenden Stil, der die jeweiligen Informationen an die Zielgruppe perfekt vermittelt.

Die besten Infografiken – Fazit

Ich hoffe sehr, dass Sie diese kleine visuelle Reise ins Land der Datenvisualisierung genossen haben. Eine interaktive Infografik kann Ihre Marketingstrategie definitiv bereichern. Sie packen komplexe Informationen in eine spannende Geschichte und motivieren den Zuschauer zur aktiven Teilnahme. Durch die interaktiven Elemente können sie ausserdem mehr Informationen unterbringen, als statische Infografiken.

Sind Sie auf spannende interaktive Infografiken gestossen, die in diesem Beitrag fehlen? Dann schreiben Sie uns. Apropos, ich habe mich in letzter Zeit auf die Suche nach vielen “best ofs” gemacht. Hier können Sie die besten Erklärvideos 2020 betrachten oder auch auf eine spannende Landingpage-Suche gehen.