• Facebook
  • Google+
  • Twitter
  • XING
08.11.2015

Wie der Trend des Flat Designs langsam die Effizienz der Nutzer reduziert

Anklickbare UI-Elemente mit fehlenden oder schwachen visuellen Signifiern haben zur Folge, dass Nutzer mit der Zeit unsicher durch Websites klicken oder surfen. Das reduziert ihre Effizienz und erhöht die Abhängigkeit von kontextuellen Hinweisen und sofortigem Klick-Feedback.

© Ildogesto


by Kate Meyer 
(deutsche Übersetzung) - 08.11.2015 


Nutzeroberflächen mit einem komplett flachen visuellen Design enthalten keine realistischen oder dreidimensionalen visuellen Effekte. Eine weitere Konsequenz des Flat Designs ist das Entfernen von schwerfälligen visuellen Hinweisen, die traditionell verwendet wurden, um den Nutzern Anklickbarkeit zu kommunizieren.

Die Beliebtheit von ultraflachen Nutzeroberflächen ist seit ihrer Glanzzeit im Jahr 2013 gesunken und immer mehr Websites nutzen moderatere Flat 2.0 Designs, in denen Nutzeroberflächen subtile Effekte nutzen, um den Eindruck eines leicht variierten, dreidimensionalen Raums zu erwecken. Trotz dieser Rückkehr zur Mässigung, sehen wir die langfristigen Auswirkungen der weitverbreiteten Nutzung von schwachen Hinweisen auf Anklickbarkeit, die der Popularität von Flat Designs zuzuschreiben sind.

Klick-Signifier: Vor und nach dem Flat Design

Um zu wissen, welche Stellen einer Website sie anklicken können, benötigen Nutzer Signifier: wahrnehmbare Hinweise und Ankündiger, die ihnen dabei helfen, zu verstehen, wie Nutzeroberflächen verwendet werden. Blau unterstrichene Texte sind ein Beispiel für einen traditionellen Signifier eines anklickbaren Links, den sogar extrem unerfahrene Nutzer verstehen.

Zur Zeit des ungezügelten Skeuomorphismus und Realismus im Webdesign, konnten sich Nutzer im Allgemeinen auf offensichtliche – aber häufig hässliche – Klick-Signifier verlassen (wie glänzende, erhöhte Buttons oder Schatten, die Eingabefelder leer erscheinen lassen). Obwohl diese Signifier auf jeder Website variierten, konnten sich Nutzer  normalerweise auf zwei Annahmen verlassen:

  1. Elemente mit starken Signifiern waren wahrscheinlich anklickbar.
  2. Elemente ohne starke Signifier waren wahrscheinlich nicht anklickbar.

Das Flat Design erhöhte die Beliebtheit von klickbaren Elementen ohne (oder mit schwachen) Signifiern. Linktexte, die wie statische Texte aussehen, sind ein Beispiel für einen fehlenden Signifier. Ein Ghost-Button (ein Text mit einem dünnen Rand ohne Hintergrundfarbe) ist ein Beispiel für einen schwachen Signifier – eine subtile Version eines traditionellen Klick-Ankündigers.

Screenshot Burberry E-Commerce Website

Diese e-Commerce Website setzt auf die visuelle Gleichbehandlung des gesamten Texts – unabhängig davon, ob er anklickbar ist oder nicht.

Die Einführung des Flat Designs führte zur verbreitenden Verwendung fehlender oder schwacher Ankündiger, weshalb Nutzer  jetzt mit drei Möglichkeiten konfrontiert werden:

  • Elemente mit starken Signifiern sind wahrscheinlich anklickbar.
  • Elemente mit schwachen Signifiern sind manchmal anklickbar. (Der visuelle Effekt könnte als Signifier verwendet worden sein oder rein ästhetische Zwecke haben, die für das Interaktionsdesign nicht relevant sind.)
  • Elements ohne starke Signifier sind manchmal anklickbar. (Der Designer könnte den Signifier absichtlich weggelassen haben oder das Element könnte nicht anklickbar sein.)

Screenshot vor und nach der Einführung des Flatdesigns (Erkennbarkeit der Elemente)

Der kontaminierende Effekt von schwachen und fehlenden Ankündigern

Diese neue Situation beeinflusst langsam die Art, auf die Nutzer im Internet mit anklickbaren Elementen interagieren und wir beginnen, während unserer Nutzertests Hinweise auf sich verändernde Verhaltensmuster zu sehen.

Nutzer sind gezwungen, Websites zu erkunden, um herauszufinden, welche Dinge anklickbar sind. Sie pausieren ihre Aktivität häufig, um den Mauszeiger über Elemente zu ziehen – in der Hoffnung, dynamische Klick-Signifier zu sehen – oder klicken versuchshalber, um potenzielle Links zu finden. 

Diese Verhaltensweise ist analog zum Verhalten von Laborratten in Experimenten zur operanten Konditionierung: Wenn eine Ratte in zufälligen Intervallen ein Leckerli erhält, nachdem sie eine bestimmte Handlung durchgeführt hat, wird die Ratte diese Handlung – in der Hoffnung auf mehr Futter - wiederholen. Auf ähnliche Weise haben Nutzer entdeckt, dass ein Klick auf Elemente ohne starke Signifier manchmal funktioniert. Wie Laborratten, führen Nutzer zufällige Klicks durch, solange sie von Zeit zu Zeit dafür belohnt werden.

Obwohl sich Nutzer mit dieser explorativen Verhaltensweise normalerweise auf Nutzeroberflächen zurechtfinden, sind sie dennoch gezwungen, zusätzliche Arbeitsschritte zu absolvieren, und werden von ihren Hauptzielen abgelenkt, ohne dafür eine greifbare Belohnung zu erhalten.

Nutzer verlassen sich stärker auf Feedback, nachdem sie auf ein Element geklickt (oder getippt) haben. Wenn Nutzer nicht darauf vertrauen, dass Dinge anklickbar sind, benötigen sie nach dem Klick eine sofortige Bestätigung. Falls zwischen einem Klick und einer Änderung des Systems eine Verzögerung auftritt, fragen sich Nutzer, ob das Element tatsächlich anklickbar war – und könnten sogar aufgeben und stattdessen auf einen anderen potenziellen Link klicken. (Laut den Richtlinien für die Antwortzeit von Websites, bedeutet „sofortiges“ Feedback nach einem Klick, dass es innerhalb von 0,1 Sekunden angezeigt wird). Häufige Beispiele für Feedback inkludieren:

  • Farbliche Veränderungen,
  • das Hinzufügen eines „gedrückten“ Effekts für einen Button,
  • Fortschrittsanzeigen oder
  • Status-Updates (wie ein Gesamtpreis des Warenkorbs, der sich als Reaktion auf die Handlung eines Benutzers ändert, oder eine Benachrichtigung, die die Aktion bestätigt)

Screenshot Velasca

Welche Elemente sind in diesem Footer einer mobilen Website anklickbar? Welche sind es nicht? Im Rahmen einer Usability-Testsitzung, wusste es ein Benutzer, der Schuhe kaufen wollte, nicht. Er klickte mehrmals auf die oberste Kategorie (Shop), um zur Liste aller Produkte zurückzukehren. „Ich weiss nicht, ob es funktioniert oder nicht, wenn ich auf Shop klicke...“ Nur die Unterkategorien Men und Women sind verlinkt, es gibt allerdings keine Ankündiger, die einen Unterschied kommunizieren. Das Urteil des Benutzers: „Nette Webseite, sie ist allerdings nichts wert, wenn ich nichts kaufe.“

Nutzer sind stark von kontextuellen Hinweisen abhängig, um die Anklickbarkeit zu bestimmen. In einem Umfeld, in dem keine Klick-Signifier vorhanden sind, suchen Nutzer nach anderen Hinweisen, die ihnen dabei helfen, interaktive Elemente zu identifizieren. Sie suchen nach „Indizien“ (um einen Rechtsbegriff zu verwenden) – Hinweisen, die einen Rückschluss erfordern, um zu einem Urteil zu kommen, vergleichbar mit einem Fingerabdruck an einem Tatort. Kontextuelle Hinweise zu verarbeiten, zwingt Benutzer, mehr Zeit und Mühe aufzuwenden, um die verfügbaren Optionen zu verstehen.

Diese kontextuellen Klick-Hinweise können folgendes beinhalten:

  • Die Sprache, die in Textelementen verwendet wird (z.B. Begriffe, die auf eine Handlung hinweisen, wie Jetzt kaufen oder Finden)
  • Die Platzierung von Elementen (z.B. horizontal nebeneinander platzierte Wörter oder Sätze im oberen Bereich einer Website sind normalerweise die globale Navigation)
  • Umgebende Elemente (z.B. ein Wort, das selbst nicht auf Anklickbarkeit hindeutet, aber neben einem ähnlich designten Wort platziert wurde, das häufig verlinkt wird, wie Kontakt und Standorte)

Sie könnten sich fragen: ist es gut, dass Nutzer gezwungen sind, genauer auf die Sprache und die Platzierung von Designelementen auf dem Bildschirm zu achten? In unserem Kurs über die Grundlagen der Mensch-Computer-Interaktion erwähnen wir, dass eine tiefgreifende Verarbeitung besser für das Gedächtnis ist, als eine oberflächliche Verarbeitung (anders ausgedrückt: es ist besser, die Bedeutung und den Kontext von Texten zu verarbeiten, als nur die oberflächlichen Aspekte des Designs, wie die Textfarbe, zu erfassen). Allerdings hat die tiefgreifende Verarbeitung eine höhere kognitive Belastung zur Folge: Nutzer müssen alle zusätzlichen Informationen, die sie nicht benötigen, in ihrem Arbeitsgedächtnis speichern. Es erhöht auch die Frustration und gibt Nutzern das Gefühl, zu hart an einer Aufgabe zu „arbeiten“, wodurch sie diese mit grösserer Wahrscheinlichkeit abbrechen. Wenn Nutzer ihre Aufmerksamkeit vor allem der Detektivarbeit zum Auffinden von Klick-Hinweisen widmen, steht ihnen eine geringere Bandbreite zur Verfügung, um mehr über Ihr Unternehmen und Ihre Produkte zu lernen.

Junge Erwachsene und Klick-Hinweise

Einige Designer argumentieren, dass es in Ordnung ist, wenn ältere Nutzer Flat Designs als nicht intuitiv einstufen, da flache Nutzeroberflächen auf jüngere Nutzer abzielen, die „sie verstehen“. Als wir ähnliche Sessions mit jungen und älteren Erwachsenen verglichen, die an der Forschung für unseren Kurs über Designen für Millennials teilnahmen, fanden wir heraus, dass junge Erwachsene (18-30 Jahre) anklickbare Elemente tatsächlich besser finden konnten, als ältere Erwachsene – sogar wenn diese keine oder schwache Signifier aufwiesen. Besonders fiel auf, dass junge Erwachsene mögliche Ziele schneller identifizieren.

Es gibt mehrere mögliche Gründe für dieses Phänomen, wobei jede Kombination dieser Gründe zutreffend sein könnte.

  • Junge Erwachsene sind subtile Platzierungshinweise gewöhnt.
  • Junge Erwachsene haben häufiger mit flachen Benutzerflächen oder anderen explorativen Benutzerflächen (wie Computerspielen) zu tun.
  • Junge Erwachsene erkennen Elemente, die normalerweise anklickbar sind, besser und erlernen neue Designmuster schneller.

Trotz ihrer Fähigkeit, durch klickbare Elemente mit fehlenden oder schwachen Signifiern zu navigieren, gefällt jungen Erwachsenen diese Unsicherheit genauso wenig, wie jeder anderen Nutzergruppe.

Junge Erwachsene scheinen sich stark darauf zu verlassen, den Mauszeiger über verschiedene Elemente zu ziehen, um deren Anklickbarkeit zu bestimmen. Als sie gefragt wurde, woher sie wusste, welche Elemente auf einer Website anklickbar waren, antwortete eine Nutzerin: „Indem ich darüber scrollte... so wusste ich es. Ansonsten wusste ich es nicht. Manche Dinge errät man. Es ist aber schön, wenn Links fettgedruckt sind und man sie erkennt. […] Es ist schwierig, wenn man glaubt, dass etwas ein Link ist, obwohl es keiner ist. Und dann muss man herausfinden, wie man das Ziel auf andere Weise erreicht.“

Ein weitere junger Erwachsene beantwortete dieselbe Frage mit: „Ich weiss es nicht [was ein Link ist]. Ich beginne einfach zu klicken und bete, dass es funktioniert.“

Screenshot einer Musikfestivals-App

Obwohl sie dieses Programm eines Musikfestivals auf einem mobile Gerät las und sich nicht auf Mouseover-Ankündiger, die Anklickbarkeit kommunizieren, verlassen konnte, erriet eine junge Erwachsene korrekt, dass sie auf die Namen der Künstler tippen kann, um weitere Informationen über sie zu erhalten.

Klick-Vertrauen in einer Welt der Klick-Unsicherheit schaffen

Hier ist die schlechte Nachricht: Jakob’s Law der Nutzererlebnisse im Internet besagt, dass „Nutzer mehr Zeit auf anderen Websites als auf Ihrer Website verbringen.“ Erlernte Verhaltensweisen und Erwartungen werden von Website zu Website transferiert. Auch wenn Ihre Website kein minimalistisches oder flaches Design verwendet, werden Ihre Nutzer wahrscheinlich durch Designs, die sie an anderer Stelle verwendeten, beeinflusst und könnten daher unnötigerweise klicken oder den Mauszeiger über Elemente ziehen, um potenzielle Ziele zu identifizieren. Die suboptimalen Verhaltensweisen, die Ihre Nutzer  erlernen, um sich fehlenden und schwachen Signifiern auf anderen Websites anzupassen, werden uns wahrscheinlich noch länger begleiten.

Hier ist die gute Nachricht: diese neuen Verhaltensmuster sind nicht das Ende der Welt. Sie bedeuten nur, dass Sie sie in Ihren Designs berücksichtigen müssen. Und hier ist noch eine gute Nachricht: Sie müssen nicht zu den grellen, realistischen Effekten vergangener Zeiten zurückkehren, um Anklickbarkeit zu kommunizieren. Sie können Nutzern eine wunderschöne, einfache Benutzeroberfläche präsentieren und ihnen das Gefühl geben, die Aktionen, die ihnen zur Verfügung stehen, zu verstehen und die Kontrolle darüber zu behalten.

  • Wir empfehlen Ihnen, immer einige visuelle Signifier für anklickbare Elemente zu verwenden – egal, ob sie konventionelle, starke Ankündiger, wie blaue Links, oder subtilere, schwächere Signifier (wie Ghost-Buttons) verwenden. Unabhängig von der gewählten Ästhetik des Designs, sollten Sie unsere Richtlinien zur Kommunikation von anklickbaren Objekten befolgen. Die Kommunikation von Anklickbarkeit ist gut, um Nutzern Kontrolle zu geben, ausserdem kann sie sie zu Handlungen motivieren, von denen sie ansonsten gar nicht wissen, dass sie zur Verfügung stehen.
  • Für primäre Elemente und Funktionen sollten Mouseovers nicht die einzige Möglichkeit sein, um einen Signifier zu sehen. Mouseover-Signifier sind für sekundäre Inhalte in Ordnung, sofern sie sich in den Workflow eines Benutzers einfügen. Auf einer eCommerce-Website verstärkt ein subtiles Lupen-Symbol, das in der Ecke eines Produktfotos erscheint, sobald der Nutzer den Mauszeiger darüber zieht, die Erwartung, dass das Bild durch einen Klick vergrössert wird.
  • Falls Sie visuelle Signifier aus ästhetischen Gründen vermeiden möchten, stellen Sie sicher, dass Sie starkes Feedback liefern. Sofortiges, auffälliges Feedback ist für die Usability immer notwendig, wird aber noch wichtiger, wenn Nutzer  nicht sicher sind, ob Dinge anklickbar sind. Wenn Nutzer unsicher auf Dinge klicken, suchen sie sofort nach einer Bestätigung, dass sie die richtige Wahl getroffen haben. 
  • Wie immer sollten Ihre Entscheidungen von den Charakteristika Ihrer Nutzer beeinflusst werden. Falls Sie für jüngere Nutzer designen, könnten Abläufe auch ohne starke Klick-Hinweise schnell verstanden werden – akzeptieren Sie allerdings die Konsequenz, dass Ihre Nutzer  das Gefühl haben, die Benutzeroberfläche weniger „unter Kontrolle“ zu haben. Die beste Möglichkeit, um zu ermitteln, wie Ihre Nutzer tatsächlich mit Ihrer Benutzeroberfläche interagieren, sind wie immer Nutzerforschung und Analysen.
  • Suchen Sie nach kontextuellen Hinweisen auf Ihrer Benutzeroberfläche. Es reicht nicht mehr aus, eine Überschrift einfach nicht zu unterstreichen, um zu kommunizieren, dass sie kein Link ist. Nutzer  klicken mit grösserer Wahrscheinlichkeit auf Elemente ohne Ankündiger, da sie in der Vergangenheit sicher schon einmal eine Situation erlebt haben, in der dasselbe Elemente keinen Signifier aufwies, aber dennoch anklickbar war.

Schlussfolgerung

Glauben Sie bitte nicht, dass die Anpassungsfähigkeit Ihrer jüngeren Nutzer an schlecht designte Nutzeroberflächen ein Freibrief für nachlässige Nutzeroberflächen ohne Signifier ist. Wenn Nutzer nicht sicher sind, welche Dinge anklickbar sind, verlieren sie die Selbstsicherheit, die so wichtig für ein positives Erlebnis ist. Sie müssen langsamer arbeiten, um herauszufinden, wohin sie als nächstes surfen können, was eine unnötige Erhöhung ihrer kognitiven Belastung darstellt.

Der Grund für minimalistische und flache Designs ist der Wunsch, hässliche Ablenkungen aus der Benutzeroberfläche zu entfernen, damit sich Nutzer  auf die Inhalte und ihre Aufgaben konzentrieren können. Es ist ironisch, dass der Missbrauch dieser Designstile Nutzer einbremst, da sie gezwungen werden, gründlich darüber nachzudenken, welche Optionen ihnen zur Verfügung stehen.

Dieser Artikel ist der zweite von zwei Artikeln über das Flat Design. Lesen Sie hier den ersten Artikel: Flat Design: Seine Ursprünge, seine Probleme und warum Flat 2.0 für Nutzer besser ist.

(Mehr über die speziellen Verhaltensweisen der Millennial-Generation im Internet und die Einstellung dieser Nutzer  gegenüber Websites   erfahren Sie in unserem ganztägigen Kurs Designen für Millennials. Mehr über Signifier erfahren Sie in unserem ganztägigen Kurs Prinzipien der Benutzeroberfläche, die jeder Designer kennen sollte.)

 

© Deutsche Version. Institut für Software-Ergonomie und Usability AG. Alle Rechte vorbehalten.

Kommentare auf diesen Beitrag

    Keine Kommentare

Kommentar hinzufügen

Die mit * gekenzeichneten Felder sind zwingend auszufüllen