Interaktiver Content: Grundlagen, Tipps und Tools

Die meisten Webseitenbetreiber möchten ihre Besucher entweder über ein bestimmtes Themengebiet informieren oder sie unterhalten. Dabei gilt es heute mehr denn je, auf einzigartige, hochwertige Inhalte und Elemente zu setzen, um aus der Masse hervorzustechen. Insbesondere interaktiver Content, also Content, der den User zum Mitmachen motiviert, nimmt dabei einen immer wichtigeren Stellenwert ein.

Der Hintergrund ist einfach: Interaktive Inhalte sprechen die Nutzer auf mehreren Ebenen an. Der Besucher liest nicht einfach nur einen Text oder sieht ein Bild, sondern er kann durch sein Eingreifen ein Element direkt beeinflussen, den Zugriff auf weitere Informationen freischalten oder die eigenen Gedanken kundtun. Auf diese Weise wird der Content zum Erlebnis und bleibt länger im Gedächtnis. Die Interaktion mit der Website und damit auch mit den dahinterstehenden Marken bzw. Diensten ist wesentlich intensiver als beim bloßen Lesen. Und die Chance, dass der Nutzer zufrieden ist und die gewünschte Conversion tätigt, steigt ebenso wie seine Verweildauer.

Im Folgenden bieten wir Ihnen einen Überblick über die verschiedenen Arten von interaktivem Content und stellen Ihnen nützliche Tools vor, um diesen zu erstellen oder in Ihre Website einzubetten.

Welche Formate interaktiven Contents gibt es?

Es gibt viele unterschiedliche Arten von interaktiven Inhalten, die sich auch mit unterschiedlich großem Aufwand in das eigene Webprojekt einbinden lassen. Je nach Format benötigt man dafür verschiedenste Tools oder Programmierkenntnisse. Letztlich führt das dazu, dass die einzelnen Inhaltstypen sich auch hinsichtlich der mit ihnen verbundenen Kosten erheblich unterscheiden. Die folgende Tabelle zeigt einige der interessantesten Lösungen für interaktive Website-Inhalte:

Art des interaktiven ContentsBeschreibung

Aufwand & Kosten

 

Beispiel
KonfiguratorenWeb-Anwendung, über die Nutzer sich mit dem angebotenen Produkt auseinandersetzen können und direkt sehen, wie die gewünschten Konfigurationen aussehen würdensehr hochWunschfahrzeug-Konfigurator von Opel
KalkulatorenTool zur eigenständigen Preiskalkulationhoch bis sehr hochKfz-Steuer-Rechner des Bundesministeriums der Finanzen
QuizWissenstest im Frage-Antwort-ModusgeringZEIT ONLINE Wissenstest des Tages
SlideshowsGalerien mit bewegbaren Bildern zu einem bestimmten Themasehr geringSPIEGEL ONLINE Fotostrecken
Interaktive Diagramme, Karten und InfografikenGrafiken, die bei Klick des Benutzers detaillierte Daten und zusätzliche Informationen präsentierenhoch„Millennials“-Infografik von Goldman Sachs
SpieleWeb-Game oder mobiles Game, das sich thematisch oder gestalterisch an die Marke, den Dienst oder das Produkt anlehntsehr hochMagnum „Pleasure Hunt 2”
Interaktives StorytellingVerknüpfung verschiedener interaktiver Elemente zum Erzählen einer GeschichtehochSevenhills „Nature’s Combinations“

Interaktiven Content erstellen: Das sind die besten Tools

Die vorgestellten Inhaltstypen erfordern allesamt deutlich mehr Aufwand als gewöhnlicher Text- und Bild-Content. Und auch die Kosten sind höher, wobei insbesondere die benötigten Werkzeuge bzw. Dienste zur Erstellung der interaktiven Elemente ins Gewicht fallen. Wer nicht gerade ein Experte auf dem Gebiet der Spieleprogrammierung ist, aber ein Spiel in seine Website integrieren möchte, kommt beispielsweise kaum daran vorbei, eine externe Agentur zu beauftragen. Ähnlich verhält es sich mit professionellen 360-Grad-Videos, die weit mehr Arbeit bedeuten, als es auf den ersten Blick den Anschein haben mag. Der Bedarf an hochwertigem Equipment und der Zeitaufwand für die Nachbearbeitung des Rohmaterials sorgen schnell für Kosten im fünfstelligen Bereich – und das für lediglich ein paar Filmminuten.

Einige Arten interaktiven Contents – wie interaktive Grafiken, Quiz oder Slideshows – können Sie allerdings häufig auch ohne die Hilfe externer Dienstleister produzieren. Zu diesem Zweck benötigen Sie lediglich ein gutes Konzept und das passende Tool. Einige der interessantesten Tools stellen wir daher im Folgenden vor.

Eine Homepage erstellen mit IONOS

MyWebsite ist die schlüsselfertige Lösung für Ihre professionelle Präsenz im Internet inklusive persönlichem Berater!

SSL-Zertifikat
Domain
E-Mail-Postfach

ThingLink

2011 veröffentlichte das finnische Unternehmen ThingLink die Software Rich Media Tags, mit der man Bilder auf Webseiten und Social-Media-Plattformen verlinken konnte. Seitdem hat das Entwicklerteam die Webanwendung, die mittlerweile ebenfalls den Firmennamen ThingLink trägt, stetig weiterentwickelt: Inzwischen lassen sich mit ihr Bilder und Grafiken um zusätzliche Elemente wie Text-Boxen, Bilder, Musik, Videos oder Links erweitern. Zu diesem Zweck steht dem Benutzer ein intuitiv bedienbarer Web-Editor zur Verfügung, in den die Originalgrafik bzw. das Originalbild einfach per Drag-and-drop importiert werden kann. Die hinzugefügten, individuell gestaltbaren Buttons signalisieren dem Betrachter später, wo sich interaktiver Content verbirgt.

Die Basisversion des Bilder-Editors ist kostenlos nutzbar – allerdings bietet sie lediglich einen Standard-Button in verschiedenen Farben zur Auswahl, um ein interaktives Element zu signalisieren. Zudem ist die Anzahl monatlicher Zugriffe auf das Bild bzw. die Grafik auf 10.000 begrenzt. Wer das Design des Buttons und der Zusatzinformationen individuell gestalten möchte, kann auf das Professional-Paket (20 $ im Monat für einen Benutzer – 100.000 Zugriffe) zurückgreifen. Das stellt auch umfangreiche Analyse-Statistiken zur Verfügung und erlaubt es, dass ThingLink-Branding aus der interaktiven Grafik zu entfernen. Mit dem Premium-Paket (125 $ pro Monat für fünf Benutzer und 1 Mio. Zugriffe) lassen sich zudem auch 360-Grad-Bilder und Videos mit interaktivem Content erstellen.

Vorteile Nachteile
✔ Einfache und intuitive Verlinkung externer Inhalte ✘ Englischsprachige Oberfläche
✔ Content ist automatisch responsiv ✘ Interaktive Videos können nur in der Premium-Edition erstellt werden
✔ Kostenfreie Basisversion, die sich optimal eignet, um interaktiven Content zu testen  

Infogram

Wer seinen Nutzern Daten in ansprechender Form präsentieren und dabei auf interaktive Elemente setzen möchte, hat mit Infogram das passende Werkzeug zur Hand. Das Web-Tool gehört mittlerweile dem Unternehmen Prezi, das unter anderem auch eine gleichnamige Präsentationssoftware anbietet. Die Infogram-App selbst bietet diverse Layouts und Bausteine zum Erstellen von interaktiven Infografiken, Karten oder Diagrammen. Manuell oder per Importfunktion können diese um eigene Datensätze ergänzt werden, wobei auch Schnittstellen zu Google Drive, Dropbox und OneDrive vorhanden sind. Die fertigen Grafiken lassen sich anschließend per Einbettungscode in das eigene Webprojekt einbinden oder als JPG- bzw. PNG-Datei herunterladen (nur mit Bezahlpaketen möglich).

Die Basisversion von Infogram kann komplett kostenfrei genutzt werden, um interaktiven Content zu erstellen. Der Umfang der Software ist in diesem Fall aber stark eingeschränkt: Lediglich eine Handvoll Karten (unter anderem USA, Europa und Afrika) und eine kleine Auswahl an Icons und Bildern stehen Ihnen zur Verfügung. Zudem besteht die Pflicht, das jeweilige Projekt öffentlich zugänglich abzuspeichern. Um private Projekte anlegen zu können und den Zugriff auf über eine Millionen Bilder und Icons zu erhalten, werden die kostenpflichtigen PaketePro“ (bis zu 100 Projekte ab 19$ pro Monat), „Business“ (bis zu 1.000 Projekte ab 67$ pro Monat) oder „Enterprise“ (unbegrenzte Zahl an Projekten; Preis auf Anfrage) benötigt. Die Pakete „Business“ und „Enterprise“ erlauben es außerdem, das eigene Logo zu verwenden. Normalerweise enthalten die Grafiken und Diagramme nämlich das Logo von Infogram.

Vorteile Nachteile
✔ Über 35 verschiedene Diagramm-Vorlagen verfügbar ✘ Englischsprachige Benutzeroberfläche
✔ Erstellte Grafiken können unkompliziert per Einbettungs-Code integriert werden ✘ Projekte lassen sich in der freien Version nur öffentlich zugänglich abspeichern
✔ Diverse Schnittstellen zum Importieren eigener Datensätze vorhanden ✘ Infogram-Branding erst ab Business-Paket entfernbar

Qzzr

Qzzr ist eines der besten Tools zur Kreation maßgeschneiderter Quiz, Umfragen und Top-Listen. Über 270.000 Benutzer zählt die Software mittlerweile – darunter so bekannte Institutionen und Unternehmen wie die Fernsehsender ESPN und HBO, die Videoplattform vimeo oder der Energy-Drink-Hersteller Red Bull. Mit dem Tool erstellen Sie in kürzester Zeit Fragen, Antwortmöglichkeiten, erklärende Beschreibungen und Tipps – durch das Hinzufügen von Bildern, Videos oder Audiodateien lässt sich der interaktive Content zusätzlich aufwerten. Fertige Inhalte können verlinkt, per Einbettungscode direkt in das Webprojekt eingebunden oder alternativ mit einem Klick in den verschiedenen sozialen Netzwerken geteilt werden. Diese sind dabei immer auch automatisch für mobile Geräte optimiert.

Qzzr ermöglicht es aber nicht nur, interaktiven Content zu erstellen, sondern liefert auch ausführliche Statistiken zu den User-Aktivitäten. So erfährt man beispielsweise, wie viele Nutzer einen Quiz absolviert oder an einer Umfrage teilgenommen haben, wie viel Zeit sie dies im Durchschnitt in kostete und ob sie den Quiz oder die Umfrage komplett durchgearbeitet haben (Completion-Rate) – wer eine Call-to-Action mit dem Inhalt verbunden hat, erfährt darüber hinaus auch die Conversion-Rate.

Wer lediglich ein einfaches Quiz oder eine kleine Umfrage für seine Website benötigt, kann auf das kostenfreie Basic-Paket zurückgreifen. Für professionellen, interaktiven Content sollten Sie jedoch das Pro-Abonnement (299 $ im Jahr) abschließen. In der Pro-Version enthält der Quizz lediglich einen kleinen Hinweis auf Qzzr (während in der Basis-Version beispielsweise auch in geteilten Inhalten die Brand auftaucht). Außerdem kann man die automatische Empfehlung anderer Quiz und Umfragen aus dem Qzzr-Netzwerk abstellen. Möchte man keinerlei Hinweis auf das Tool bzw. den Anbieter, dann ist das nur mit der Enterprise-Version möglich, die preislich noch über der Pro-Version liegen dürfte. Einen Pauschalpreis gibt es für diese nicht, die Kosten müssen vom Unternehmen erfragt werden.

Vorteile Nachteile
✔ Auch mit der kostenfreien Variante können beliebig viele, responsive Quizze erstellt werden ✘ Englischsprachige Nutzeroberfläche
✔ Enge Verknüpfung mit Analyse- und Lead-Management-Features ✘ Komplette Entfernung des Qzzr-Brandings nur im Enterprise-Plan möglich
✔ Einfache Integration medialer Elemente wie Bilder, Videos oder GIFs  

Cincopa

Der 2006 gegründete Multimedia-Plattform-Anbieter Cincopa offeriert Lösungen zur Integration und Verwaltung von Medieninhalten in Webprojekte. Nutzer können damit ihre Website um maßgeschneiderte Video-Portale, Podcasts oder Slideshows erweitern. Cincopa stellt zu diesem Zweck einerseits spezielle Web-Editoren zur Verfügung, mit deren Hilfe sich der gewünschte interaktive Content erstellen lässt. Andererseits bietet das Unternehmen auch die benötigten Hosting-Ressourcen für die verwendeten Mediendateien (Audio, Video, Bilder etc.). Zudem gibt es mehrere Möglichkeiten zur Einbettung der fertigen Inhalte – wie z. B. via HTML-Code, Landing-Page, Verlinkung oder CMS-spezifischem Plug-in (u.a. WordPress, Joomla, Blogger, Drupal, Wix).

Zur Gestaltung des gewünschten interaktiven Mediencontents kann der Cincopa-Benutzer aus diversen Templates wählen: So gibt es unter Anderem Vorlagen für Collagen, Slideshows, Videoplayer, Playlists oder Timelines, die alle bereits in der kostenfreien Version verfügbar sind. Dieser Basistarif ist jedoch auf eine Domain, 50 Bilder- und jeweils drei Audio- und Video-Dateien sowie einen Gigabyte Traffic begrenzt. Zudem ist das Branding „Powered by Cincopa“ im Content zu sehen. Wer also regelmäßig interaktiven Content erstellen und veröffentlichen will, sollte eines der kostenpflichtigen Angebote wählen: „Startup“ (1 Domain, 5 Video-/Audio-Dateien, 1.500 Bilder, 10 GB Traffic für 99 $), „Plus“ (5 Domains, 50 Videos, 200 Audio-Dateien, 2.000 Bilder, 100 GB Traffic für 25 $ im Monat) oder „Corporate“ (Unbegrenzte Domains, 500 Videos, 1.000 Audio-Dateien, 5.000 Bilder, 400 GB Traffic für 99 $ im Monat).

Vorteile Nachteile
✔ Diverse Templates für maßgeschneiderten Audio-, Video- und Bilder-Content ✘ Englischsprachige Nutzeroberfläche
✔ Intuitive Web-Editoren ✘ Hosting der Dateien auf Servern in den USA
✔ Up- und Downgrade der Bezahlpakete jederzeit möglich  

Adobe Spark

Adobe ist in erster Linie für seinen Flash Player und seine Creative Cloud (ehemals Creative Suite) bekannt. Mit Adobe Spark liefert das Softwareunternehmen aber auch eine hauseigene Lösung für interaktives Storytelling im World Wide Web. Das Kreativ-Paket besteht aus den drei Tools Spark Post (für einfachen Bilder-Content), Spark Video (für interaktive Videos) und Spark Page (für Web-Stories). Der Nutzer kann also frei wählen, ob er beispielsweise ein Foto mit Text und Designfiltern optimieren, hochwertige Werbe- oder Informationsclips erstellen oder eine interaktive Geschichte erzählen möchte. Kunden der Creative Cloud bzw. von Adobe Stock oder Lightroom haben dabei die Möglichkeit, diese mit den Spark-Web-Apps zu verknüpfen.

Um die eigenen Projekte mit Inhalten zu füllen, können Sie selbstverständlich auch eigenes Bildmaterial hochladen und verwenden. Außerdem lassen sich Überschriften, Textblöcke und Buttons erstellen und an gewünschter Stelle in den Web-Stories positionieren. Durch die Wahl eines Themes lässt sich darüber hinaus das Design beeinflussen. Um Clips zu importieren, müssen Sie lediglich die jeweilige URL angeben. Der Content kann entweder über den automatisch generierten Link geteilt (integrierte Funktionen für Facebook und Twitter), per E-Mail versandt oder per Code in die eigene Website eingebettet werden. Die Nutzung der Spark-Anwendungen, die auch als iOS-Apps zur Verfügung stehen, ist komplett kostenlos – Creative-Cloud-Abonnenten können aber z. B. das Branding entfernen.

Vorteile Nachteile
✔ Sehr einfach und intuitiv nutzbar ✘ Inhalte können nicht heruntergeladen, sondern müssen bei Adobe gehostet werden
✔ iOS-Apps verfügbar ✘ Begrenzte Designoptionen (z. B. Schriftgröße nicht anpassbar, Fonts an Theme gebunden)
✔ Mit Creative Cloud kombinierbar ✘ Englischsprachige Benutzeroberfläche

ContillaCreator

Seit 2011 unterstützt die Contilla GmbH ihre Kunden bei der Konzipierung und Durchführung von Content-Marketing-Kampagnen. Mit ContillaCreator (ehemals InteractiveCreator) bietet das in Deutschland beheimatete Unternehmen auch eine einfach zu bedienende Toolbox zur Erstellung verschiedenster Formate interaktiven Contents an. Damit lassen sich beispielsweise interaktive Grafiken, Quiz, Umfragen, Slideshows, Kontaktformulare oder Spiele gestalten. Zusätzlich enthält ContillaCreator Vorlagen für saisonale Content-Highlights wie ein hauseigenes Tippspiel für das nächste Fußballturnier oder einen Adventskalender mit individuellen Türcheninhalten. Die neu erstellten Elemente sind dabei automatisch responsiv und lassen sich unkompliziert in die eigene Website oder App einbauen oder in den sozialen Netzwerken teilen.

Benutzer von ContillaCreator können sämtliche Inhaltstypen um nützliche Features wie Social-Media-Buttons, Countdowns oder Verlinkungen erweitern. Es ist außerdem möglich, den interaktiven Content komplett an das Layout und das Design des eigenen Webprojekts anzupassen, um die bestmögliche Marketingwirkung zu erzielen. Um die Inhalte zu integrieren, die auf den Servern von Contilla (in Deutschland) gehostet werden, benötigt man keinerlei Programmierkenntnisse: Während die Einbindung in Facebook als App funktioniert, lässt sich der erstellte Inhalt über ein einfaches HTML-Snippet oder via iFrame in die eigene Website einbinden. Die Toolbox können Sie einen Monat lang kostenfrei testen – anschließend ist der Abschluss eines monatlichen Abonnements (ab 190 €) notwendig.

Vorteile Nachteile
✔ Vereint diverse unterschiedliche Content-Formate in einer Lösung ✘ Zusätzliche Kosten für Grund-Setup (Nutzerprofile, individuelle Stylesheets, Online-Schulung), White-Labeling und Support
✔ Export erhobener Kontaktinformationen möglich ✘ Saisonaler Content nur im Premium-Paket verfügbar
✔ Hosting des interaktiven Contents in Deutschland  

Mapme

Mit dem Web-Editor Mapme lassen sich auch ohne Programmierkenntnisse hochwertige, interaktive Karten erstellen. Der Benutzer hat dabei die Auswahl aus acht verschiedenen Kartenstilen wie z. B. Satellitenbild, Straßennetz oder Natur. Unabhängig von dem gewählten Kartentyp lassen sich beliebig viele Pins hinzufügen, die eine bestimmte Location markieren und Informationen zu dieser preisgeben. Ferner ist es möglich, die Optik des Pins individuell zu gestalten (in den Premium-Paketen sind auch eigene Icons nutzbar) und Bilder, Audio- bzw. Video-Dateien sowie Social-Media-Buttons hinzuzufügen. Je nach gewähltem Layout erscheinen die interaktiven Pin-Inhalte in einem Slider-Menü im unteren Teil der Map (Slider Style) oder in einer Liste auf der linken Seite der Karte (List Style).

Wer Mapme nutzen möchte, um eigenen interaktiven Content für seine Website zu kreieren, ist auf eines der kostenpflichtigen Angebote angewiesen. Die kostenfreie Variante der Webanwendung dient lediglich der Demonstration des Tools und bietet beispielsweise nicht die Möglichkeit, die erstellten Maps zu veröffentlichen bzw. einzubinden. Nutzer haben die Auswahl zwischen den drei Premium-Paketen „Basic“ (ab 19 $ im Monat), „Standard“ (ab 29 $ im Monat) und „Plus“ (ab 49 $ im Monat). Letztgenanntes Paket lässt nicht nur das Pinnen einer unbegrenzten Zahl von Locations zu, sondern gewährt auch Zugriff auf 3D-Effekte für ein interessanteres Kartendesign. Ferner können Besitzer der Plus-Lizenz die Map per CSS anpassen.

Vorteile Nachteile
✔ Location-Pins können individuell gestaltet werden ✘ Englischsprachige Nutzeroberfläche
✔ Alle Karten sind automatisch für mobile Geräte optimiert ✘ Maps lassen sich mit der freien Version nicht veröffentlichen
✔ Integriertes Einstiegs-Tutorial  

Webprojekte mit interaktivem Content – Best Practices und Beispiele

Die präsentierten Tools bieten unterschiedliche Optionen, um das eigene Webprojekt mit einfachen Mitteln und schmalem Budget interaktiver zu gestalten. Finanzstarke Unternehmen haben aber natürlich auch die Möglichkeit, Agenturen damit zu beauftragen, sich um die Erstellung und Pflege interaktiver Website-Inhalte zu kümmern. In jedem Fall verleiht interaktiver Content einer Webpräsenz zusätzliche Attraktivität, sofern er an passender Stelle eingesetzt wird und den Besucher nicht vom eigenen Produkt bzw. Dienst wegführt. Es gilt folglich, den passenden Rahmen für den jeweiligen interaktiven Inhalt zu schaffen und anderseits die richtige Balance zwischen Informations- und Unterhaltungsfaktor zu finden – eine Aufgabe, die auf folgenden Websites mit Bravour gemeistert wurde:

  • Airbnb: In einer interaktiven Infografik mit verschiedenen Bildern, Animationen und Maps stellt der Community-Marktplatz Airbnb den wirtschaftlichen Einfluss seines Services auf die Berliner Wirtschaft vor.
  • Fillory: Mit einer eindrucksvollen interaktiven Map präsentiert die Website welcometofillory.com die Fantasywelt Fillory der Syfy-Serie „The Magicians“ (basierend auf der gleichnamigen Trilogie von Lev Grossman). Ferner gibt es ausführliche Informationen zu den Hauptfiguren sowie verschiedene Minigames und Quiz unter der Rubrik „Quests“. Anlässlich der zweiten Staffel der Serie ließ der Sender die Website durch das Produktionsstudio UNIT9 erstellen.
  • Douglas: Die Homepage der Parfümerie Douglas ist ein gutes Beispiel für den Wert von Slideshows für den E-Commerce. Zusätzlich zu einer automatisch ablaufenden Bildershow, die aktuelle Aktionen und Angebote präsentiert, sind auch verfügbare Marken und empfohlene Produkte in Slideshows verpackt, durch die Besucher der Seite klicken und stöbern können.
  • mymuesli: Mit dem Online-Konfigurator von mymuesli kann der Benutzer sich sein eigenes Müsli aus diversen Zutaten zusammenstellen. Wer sich für eine Müslibasis entschieden und diese mit Früchten, Nüssen, Kernen oder Schokolade verfeinert hat, kann seinen Mix direkt bestellen, abspeichern und mit den anderen Usern teilen.