Laut sprechen.
Visuelle Kommunikation war schon immer ein wichtiger Faktor in der menschlichen Interaktion. Bildmaterial kann helfen, eine Botschaft mit wenigen oder gar keinen Worten zu vermitteln.
Wir verzichten auf das Klischee, wie viel ein Bild wert ist, das kennen Sie schon. Aber visuelle Elemente sind eine großartige Ergänzung für jede Art von Inhalt, sei es ein Blogbeitrag, ein Update für soziale Medien oder ein E-Mail-Newsletter.
Insbesondere Infografiken sind ein äußerst praktisches Instrument zur Visualisierung von Daten und Informationen, die sich nur schwer überblicken lassen.
Sie lassen sich auch super mit anderen teilen!
Was viele bei der Gestaltung von Infografiken jedoch nicht bedenken, ist, dass man sie mit einer Dosis von Animation und Interaktivität zum Leben erwecken kann.
Um Ihre Kreativität anzuregen, haben wir diese tolle Liste mit 23 animierten und interaktiven Infografiken zusammengestellt, die Sie zu Ihren eigenen visuellen Inhalten inspirieren können.
Aber zuerst sollten Sie sich dieses Video aus der Tutorial-Serie von Visme auf YouTube ansehen. Es wird erklärt, wie Sie Popup-Grafiken zu Ihren Inhalten hinzufügen können – ein wichtiger Baustein für interaktive Infografiken.
Das obige Video führt Sie durch die Erstellung von Popup-Grafiken und Schwebe-Effekten in Visme, um interaktive Infografiken zu erstellen, die viel ansprechender sind als statische Bilder.
Nachfolgend finden Sie 23 animierte und interaktive Infografiken, die Sie sich als Inspiration speichern können.
Der Netflix-Film El Camino wurde als Fortsetzung der Serie Breaking Bad veröffentlicht, Jahre nachdem das Finale ausgestrahlt wurde. Storygraph hat eine Zeitleiste der gesamten Serie Breaking Bad erstellt, die man sich vor dem Anschauen von El Camino zur Auffrischung ansehen kann.
Die Zeitleiste wird mit einer weißen Linie für jede Figur festgelegt und sie bewegen sich entlang ihrer Linie, treffen andere Figuren und interagieren mit verschiedenen Orten.
Es sieht so aus, als ob die gesamte Zeitleiste als eine lange horizontale Grafik entworfen wurde und dann die Zeichen darüber animiert wurden. Das fertige Video ist unterhaltsam, leicht verständlich und kurzweilig.
Diese animierte Infografik wurde so gestaltet, dass sie den Malereien auf den Keramiken des antiken Römischen Reiches ähnelt. Sie erzählt das Leben von Spartacus und wie es ihm gelang, eine Armee aufzustellen und Sparta zu gründen.
Der kreative Aspekt von Das Leben von Spartacus ist die Tatsache, dass alles in 2D dargestellt wird, als ob es den Menschen auf den Keramiken dieser Zeit ähneln würde. Die Verwendung eines historischen visuellen Reizes ist eine großartige Möglichkeit, Ihre Infografiken mit Leben zu füllen.
In dieser interaktiven Donut-Tabelle von The Guardian geht es darum, dass jeder Staat je nach Typ unterschiedliche Gesetze und Rechte hat. Die Interaktivität besteht darin, dass Sie mit der Maus über jeden Zustand fahren und die Legende zur Bedeutung der einzelnen Farben hervorheben.
Eine interaktive Infografik dieses Stils ist am einfachsten zu erstellen, da es keine Animation gibt. Die Legenden-Pop-ups werden beim Hovern ausgelöst, um eine einfache Erfahrung zu schaffen.
Leider wurde diese Grafik zuletzt 2015 aktualisiert – es wäre schön, wenn diese interaktive Infografik mit den neuesten Vorschriften aktualisiert würde.
Nicht alle Infografiken, ob interaktiv oder nicht, müssen ernsthafte Informationen enthalten. Sie können auch lustig und unterhaltsam sein. Wie dieses Beispiel über die Art und Weise, wie Männer ihre Freunde in verschiedenen Teilen der USA nennen.
Wenn Sie auf einen der Begriffe im oberen Menü klicken, wird das entsprechende Gebiet in den USA hervorgehoben. Es gibt einen progressiven 5-Farben-Code, der angibt, wie häufig die Verwendung ist. Dieses Beispiel ist super einfach, aber auch super lustig.
Ein weiteres unterhaltsames Beispiel für eine interaktive Infografik ist diese, die die beliebtesten Hundenamen nach Rasse visualisiert. Klicken Sie auf einen Kreis mit dem Namen einer Rasse, und das Popup zeigt ein illustriertes Beispiel dieser Rasse sowie die gebräuchlichsten Namen, die für sie verwendet werden.
Diese interaktive Infografik wurde mit Visme erstellt. Sie könnten etwas Ähnliches für Ihre eigenen Inhalte im gleichen Popup-Stil erstellen.
Wir können diese interaktive Infografik zwar nicht online ausprobieren, aber sie war Teil einer Ausstellung über Unterwassergeologie. Es wurde von den Professoren als Präsentationswerkzeug und von den Studenten als Entdeckungswerkzeug verwendet.
Das interaktive Tsunami-Poster war ein Touchscreen mit Visualisierungen darüber, wie Tsunamis entstehen, welche Auswirkungen sie auf die Erde haben und wie sie aus dem Weltraum aussehen.
Technisch gesehen kann diese interaktive Infografik eher als Informationsdesign betrachtet werden. Es ist ein großartiges Beispiel dafür, wie Lehrmittel mit etwas Kreativität und Computerprogrammierung auf die nächste Stufe gehoben werden können.
Tabletop Whale ist ein bekannter Blog für wissenschaftliche Illustrationen und interaktive Infografiken. Es überrascht nicht, dass wir drei Beispiele ihrer Arbeit in diese Liste aufgenommen haben.
Dies ist eine animierte Infografik, die die Funktionen eines Beatmungsgeräts für COVID-19-Patienten erklärt. Die Infografik gliedert sich in drei Abschnitte, um zu veranschaulichen, wie genau die Beatmung funktioniert und welche zwei verschiedenen Arten von Beatmungsgeräten verwendet werden.
Diese Art von animierter Infografik ist ein großartiges Beispiel dafür, wie man das Innenleben eines scheinbar komplizierten Geräts einfach erklären kann. Diese Art von Informationen für Ihre Anhänger ist sehr wertvoll.
Die zweite interaktive Infografik von Tabletop Whale ist eine ihrer berüchtigtsten. Wie ein Mensch entsteht eine animierte Infografik über den Lebenszyklus eines menschlichen Fötus. Das Design ist eine spiralförmige Visualisierung, die sich von außen nach innen entwickelt.
Technisch gesehen ist die Bewegung eine optische Täuschung – die Animation wird auf jedes einzelne Element angewendet, aber die Zeitleiste ist so makellos, dass es so aussieht, als würde sie sich bewegen.
Interaktive Infografiken wie die obige werden immer häufiger. Der Trick, um sie hervorzuheben, besteht darin, sie intuitiv zu gestalten. In dieser Infografik des Chartered Institute of Ergonomics and Human Factors sind die interaktiven Auslöser leicht zu erkennen.
Und nicht nur das, es gibt auch eine Beschriftung, die erklärt, wie es funktioniert. Die Erstellung dieser Art von Infografik ist mit Visme ganz einfach: Verwenden Sie einfach die Popup-Funktion und einige auffällige Symbole als visuelle Auslöser.
Scrollende Infografiken waren vor ein paar Jahren eine große Sache. Das sind keine Infografiken von der Stange, denn ihre Erstellung erfordert viel Zeit und Hingabe. Ganz zu schweigen von guten Kenntnissen darüber, wie man sie so erstellt, dass sie auf der Website schnell geladen werden.
Das obige Beispiel ist einer der Gewinner in dieser Kategorie. Es handelt sich um eine interaktive Infografik, die visualisiert, wie man die besten Landing Pages erstellt. Sie nannten sie Landing Page Highway und das Design passt perfekt dazu.
Wenn man sich mit Kunst und Design beschäftigt, kommt man an der Bauhaus-Bewegung nicht vorbei. Das Video oben ist eine animierte Infografik über die Geschichte der Bauhaus-Bewegung.
Dem Thema treu bleibend, ist das Design einfach, minimalistisch und sehr bauhausmäßig. Diese hübsche interaktive Infografik von 99designs ist ein großartiges Beispiel dafür, wie ein kurzes Video anstelle einer statischen Grafik den Unterschied ausmachen kann.
Die Online-Publikation National Geographic hat eine interaktive Infografik veröffentlicht, die alle neuen Wolkenkratzer zeigt, die bis Ende 2020 in Manhattan gebaut werden.
Die Infografik scrollt horizontal auf einer Webseite und ist in Abschnitte unterteilt, die in 3D betrachtet werden können. Die Gebäude sind je nach Baujahr farblich gekennzeichnet und werfen sogar Schatten auf den Central Park!
Bei diesem Beispiel handelt es sich nicht um eine leicht zu erstellende interaktive Infografik. Um diese Art von Design zu erstellen, müssen Sie einen Fachmann beauftragen. Es wird es jedoch wert sein!
Ein Großteil der visuellen Inhalte, die wir derzeit im Internet sehen, sind Videospielen nachempfunden, die den Nutzern ein fesselndes Erlebnis bieten, indem sie erstklassige Geschichten mit Interaktivität verbinden.
Dieser animierte und interaktive Beitrag zum Beispiel zieht den Leser von Anfang an mit verblüffenden Grafikeffekten und leuchtenden, lebendigen Farben in seinen Bann. Der Betrachter kann dann das Tempo des interaktiven Stücks mit Hilfe der Pfeile auf der rechten Seite steuern.
Ein bemerkenswertes Merkmal dieses innovativen Werks ist die Verwendung von überwiegend flachen Farben zur Erstellung von 3D-Designs und die Verwendung von interaktiven Diagrammen, auf die Sie zugreifen können, indem Sie auf das Symbol neben dem Namen der Art klicken.
Diese animierte GIF-Infografik von Tabletop Whale ist lehrreich und unterhaltsam zugleich.
Die Idee ist, die Aufmerksamkeit des Publikums auf den Social Media-Kanälen mit Hilfe von Mikro-Animationen zu wecken und das Erlebnis zu simulieren, eine echte Gruppe von lebenden, atmenden, wunderschönen Schmetterlingen zu sehen.
Unser Team bei Visme hat diese interaktive Infografik erstellt, um 7 verschiedene Design-Tools zu vergleichen, die heute verfügbar sind. Sie war Teil eines Blogbeitrags, in dem wir Designtools verglichen haben.
Es handelt sich um ein interaktives Tortendiagramm mit größenveränderten Abschnitten, die bestimmte Aspekte der Informationen darstellen. Wenn Sie auf einen Teil klicken, wird die Legende eingeblendet, die die Besonderheiten dieses Design-Tools anzeigt.
Wenn es etwas gibt, was moderne Leser und Zuschauer mögen, dann ist es die Freiheit der Wahl.
Diese interaktive Infografik gibt dem Betrachter die Freiheit, die verschiedenen Informationsebenen zu erforschen und so tief zu gehen, wie er möchte – oder oberflächlich zu bleiben.
Warby Parker ist ein Unternehmen, das dafür bekannt ist, neue Wege zu gehen.
Dieser Jahresbericht zum Beispiel dreht den Spieß um. Anstatt die üblichen Zahlen über die Leistungen des Unternehmens im vergangenen Jahr zu liefern, werden die Zuschauer aufgefordert, ihren eigenen Bericht zu erstellen.
Diese animierte Infografik verwendet wunderschöne, aber eindringliche Hintergrundmusik und Grafiken, um dem Betrachter eine wirkungsvolle Botschaft zu vermitteln.
Sie trifft genau den richtigen Ton und setzt genau die richtige Menge an Animationen, grafischen Elementen und Text ein, um eine aussagekräftige und wirkungsvolle Darstellung von Informationen zu schaffen.
Diese atemberaubenden bewegten Infografiken sind unglaublich schön und informativ zugleich. Sie kombinieren ein elegantes, professionell wirkendes statisches Design mit anderen animierten Elementen und erzeugen so eine einzigartige, auffällige Datenvisualisierung.
Diese einfache, aber kunstvoll gestaltete animierte Infografik verwendet nur schwarze und weiße Grafikelemente und verblüfft den Betrachter durch gut durchdachte Übergänge, die nahtlos von einem Konzept oder einer Idee zur nächsten führen.
Wie schon bei den vorangegangenen animierten Infografiken zeichnet sich auch diese durch den gekonnten Einsatz kreativer Übergänge und die harmonische Kombination von Text, Animation und Erzählung aus.
Wenn Sie sich die Übergänge ansehen, werden Sie feststellen, dass es keine abrupten Stopps gibt, keine unsteten Übergänge von einer Idee zur nächsten.
Diese Motion-Graphics-Montage kombiniert reale Bilder mit animierten Infografiken, was ihr eine besondere dreidimensionale Qualität und kreative Note verleiht. Dies zeigt, dass die Kombination scheinbar unterschiedlicher Elemente tatsächlich zu einer attraktiven Infografik führen kann, wenn sie auf die richtige Weise miteinander verwoben wird.
Schon inspiriert?
Nachdem Sie 23 atemberaubende animierte und interaktive Infografiken gesehen haben, möchten Sie jetzt wahrscheinlich Ihre eigenen erstellen. Mit Visme können Sie interaktive Inhalte mit Popups und Animationen erstellen, indem Sie Vorlagen verwenden oder von Grund auf neu entwerfen.
Sobald Ihre animierte oder interaktive Infografik fertig ist, können Sie sie in Ihre Website einbetten, damit Ihre Nutzer damit interagieren können. Zur Weitergabe in sozialen Medien laden Sie ein JPG herunter und leiten Sie sie auf einen Live-Link weiter.
Sie werden überrascht sein, wie positiv die Reaktionen von Lesern und Followers ausfallen werden.
Vergessen Sie nicht, uns zu zeigen, was Sie geschaffen haben!
Gestalten Sie visuelle Markenerlebnisse für Ihr Unternehmen egal ob Sie ein erfahrener Designer sind oder gerade erst damit beginnen.
Testen Sie Visme kostenlos
