Mehr Emotion auf Websites

Websites bestehen schon lange nicht mehr nur aus reinen Text-Bild-Kombinationen. Und sie dienen nicht mehr der reinen Informationsvermittlung. In den letzten Jahren hat sich der Trend zum Storytelling und zur Emotionalisierung von Websites durch hochwertige und interessante Bilder, Videos, animierte Grafiken und 3D-Darstellungen immer weiter durchgesetzt. Außergewöhnliche digitale Erlebnisse schaffen Aufmerksamkeit, sprechen die Besucher direkt emotional an und laden das Image des Unternehmens bzw. der Marke entsprechend auf. Letztendlich ist das Benutzererlebnis ausschlaggebend dafür, ob die Nutzer auf der Website bleiben oder nicht – und somit erfolgsentscheidend für Ihre Webpräsenz. Und so ist es nicht erstaunlich, dass auch immer mehr unserer Kunden mit uns gemeinsam überlegen, wie sie ihre bestehenden Websites entsprechend erweitern und aufwerten können.

Wir möchten Ihnen hier ein paar Beispiele vorstellen. Die technische Bandbreite ist natürlich wesentlich größer. Wir beschränken uns hier auf ein paar einfache Möglichkeiten und möchten Ihnen in unseren zukünftigen News-Artikeln noch weitere Einblicke in Kundenprojekte geben.

Musste man vor ein paar Jahren bei Websites noch wesentlich stärker auf Ladezeiten achten, sind heute alle technischen Voraussetzungen geschaffen, um mehr Bewegung und dynamische Inhalte auf die Websites zu holen. Die Bandbreite der Internetverbindung hat sich in den letzten Jahren so erhöht, dass lange Ladezeiten – nicht nur auf Desktop-Geräten, sondern ebenso im mobilen Bereich – der Vergangenheit angehören.

Neue Dateiformate wie WebP entwickeln sich gerade zum Quasi-Web-Standard und erreichen bei guter Bildqualität hohe Kompressionsraten und somit deutlich geringere Dateigrößen. Modernes JavaScript und WebGL-Techniken ermöglichen eine einfache und hardwarebeschleunigte Integration von Bewegtbildern und 3D-Grafiken. Und innovative Technologien wie AJAX oder PJAX sorgen dafür, dass die Website nicht immer komplett neu geladen werden muss, verringern die Ladezeiten und steigern die Performance der Seite. Technisch gesehen sind das perfekte Grundlagen dafür, dynamische Inhalte unkompliziert und ohne große Performance-Einbußen in Online-Anwendungen zu integrieren und außergewöhnliche Markenerlebnisse für die Nutzer zu schaffen.

Bereits in den letzten Jahren gab es einen Trend zu großen, emotionalen Bildern auf Websites. Professionelle, ausdrucksstarke Motive machen Lust auf das neue Produkt, zeigen es in der Anwendung oder ermöglichen Einblicke in die Welt rund um das Unternehmen. Durch die Erweiterung statischer Elemente mit Animationen oder Video-Sequenzen schafft man tendenziell noch mehr Emotionen beim Nutzer, als durch rein statische Bilder. Bewegung zieht das Interesse der Nutzer noch stärker auf sich und steigert die Attraktivität Ihrer Website. Ein Beispiel für den Einsatz von emotionalen Videos im Header-Bereich finden Sie hier zum Beispiel auf der Fendt-Website:

-> Video-Header am Beispiel Fendt

Für Kempten Tourismus haben wir mit integrierten Cinemagraphs eine etwas dezentere Art von Bewegung auf die Website geholt. Cinemagraphs (oder deutsch „Cinemagramme“) sind statische Fotos mit dynamischen, bewegten Bereichen. Dadurch entstehen interessante und überraschende Effekte, die man so noch nicht so oft gesehen hat – wie hier z.B. bei den Kässpatzen. Ein Vorteil der Cinemagraphs im Vergleich zu Videos ist der tolle Effekt ohne viel Ladezeit. Mit einfachen Mitteln können Fotos zum Leben erweckt werden.

-> Cinemagraphs am Beispiel Kempten Tourismus

Interaktive Animationen kennt man u.a. von Mouse-Over-Effekten, die dem Nutzer die Interaktivität einer Schaltfläche anzeigen und zum Klicken animieren sollen. Ein weiterer Einsatzzweck sind scrollbasierte Animations-Effekte. Das können zum einen dezente Animationen sein, die der Websites eine moderne und dynamisch Anmutung geben, wie hier für unseren Kunden Hubertus:

-> Dezente Scroll-Animationen am Beispiel Hubertus Mountain Refugio Allgäu

Oder aufwändigere Parallax-Effekte, die perfekt zum Storytelling genutzt werden können, wie hier bei:

-> Storytelling mit Parallax-Effekten am Beispiel Alfred

Unterschiedlich stark ausgeprägte Page-Transitions laden dazu ein, die Seite zu entdecken, wie hier bei der Fendt-Frühkaufkampagne, wenn Sie nach unten scrollen:

-> Page-Transitions innerhalb einer Seite am Beispiel Fendt

Ein relativ neuer und auch etwas anspruchsvollerer Einsatz-Bereich sind Page-Transitions über mehrere (Unter-)Seiten einer Website hinweg. Fließende Übergänge erzeugen den Eindruck einer integrierten Anwendung. Ladezeiten werden überbrückt und eine flüssige Seitenbenutzung gewährleistet. Wie hier von exo ape umgesetzt:

-> Fließende Page-Transitions über mehrere Seiten am Beispiel Aebele Interior

Um Produkte in der digitalen Welt erlebbar zu machen, bieten sich drehbare 3D-Ansichten an. Der Nutzer kann das Produkt selbst erkunden und es von allen Seiten kennenlernen. Die 3D-Ansicht kann bei Bedarf zusätzlich noch mit klickbaren Infobereichen wie Hotspots oder anderen interaktiven Elementen angereichert werden. Oder man hebt das Produkt in eine ganz eigene 3D-Welt. Digitale Messeauftritte, Showrooms und interaktive Simulationen haben insbesondere in den letzten Monaten mit Corona einen neuen Boom erlebt. Aber auch in Zukunft bieten digitale Erlebniswelten spannende Möglichkeiten, die es zu entdecken gilt. ATRIVIO arbeitet eng mit den 3D-Spezialisten von TACTYC Studio zusammen, die unter anderem folgendes Projekt umgesetzt haben:

-> Interaktives 3D-Erlebnis am Beispiel HAIX

Eine andere immer beliebter werdende Möglichkeit, Interaktivität auf Ihrer Website anzubieten, ist die Integration von KI-Technologien, wie z.B. Chatbots. Diese werden über technische Schnittstellen ganz einfach und unkompliziert in Ihre Website integriert und stehen Ihren Kunden rund um die Uhr beratend zur Verfügung. Schnelle Reaktionszeiten und das Gefühl immer einen (digitalen) Ansprechpartner zu erreichen, optimiert einerseits das Kundenerlebnis und entlastet zusätzlich Ihren Kundenservice. Chatbots und Sprachassistenten bieten vielfältige Einsatzmöglichkeiten, wir haben diese u.a. für unsere Kunden im Tourismus-Bereich erfolgreich im Einsatz:

-> Chatbot am Beispiel Kempten Tourismus