Icons: Vorteile, Design, Usability
Kommentare

Icons sind  heutzutage die Grundlage für die Funktionen vieler Anwendungen. Je enger die Zuordnung zwischen Symbolen und der Sache, die sie repräsentieren, desto leichter sind sie zu verstehen und desto besser ist ihre Benutzerfreundlichkeit.

Das Verständnis eines Icons basiert auf früheren Erfahrungen des Nutzers. Aufgrund des Fehlens einer Norm für die Verwendung von den meisten Symbolen sind daher Beschriftungen notwendig, die die Bedeutung kommunizieren, um eine Mehrdeutigkeit zu reduzieren beziehungsweise auszuschließen.

Sinn und Zweck von Icons

Neben der Vermittlung von Markenpersönlichkeit durch Farbe und Stil eines Symbols, müssen Icons in einer grafischen Benutzerschnittstelle in erster Linie Bedeutung kommunizieren.

Per Definition stellen Icons eine visuelle Darstellung eines Objektes, einer Aktion oder Idee dar. Wenn das Objekt, die Aktion oder Idee dem Nutzer nicht sofort klar ist, stellt das Symbol lediglich einen, für den Nutzer verwirrenden und frustrierenden, Blickfang dar – purer visueller Lärm – der den Benutzer bei der Bearbeitung von Aufgaben behindert.

Usabilitypapst Jakob Nielsen hat in einer jüngsten Usabilityuntersuchung herausgefunden, dass viele Symbole existieren, die ein Design verbessern können. Allerdings gibt es mindestens genaus so viele Symbole, die Usability-Probleme verursachen.

Denn viele Symbole sind nicht selbsterklärend oder werden in einem missverständlichen Kontext verwendet, sodass die gewünschte Funktion, die sie repräsentieren sollen, von dem Großteil der User nicht auf Anhieb erfasst und verstanden wird.

Die Vorteile der Verwendung von Icons in einem grafischen Design liegen auf der Hand:

  • Icons stellen gute Ziele dar, da sie in der Regel so bemessen und groß genug sind, um leicht in einem User Interface mit dem Finger oder auch mit einem Maus-Cursor ausgewählt werden können.
  • Icons sind platzsparend: Symbole sind kompakt genug, um sie in Symbolleisten und Toolboxen unterzubringen und somit auf einem relativ kleinen Raum anzuzeigen.
  • Icons sind schnell zu erkennen.
  • Icons müssen für eine internationale Verwendung nicht übersetzt werden, sofern sie im kulturellen Kontext bekannt sind.
  • Icons sind optisch ansprechender als Text und können bei einem gelungenen Design die Ästhetik einer Anwendung verbessern.
  • Icons unterstützen die Idee einer Produktfamilie, wenn die gleichen Symbole im gleichen Stil an mehreren Stellen verwendet werden.

Usabilityprobleme von Symbolen

Selbstverständlich hat jedes visuelle Design seine eigenen Probleme im Rahmen der User Experience, denn jedes Design ist anders. Um die UX der eigenen Anwendung zu erhöhen, gibt es allerdings eine große Anzahl verwendbarer Symbolen, die von Natur aus leichter zu verstehen sind als andere. Allerdings sind universal verständliche Icons selten. Es gibt lediglich ein paar wenige Symbole, die allgemein und universal von Benutzern anerkannt sind. Dies sind zum Beispiel Symbole für Home, ein Drucker-Icon für das Drucken und ein Umschlag für Mails oder Nachrichten sowie eine Lupe für die Suche.

Die meisten Icons bleiben allerdings weiterhin mehrdeutig für die Benutzer, aufgrund ihrer Assoziation mit verschiedenen Bedeutungen in verschiedenen Schnittstellen. Eine fehlende Standardisierung erschwert leider die vereinfachte Interpretation von Icons, da sich Nutzer nicht darauf verlassen können, dass die verwendeten Symbole stets die gleiche Funktionalität repräsentieren.

Der Versuch einer Kategorisierung

Nach Nielsens Untersuchungen hilft eine grobe Klassifikation von Symbolen, die bei der Erstellung eines guten Designs berücksichtigt werden sollte. Er nimmt eine Unterteilung in drei Kategorien vor.

Resemblance Icons

Resemblance Icons stellen ein physikalisches Objekt ähnlich dar. Die größte Usability-Herausforderung bei der Darstellung eines Resemblance Icons ist somit, ein Symbol zu entwerfen, dass tatsächlich, dem vorgesehenen Objekt ähnlich sieht, was gar nicht so einfach ist, da nur ein ziemlich begrenzter Raum für die Darstellung zur Verfügung steht. Der Briefumschlag als Symbol für eine elektronische Nachricht ist, laut Nielsen, ein solches Resemblance Icon.

Reference Icons

Das Abbilden einer Referenz oder Analogie zu einem Objekt wird mit Reference Icons vorgenommen. Eine Büroklammer für die Dateikompression ist ein solches Referenz Icon. Da eine Zustandveränderung mit Symbolen schwerlich kommuniziert werden kann, wird versucht auf die Funktion des Zusammendrückens Bezug zu nehmen. Reference Icons werden auch manchmal als Symbolische oder Index Icons bezeichnet. 

Hierbei ist man stets mit dem Problem konfrontiert, ob die Benutzer die Abstraktion und Zuordnung zwischen der Referenz und dem verwendeten System tatsächlich verstehen und das mentale Modell richtig interpretieren.

Arbitrary Icons

Beliebig gewählte Icons haben lediglich Sinn gemäß einer existierenden Konvention. So sind beispielsweise Verkehrszeichen oft willkürliche Symbole, die allerdings aufgrund ihrer standardisierten und internationalen Verwendung als eine gute Ideenquelle bei dem Entwurf von Icons dienen können. Ein Warndreieck als Symbol für eine Warnung zu verwenden, ist daher naheliegend. Trotz allem sind laut Nielsen Arbitrary Icons für Nutzer am schwersten zu erlernen, es sei denn die Bedeutung des Symbols ist tatsächlich weit verbreitet. Ein Fragezeichensymbol als Icon für Fragen zu verwenden, scheint zwar sehr naheliegend, allerdings eignet sich das Symbol eher für eine Hilfefunktion.

Nielsen nennt als schlechtes Beispiel einer jüngst durchgeführten Usability-Untersuchung ein Uhrensymbol, das für ein Geschichts-Feature in einer Anwendung verwendet wurde. Denn weit verbreitet ist die Verwendung der Uhr als Resemblance Icon, um beispielsweise Tageszeit, eine Weckfunktion oder die Angabe eines Startzeitpunktes zu repräsentieren. In der untersuchten Anwendung wurde die Uhr allerdings als Reference Icon verwendet und von den Nutzern daher nicht verstanden. Das Symbol war in diesem Zusammenhang zu abstrakt gewählt.

Internationale Verwendung von Icons

Für eine internationale Verwendung eignen sich Resemblance Icons am Besten. Laut Nielsen haben diese in der Regel die höchste Usability. Allerdings nur, sofern das verwendete Objekt im entsprechenden Land auch tatsächlich genau so aussieht. Sonst ist Verwirrung vorprogrammiert. Auch ein Arbitrary Icon kann sehr gut funktionieren, so lange das Symbol seit geraumer Zeit und an mehreren Stellen konsistent verwendet wird.

Wer versucht seinen Nutzern die Funktion für ein willkürlich gewähltes Icon anzutrainieren, ist zum Scheitern verurteilt und hat das Konzept des intuitiven Designs nicht verstanden. Ist man sich bei dem Entwurf eines Icons unsicher, ob es von den Nutzern intuitiv richtig interpretiert wird, sollte einen Usabilitytest zu Rate ziehen. Erst mit User-Feedback, kann man sich sicher sein, dass die UX einer Anwendung tatsächlich gelungen ist.

Aufmacherbild: Usability in word collage Foto via Shutterstock / Urheberrecht: Ismariza Zack

Unsere Redaktion empfiehlt:

Relevante Beiträge

Meinungen zu diesem Beitrag

X
- Gib Deinen Standort ein -
- or -