Empathisches Webdesign

Jeder hat schon mal etwas von Empathie gehört. Jeder hat auch eine grobe Vorstellung von der Bedeutung dieses Wortes. Aber was genau hat Empathie mit Webdesign zu tun und warum ist es sogar wichtig dafür? Das erkläre ich dir in diesem Blogartikel.

Was ist Empathie?

Laut dem Anthropologen und Psychologen Paul Ekman gibt es zwei Arten von Empathie.

Die emotionale Empathie beschreibt, wenn du die Gefühle einer anderen Person übernimmst. Du fühlst also, was der andere fühlt (Beispiel: Ein süßes Baby lacht und du muss automatisch mitlachen).
Die kognitive Empathie ist dagegen für Webdesigner wichtig, denn sie beschreibt die Möglichkeit sich in einen Menschen hineinzuversetzen und seine Gefühle und Motive zu verstehen, auch ohne die Gefühle zu übernehmen. Auf diese Weise kann der Webdesigner das Verhalten des Menschen voraussagen und seine Absichten verstehen.

Empathie im Webdesign

Was hat Empathie also mit Webdesign zu tun? Ein Webdesigner muss den Nutzer einer Website kennen – mit Empathie gelingt es, seine eigenen Motive und Einstellungen auszublenden und sich auf den Nutzer zu konzentrieren.

Ein gutes Beispiel für den Einfluss von Emotionen beim Webdesign ist die Flugbuchung über die Seiten Seat24 und Opodo. 
Wenn du bei Seat24 einen Flug gebucht hast, erscheint ein Hinweis, bevor du deine persönlichen Daten eingeben musst. Nämlich: „Eine gute Entscheidung! Buchen Sie jetzt und Sie werden schon bald unterwegs sein!“
An der gleichen Stelle erscheint bei Opodo der Hinweis: „Bleiben Sie dran! Die Preise können wieder steigen. Sichern Sie sich das Angebot, bevor es weg ist.“

Bemerkst du den Unterschied? Bei Seat24 steigert sich deine Vorfreude auf die bevorstehende Reise, während du bei Opodo eher unter Druck gesetzt wirst und nervös deine Daten eingibst.

Designelemente an der gleichen Stelle mit der gleichen Funktion können also die unterschiedlichsten Gefühle beim Nutzer hervorrufen – je nachdem, wie du sie gestaltest. Aus diesem Grund ist es wichtig, dass man sich als Webdesigner in die Lage des Nutzers hineinversetzt und sich fragt, wie das jeweilige Element an dieser Stelle auf einen selbst wirken würde. So vermeidest du negative Gefühle und ein mögliches Verlassen der Website.

Du solltest dafür sorgen, dass der Nutzer sich wohl fühlt und seine Erwartungen erfüllt werden.

Die Definition für „Empathisches Design“ lautet also:

Empathisches Design ist ein nutzerzentrierter Design-Ansatz, welcher die Gefühle des Nutzers gegenüber einem Produkt in den Vordergrund stellt.

Wann ist eine Website empathisch?

Der Nutzer kommt zuerst – diese Einstellung musst du einnehmen, wenn du mit dem Design einer Website beginnst.
Selbst eine gut funktionierende Seite kann vom Empathie-Ansatz profitieren. Es ist ratsam, sich darüber zu informieren, was deine Kunden brauchen und sich in die Lage des potentiellen Kunden zu versetzen und „hinter das Marketing zu schauen“.

Es gibt einige konkrete Elemente, die beim empathischen Design zum Einsatz kommen:

Hilfe

Der Aspekt des Helfens ist ein zentrales Element. In einem echten Geschäft wirst du schließlich auch Personal finden, welches dir im Notfall helfen und dich beraten kann. Genau so sollten auch Nutzer auf deiner Website bei Bedarf beraten werden können.
Entweder du integrierst einen Live-Chat, der von Mitarbeitern geführt wird, oder du verwendest einen Chatbot. Chatbots basieren auf künstlicher Intelligenz und sind rund um die Uhr verfügbar. Die virtuellen Assistenten können Nutzern dabei helfen, zu finden was sie suchen.

Eine weitere Möglichkeit, dem Nutzer zu helfen, besteht in der Augmented Reality. Ein gutes Beispiel hierfür ist die Seite von Mister Spex, auf welcher Nutzer ein Foto von sich hochladen können, um dann verschiedene Brillenmodelle aufzuprobieren – und sich dann leichter entscheiden zu können.
IKEA bietet unter anderem eine App an, mit welcher sich die Möbelstücke direkt in der Wohnung anzeigen lassen.
Diese Möglichkeiten vereinfachen dem Nutzer die Kaufentscheidung und machen einen Kauf somit wahrscheinlicher.

Menschlichkeit

Ein weiterer wichtiger Faktor für empathisches Webdesign ist Nahbarkeit. Lasse deine Nutzer merken, dass die Website von Menschen gemacht ist. Dies gelingt beispielsweise durch individuelle Texte oder kleine Interaktionen, die den Nutzer zur Conversion führen.

Wenn der Nutzer ein Formular falsch ausfüllt oder ein anderer Fehler auftritt, solltest du nicht generische Ausrufezeichen oder Warnhinweise verwenden.
Formuliere lieber selbst Sätze wie: „Oh nein! Das hat leider nicht geklappt! :(„ um den Nutzer in der Situation der Frustration oder Enttäuschung abzuholen. So erhöhst du die Chancen, dass er er noch einmal probieren möchte.

Auch Fehlerseiten für nicht gefundene Seiten können menschlich gestaltet werden. Vermeide langweilige 404-Fehlerseiten und zeige Mitgefühl.
Etsy schreibt zum Beispiel: „Herrje! Leider konnten wir die Seite nicht finden, nach der du suchst.“
Direkt darunter befindet sich ein Suchfeld, welches den Nutzer animiert, noch einmal zu suchen.

Selbst wenn der Nutzer die Website verlassen möchte, kannst du menschlich wirken. Integriere Pop Ups, die dem Nutzer sagen: „Warte, geh nicht!“ Oder „Kannst du uns helfen, besser zu werden?“ Dies wirkt viel persönlicher als „Bewertung hinterlassen“.

Der Faktor der Menschlichkeit ist übrigens auch für Sprachassistenten enorm wichtig. Nicht umsonst versucht man Siri, Alexa und co. immer menschlicher wirken und klingen zu lassen.
Sie müssen ebenfalls empathisch wirken, damit wir uns von ihnen helfen lassen wollen.

Vorausdenken

Entscheidungen bedeuten Energieverlust. Je mehr Entscheidungen ein Nutzer treffen muss, desto wahrscheinlicher ist es, dass er das Nutzererlebnis als negativ empfindet. Wenn du bei Zalando nach einem „roten Pullover“ suchst, wirst du hunderte oder tausende rote Pullover angezeigt bekommen. Die wenigsten haben Lust, sich alle Pullover anzuschauen und sich dann zu entscheiden.

Daher solltest du überlegen, welche Entscheidungen du dem Nutzer abnehmen kannst. Hier spielt das sogenannte Anticipatory Design eine Rolle – das Anticipatory Design will Optionen reduzieren und Entscheidungen somit vereinfachen oder ganz abnehmen.

Netflix merkt sich beispielsweise, welche Serien du schaust und schlägt dir basierend darauf weitere interessante Serien vor.
Auch Amazon hat den Kaufprozess wesentlich vereinfacht: Durch den „One-Click-Button“ kommt der Nutzer viel schneller ans Ziel.

Der Designprozess

„If I had asked people what they wanted, they would have said faster horses.“ Dieses Zitat von Henry Ford beschreibt das Problem, vor welchem viele Designer stehen. 
Die Nutzer selbst haben sich so an gewisse Dinge gewöhnt, dass ihnen gar nicht in den Sinn kommt, dass es bessere Lösungen geben könnte. 
Aus diesem Grund ist es wichtig – wenn möglich – den Nutzer beim Umgang mit der Website direkt zu beobachten. So fallen Außenstehenden häufig Dinge auf, die Nutzer selbst schon gar nicht mehr wahrnehmen.
Befragungen und Gespräche sind ebenfalls gute Methoden, um wichtige Informationen zu erhalten.

Empathy Map

Das Modell der Empathy Map hilft dabei, sich in die Lage des Nutzers hineinzuversetzen. Es besteht aus sechs Fragen, die man sich beantworten sollte:

1. Was sieht die Person? Dazu zählt auch die Umgebung. Diese Frage hilft dir, zu verstehen, in welcher Situation der Nutzer die Seite betrachtet.
2. Was hört die Person?
3. Was denkt und fühlt die Person?
4. Was tut und sagt die Person? Welche Aktionen führt die Person aus? Was schreibt sie im Netz?
5. Welche Probleme, Sorgen und Bedürfnisse hat die Person?
6. Welches Ziel verfolgt die Person? Was erwartet sie vom Produkt?

Tipp: Es ist hilfreich aus diesen sechs Fragen auch die Soll-Situation zu bestimmen. Also: Was soll die Person sehen? Was soll sie tun? Und so weiter.

Fazit

Gutes Design wird heute nicht mehr bloß an Ästhetik gemessen. Vielmehr geht es darum, den Menschen in den Mittelpunkt zu stellen und durch empathisches Denken die Bedürfnisse zu befriedigen.
Designer sollten sich dafür Zeit nehmen und den Nutzer wirklich kennen lernen.

Quellen

http://www.empathie-lernen.de/empathie-definition
https://t3n.de/magazin/empathie-webdesign-tipps-fur-nutzerorientierteren-246465/
https://shortiedesigns.com/2016/01/user-empathy-in-web-design/