Icon-Gestaltung

Wie wir im Abschnitt Potenziale interaktiver Nutzungsschnittstellen beschrieben haben, vollzog sich der Übergang von rein textuellen zu grafischen Nutzungsoberflächen über die Verräumlichung der Nutzungsschnittstellen¹⁷. Das betrifft zum einen die Möglichkeit, eine Schreibmarke zu positionieren, und zum anderen die Fähigkeit, eine „Textschlange“ in Objekte zu zergliedern. Durch diese Möglichkeit der räumlichen Repräsentation werden Objekte zu manipulierbaren Einheiten der Nutzungsoberfläche, die insbesondere positioniert und bewegt werden können. Allerdings ist die Ausnutzung des Raums dabei noch stark durch den Medientyp Text eingeschränkt. Die durch die festgelegte Leseflussrichtung bei Lautschriften bedingte Sequenzialität verhindert, dass sich semantische Zusammenhänge durchgängig räumlich-visuell in Text abbilden lassen. Dies ändert sich mit der Einführung von Icons als einzelne unabhängig voneinander platzierbare und manipulierbare visuelle Objekte einer Nutzungsoberfläche. Diese Bildchen, die für Objekte oder Funktionen stehen, sind allgegenwärtig. Allein schon aufgrund der schieren Masse ist bei ihrer Gestaltung und Auswahl Sorgfalt geboten.

Von der Wortbedeutung her verweist Icon, oder deutsch Ikon, genau wie das manchmal auch verwendete Wort „Piktogramm“ auf bildhafte Darstellungen, die eine Ähnlichkeit zu dem aufweisen, wofür sie stehen. Das klingt zunächst plausibel, doch die Sache ist nicht so einfach. Man verwendet zum Beispiel ein Bild einer Diskette, um damit den Vorgang des Speicherns auszudrücken. Doch hat das Bild der Diskette eine Ähnlichkeit mit dem Vorgang des Speicherns? Wie könnte es das, denn das Speichern bzw. den Vorgang selbst kann man ja nicht unmittelbar sehen, also in diesem engen Sinne auch nicht abbilden.

Zudem sind viele Icons keine Abbilder, sondern frei gestaltete Grafiken. Icons wie die obigen haben keine Ähnlichkeit mit Objekten, die für einen Vorgang stehen könnten. Dennoch ist es üblich, auch wenn nicht im Wortsinn korrekt, diese Bildchen Icons zu nennen. Wir werden solche Icons weiter unten als „gegenstandslose Icons“ beschreiben.

Vor- und Nachteile von Icons

Mit Icons sind eine Vielzahl von Fehlannahmen verbunden. Eine davon ist, dass gut gewählte Icons selbsterklärend seien. Mit nur einem Blick habe man sie erfasst und wisse dadurch besser als bei einer textuellen Benennung, wofür sie stünden. Leider ist es nicht so einfach, denn die Bedeutung von Icons muss immer erlernt werden, während es Text in Grenzen ermöglicht, seine Bedeutung selbst zu erklären. Zusätzlich zur angeblichen Selbsterklärungsfähigkeit von Icons kommt die Erwartung, dass sie im Gegensatz zu Text international verständlich seien. In der Tat ist es so, dass es viele Symbole gibt, die international verbreitet sind und gleichermaßen verstanden werden. Denken Sie zum Beispiel an die Piktogramme auf Flughäfen für Ankunft, Abflug oder auch für Aufzüge oder Toiletten. Diese Bilder sind jedoch nicht deshalb international verständlich, weil es Bilder sind, sondern weil man sich international auf die Verwendung eben dieser Bilder geeinigt hat. Es ist eine Konvention, dass international die Darstellung einer Tasse für die Cafeteria steht und dass man zum Beispiel auch in Seoul das Zeichen mit Messer und Gabel als Zeichen für „Restaurant“ versteht, auch wenn Messer und Gabel dort nicht die üblichen Esswerkzeuge sind. Wenn Sie diese Icons verstehen, liegt es also nicht daran, dass sie das Abgebildete erkennen, sondern dass Sie die dahinterstehende Konvention entweder explizit erlernt oder aber sich über die mehrfache Nutzung implizit erschlossen haben (also durch Hypothesenbildung).

So ist es zu erklären, dass Sie auch diese Objekte verstehen, die in Deutschland eher unüblich sind. Sie sind zwar nicht gänzlich unbekannt, treten aber eher seltener auf. Statt des amerikanischen Folders verwenden wir eher einen stehenden Leitz-Ordner. Auch Mülltonnen aus Metall gibt es bei uns selten. Wir kennen sie aber aus amerikanischen Filmen und Serien (zum Beispiel Oscar aus der Tonne bei der „Sesamstraße“). Notizblöcke sehen bei uns üblicherweise nicht so aus, wie auf diesem Icon abgebildet, und Klemmbretter sind bei uns weniger verbreitet als in den USA¹⁸.

Dennoch gibt es eine ganze Reihe von nicht textuellen Icons gegenüber Text:

• Bilder haben einen größeren Gestaltungsfreiraum, um einzelne Objekte prägnant und unterschiedlich zu gestalten. Die Wortbilder von Text (mehr hierzu im Abschnitt Lesen als Hypothesenbildung im Kapitel Typographie) lassen sich nicht frei gestalten und unterscheiden sich oft äußerlich kaum voneinander¹⁹.
• Ein kleines Bild wie ein Icon kann ganzheitlich, also mit einem Blick erfasst werden. Bei Text ist das nicht so. Er muss in einem sequenziellen Prozess gelesen werden.
• Da Bilder räumlich sind, ist es in Bildern leichter möglich, räumliche Verhältnisse auszudrücken. Im Text ist die räumliche Relation nicht immer gewährleistet. Beispiel: In der Wortfolge „Der Apfel ist rechts von der Birne“ etwa widersprechen sich die beschriebene Anordnung der Objekte und die Positionen der Worte im Satz.
• Bilder sind nicht an eine Sprache gebunden. Eine Darstellung einer Birne etwa mag individuell unterschiedlich sein, ist aber nicht davon abhängig, ob man Deutsch, Spanisch oder Chinesisch spricht. Doch Vorsicht: Diese Internationalität gilt nicht für die inhaltliche Bedeutung von Bildern. (Mehr hierzu unter Internationale Icons)
• Bilder sind auch für Personen mit eingeschränkten Lesefähigkeiten zugänglich, wenn sie erlernt haben, wofür sie stehen.
• Bilder können in ihrer Funktion als Abbilder ein konstruktives Potenzial für mentale Prozesse entfalten. Sieht man etwa eine Feder oder eine Diskette, kann dies die Assoziation zum Bearbeiten und Speichern wecken. Die Texte „Bearbeiten“ und „Speichern“ tun das nicht so direkt. Ein Wort muss erst gelesen und verstanden werden, bevor die Assoziation zur damit verbundenen Operation rekonstruiert werden kann. Beim Bild ist dieser Umweg nicht notwendig. Diese Aspekte behandeln wir aufgrund ihrer besonderen Bedeutung für die Gestaltung weiter unten im Abschnitt „Von abbildhaften und nicht abbildhaften Zeichen“.

Auf der anderen Seite hat aber auch Text eine Vielzahl von Vorteilen auf seiner Seite:

• Text ist potenziell eindeutig. Der Text „Datenträgerimage herunterladen“ auf einem Button beschreibt zum Beispiel sehr präzise, was beim Klicken passiert. Ein Bild ist hingegen immer mehrdeutig. Das Bild einer Diskette kann für „Datenträgerimage herunterladen“ stehen, doch es kann auch für „Speichern“ stehen und die Interpretation, dass eine Diskette für „Laden“ stehen könnte, widerspricht zwar üblichen Konventionen, wäre aber allein vom Bild her ebenso denkbar. Ein bekanntes Beispiel für die Mehrdeutigkeit ist das Bild einer Lupe, das für zwei etablierte Funktionen steht, nämlich für das Zoomen (etwa in der Bildbearbeitung) und für das Suchen (wie auf vielen Websites).
• Bei einem Text lässt sich leicht Konkretes und Allgemeines unterscheiden, etwa „Mein Hund Bello“, „Hunde an sich“ oder die abstrakte Kategorie „Haustiere“. Bilder zeigen immer etwas Konkretes, also etwa einen konkreten Hund, stehen aber in der Verwendung oft für etwas Allgemeines.
• Durch Text lassen sich auch gleichartige, also gleich aussehende Objekte eindeutig unterscheiden.
• Eine weitere Konsequenz der begrenzten Ausdrucksmöglichkeiten des Medientyps Bild ist die Tatsache, dass sich Bilder nicht bzw. nur unter Verstärkung der gerade angesprochenen Defizite konstruktiv kombinieren lassen, so wie man z. B. Worte zu Sätzen oder Aussagen zusammensetzt.
• Durch Text sind Temporal- und Kausalzusammenhänge direkt beschreibbar. „Erst speichern, dann ausschalten“ oder „Wenn nicht gespeichert, dann Datenverlust“ sind Beispiele dafür. In einem Bild ist das nicht direkt ausdrückbar. Selbstverständlich kann man mehrere Abbildungen in einer Reihe arrangieren, doch benötigt dies für die Interpretation Regeln, die angeben, wie die beiden Bilder zu „lesen“ sind. Dies würde wiederum über die reine Abbildung hinausgehen.
• Im Text ist eine Negation, zum Beispiel „Nicht speichern“, oder der Ausdruck von etwas nicht Existentem, etwa „Kein Datenträger eingelegt“, möglich. Beides können Sie nicht durch eine Abbildung ausdrücken.

Nimmt man diese Vor- und Nachteile zusammen, muss man konstatieren, dass sich Text und Bild weder einander ausschließen noch der eine durch das andere ersetzbar ist. Vielmehr ergänzen sich Text und Bild gut und sollten daher gemeinsam verwendet werden. Die Menüleiste von Keynote von Apple zeigt unter jedem Icon auch einen Text bestehend aus ein bis zwei Worten, der die Funktion textuell beschreibt. Dies macht es einfacher, die Icons zu erlernen und sich im Zweifelsfalle rückzuversichern, wenn ein Icon nicht wiedererkannt werden konnte.

Ein Designkonflikt und seine Lösung

Dieser Screenshot zeigt die Icons in den sogenannten „Ribbons“ von Microsoft Word unter Windows 10. Er verdeutlicht das Problem, das sich ergeben kann, wenn Text und Bild gemeinsam verwendet werden. Die Kombination braucht recht viel Platz. Bei der von Microsoft gewählten Lösung sind bereits einige der Texte so dicht aneinander geschrieben, dass eigentlich mehr Platz spendiert werden müsste. Platz steht aber nicht unbegrenzt zur Verfügung. Er wird eingeschränkt von der Bildschirmgröße an sich, dem Platzbedarf für eine übersichtliche Darstellung, aber auch durch die Abwägung der Platzaufteilung zwischen Nutzungsschnittstelle und dem Inhaltsbereich der jeweiligen Anwendung. Steht zu wenig Platz zur Verfügung, um alle Funktionen in Text und Bild darzustellen, gilt es einen Design-Konflikt auszutarieren. Wir müssen dazu an dieser Stelle etwas vorgreifen und zwei Forderungen erwähnen, die wir erst in späteren Kapiteln intensiver besprechen.

Ohne zu weit vorzugreifen, wollen wir kurz erläutern, was diese Forderungen konkret bedeuten, denn nur dann können wir uns Gedanken über eine angemessene Lösung des Konflikts machen. Bei der Erschließbarkeit geht es darum, dass am Bildschirm schnell erfasst werden kann, welche Objekte vorhanden sind, welche manipuliert werden können und dass es erkennbare Hinweise darauf gibt, wie Funktionen und Inhalte erreicht werden können, die aktuell nicht sichtbar sind. In der Konsequenz erfordert das, nicht ausschließlich Icons anzuzeigen, denn das Erschließen wird erschwert, wenn ein Icon unbekannt ist oder vergessen wurde, wofür es steht. Übersichtlichkeit auf der anderen Seite verlangt, dass die Objekte eines Bildschirms schnell und strukturiert erschlossen werden können. Neben der Begrenzung der Anzahl der Objekte braucht es dazu auch zusätzlichen Platz, um Objekte voneinander absetzen bzw. gruppieren zu können.

Der Design-Konflikt zwischen Erschließbarkeit (kein Icon ohne Text) und Übersichtlichkeit (möglichst gut strukturierter Bildschirmaufbau) ist jeweils im Kontext auszutarieren. Im Edge-Browser von Windows 10, wie in vieler heute üblicher Software auch, hat man sich für die Maximierung des Inhaltsbereichs, also des Darstellungsbereichs der Websites, entschieden und dafür auf die dauerhafte Anzeige von Button-Beschriftungen verzichtet. Dies ist in diesem Fall auch verschmerzbar, da die Anzahl der Buttons sehr gering ist und diese Buttons zudem sehr verbreitet sind. Wird nun doch eine textuelle Beschreibung gebraucht, weil ein Icon nicht wiedererkannt werden konnte, ist sie durch einen Tooltip verfügbar und erscheint, wenn der Mauszeiger über dem Icon verweilt.

Ein Tooltip ist eine technische Auflösung des Design-Konflikts „Übersichtlichkeit versus Erschließbarkeit“. Anhand dieser Technik lässt sich gut vor Augen führen, wie sehr verschiedene Aspekte der Gestaltung und Forderungen an die Gestaltung zusammenhängen und wie sehr die Anwendung einer solchen Technik abhängig vom konkreten Einsatzfall ist, denn durch die Nutzung von Tooltips werden zwar Übersichtlichkeit und Erschließbarkeit in gewisser Weise versöhnt. Mit dieser Versöhnung gehen aber Nachteile in Form neuer erzwungener Sequenzialitäten einher:

• Tooltips erfordern einen Zwischenschritt und widersprechen damit der Forderung nach Eingabeminimalität, die wir im Kapitel Eingaben genauer besprechen.
• Damit Tooltips beim Überfahren von Objekten mit der Maus nicht stören, erscheinen sie zeitverzögert. Dies widerspricht der Forderung nach Unmittelbarkeit, die wir im Kapitel Rückmeldung besprechen werden.
• Man muss wissen, dass es die Tooltips gibt. Wenn man das nicht weiß und per Zufall einen Tooltip auslöst, entgeht einem die erklärende Beschreibung. Dieser Aspekt ist fast ironisch, widerspricht er doch genau der Forderung nach Erschließbarkeit, die ja durch den Tooltip gelöst werden sollte.
• Von diesen Schwierigkeiten abgesehen gibt es heute das Problem, dass Tooltips in erster Linie eine Maus-Technologie sind, da sie auf dem Verweilen über einem Icon basieren. Die Touch-Umsetzungen sind in aktuellen Mobil-Betriebssystemen sehr uneinheitlich und nicht sehr praktikabel.

Tooltips sollten also keinesfalls immer verwendet werden, denn die Nachteile überwiegen in vielen Fällen die Vorteile. Das verdeutlicht auch obiger Screenshot aus einer Lernplattform. Auf der rechten Seite befinden sich winzig kleine Bearbeitungs-Icons. Diese sind nicht nur aufgrund ihrer geringen Größe schlecht erkenn- und handhabbar, sie sind zudem auch noch unbeschriftet. Es sind zwar Tooltips vorhanden, das heißt, die Icons können über diesen Weg erschlossen werden, doch überwiegen in diesem Beispiel die Nachteile der Tooltips. Zur Beschriftung wäre genügend Platz für zusätzlichen Text vorhanden, was die Nutzung deutlich erleichtern würde²⁰, weil unnötige Zusatzschritte, also unnötige Sequenzialität, vermieden werden.

Eine Icon-Beschriftung und Tooltips schließen sich übrigens nicht aus. In obiger Abbildung haben die Icons eine kurze Beschriftung. Durch Verweilen auf dem Icon oder der Beschriftung erscheint eine zusätzliche, längere Beschreibung der Funktion. Man erhält eine differenziertere Beschreibung der Funktion und kann sich erschließen, welche Funktionalitäten zur Verfügung stehen (siehe Thema Erschließbarkeit).

Von abbildhaften und nicht abbildhaften Zeichen

Icons sind meist mehr oder weniger detaillierte Abbildungen von realweltlichen Objekten. Sie haben jedoch schon Beispiele für Icons gesehen, die keine solchen Objekte darstellen. Oftmals werden in der Praxis Abbildungen und willkürlich gewählte Elemente miteinander verbunden. Schauen Sie sich zur Verdeutlichung das rechts abgebildete Schild für „Rauchen verboten“ an. Bei diesem Schild ist eine Zigarette abgebildet. Die weiteren Bildanteile des Icons – der rote Kreis mit dem Balken – sind nicht abbildhaft, sondern sind ein willkürliches Zeichen, von dem Sie einmal gelernt haben, dass es für „verboten“ steht. Ein im Computerbereich typisches Beispiel für die Mischung von abbildhaften und willkürlichen Elementen ist ein Icon zum Hinzufügen von Personen, zum Beispiel bei der Vergabe von Zugriffsrechten, das etwa aus einem stilisierten Torso eines Menschen (abbildhaft) und einem Plus-Zeichen (nicht abbildhaft) bestehen könnte.

Wir nennen ein Icon dann „abbildhaft“²¹, wenn es ein wahrnehmbares Objekt abbildet. In aller Regel hat das abgebildete Objekt etwas mit dem zu tun, wofür das Icon steht. Wenn das so ist, gibt das Icon einen Hinweis auf die Funktion, das Objekt oder den Vorgang, für den es steht. Wird zum Beispiel ein Icon für die Funktion „Zugreservierung“ gesucht, könnte man zum Beispiel eine stilisierte Sitzreihe abbilden. Die Sitzreihe an sich ist zwar offen für verschiedene Interpretationen, hat jedoch im jeweiligen Kontext hinreichend viel mit der Reservierung von Plätzen in einem Zug zu tun, sodass diese Beziehung als konstruktiver Anlass für eine plausible Spekulation als Zugreservierung dienen kann. Zwar kann man ohne Vorkenntnisse solche Spekulationen nicht in Wissen verwandeln, wenn aber die Bedeutung einmal etabliert worden ist, kann man sich leichter wieder daran erinnern, weil es entsprechende Hinweisreize gibt und damit das Gedächtnis entlastet wird.

Man kann bei der Wahl von Zeichen auch solche wählen, die überhaupt nicht abbildhaft sind. Wenn Sie schon mal in Polen waren, haben Sie sich vielleicht über die dort üblichen Hinweisschilder auf Toiletten gewundert (rechts abgebildet). Im Gegensatz zum bei uns üblichen Zeichen mit einem Mann und einer Frau und einer Begrenzung dazwischen (auch dieses Zeichen bildet nicht Toiletten oder das, was man dort tut, ab), werden in Polen zwei willkürliche Zeichen verwendet: Ein Kreis steht an einer Toilettentür für „weiblich“, ein auf der Spitze stehendes Dreieck für „männlich“. Die Kombination der beiden Zeichen auf einem Schild weist auf eine öffentliche Toilette hin.

Wir nennen Zeichen wie die polnischen Toilettenzeichen arbiträr, da ihr Aussehen keinerlei abbildende Funktion hat. Das Wort „arbiträr“ bedeutet „willkürlich“, was in diesem Fall heißt, dass die Zeichen beliebig gestaltet werden können, unabhängig davon, wofür sie stehen. Insbesondere eröffnet das die Möglichkeit, sie sehr einfach zu gestalten. Einfachheit reduziert den Erkennungsaufwand, weshalb solche Icons gerne verwendet werden. Zu den arbiträren Zeichen gehören auch Buchstaben, Ziffern und die meisten Sonderzeichen.

Auch viele Verkehrszeichen, wie die oben abgebildeten, sind rein arbiträr. Eine Raute zeigt kein Objekt und verkörpert auch keine Visualisierung des Konzepts Vorfahrt. Auch das Dreieck und das Ausrufezeichen sind keine Abbildungen, sondern arbiträre Zeichen. Dass diese Zeichen willkürlich sind, heißt aber nicht, dass die Formen zwangsläufig ohne Bedacht ausgesucht worden wären. Bei Verkehrszeichen ist es etwa wichtig, dass sie schnell wahrgenommen und von der Umgebung unterschieden werden können. Wichtige Verkehrszeichen sind daher zum einen sehr einfach, etwa nur ein Dreieck oder nur ein Kreis, oder verfügen über Formen wie eine Raute oder ein auf der Spitze stehendes Dreieck, die in Land und Stadt typischerweise nicht vorkommen.

Manche Verkehrszeichen bestehen aus Kombinationen von abbildhaften und nicht abbildhaften Elementen. Beim Warnschild für den Bahnübergang (links) ist das offensichtlich. Das rote Dreieck ist ein arbiträres Zeichen, der Zug ist eine abbildhafte Darstellung. Auch das Einfahrt-verboten-Schild rechts besteht aus einem nicht abbildhaften Element, dem Kreis, und einem abbildhaften Element, dem Balken, der entfernt an das Aussehen einer Straßensperrung erinnert. Diese Darstellung ist allerdings bereits stark abstrahiert.

Die Beispiele legen nahe, dass Arbitrarität und Abbildhaftigkeit zwei Pole eines Kontinuums bilden. Doch leider ist es nicht so einfach. Die abgebildete Skala verdeutlicht verschiedene Grade der Abbildhaftigkeit. Die Icons links bilden nichts ab und sind daher nicht abbildhaft. Die Icons rechts bilden ein Objekt ab und haben daher eine hohe Abbildhaftigkeit. Etwas weniger abbildhaft sind die beiden Icons, die Sie wahrscheinlich als Lupe und Briefumschlag erkennen. Sie sind zwar abbildhaft, jedoch nicht in dem Maße, wie die nahezu fotorealistischen Darstellungen am rechten Ende der Skala. Die Zeichen auf der linken Seite sind allesamt nicht abbildhaft, aber nicht alle von ihnen sind arbiträr. Es gibt Zeichen, die zwar nicht abbildhaft, aber dennoch nicht komplett willkürlich sind. Betrachten Sie zum Beispiel den nach Links zeigenden Pfeil und nehmen an, es bedeute „Element aus der rechten Auswahl in die linke Auswahl verschieben“. Außerdem haben Sie das Zeichen, das wie ein auf der Seite liegendes Y aussieht, in der Bedeutung „Fallunterscheidung einführen“. Könnte man nun ohne Weiteres sinnvoll dieses Icons für das Verschieben nach links und den Pfeil nach Links für die Fallunterscheidung nehmen? Wenn die Icons arbiträr, also willkürlich wären, müsste das gehen. Das ist jedoch nicht der Fall. Die Zeichen referieren zwar auf kein Objekt, aber sie visualisieren durch ihr Aussehen das abstrakte Konzept zur Unterstützung der Orientierung und des Bewegens in einem Raum. Dieses Phänomen des Verräumlichens abstrakter Konzepte finden wir auch in sprachlichen Metaphern wie z. B. tiefes Nachdenken oder hohe Abstraktion.²². Sie helfen, das Nicht-Sichtbare in einen räumlichen Zusammenhang zu setzen und damit begreifbarer machen. Wir unterscheiden deshalb bei nicht abbildhaften Icons zwischen „konzeptuellen Icons“ und „arbiträren Icons“.

Die Bedeutung steckt nicht im Zeichen

An den Verkehrszeichen bzw. an ihren abbildhaften Elementen lässt sich gut verdeutlichen, dass eine bildliche Darstellung, obwohl sie etwas Realweltliches abbildet, nicht in sich trägt, wofür diese Abbildung steht. Sie gibt nur einen Hinweis auf die entsprechende Bedeutung.

Dieses Zeichen ist Teil vieler deutscher Verkehrsschilder. Dargestellt ist ein Lkw. Gemeint ist aber nicht ein Lkw, der genau so aussieht wie dieser. Die Darstellung steht stellvertretend für etwas Allgemeineres, nämlich eine ganze Klasse von Fahrzeugen. Gleichzeitig steht das Zeichen aber auch für etwas Konkreteres, das nicht direkt zu sehen ist. Laut Straßenverkehrsordnung bedeutet dieses „Sinnbild“ nämlich „Kraftfahrzeuge mit einer zulässigen Gesamtmasse über 3,5 t, einschließlich ihrer Anhänger und Zugmaschinen, ausgenommen Personenkraftwagen und Kraftomnibusse“. Diese präzise Definition kann nicht in einer Grafik dargestellt werden. Wofür dieses Sinnbild steht, ist nur klar, wenn man es erlernt hat. Eine andere Frage ist, was das Bild bedeutet, denn das wird in diesem Falle nur im Zusammenhang mit dem Rest des Schildes, von dem es ein Teil ist, erschließbar.

Diese beiden Zeichen belegen, dass man aus dem Aussehen nicht die Bedeutung ablesen kann. Das linke Zeichen stammt von einem Schild aus Großbritannien, das rechte ist Teil eines Straßenschilds aus Spanien. Zu sehen ist auf beiden Bildern eine recht altmodische Kamera mit Balgen. Beide Zeichen bilden das gleiche, oder zumindest ein sehr ähnliches, Objekt ab. Die jeweiligen Bedeutungen sind aber sehr verschieden. Das linke Zeichen weist die Fahrer auf Radarkontrollen hin, das rechte auf interessante Fotomotive am Straßenrand.

Dass das gleiche Zeichen in verschiedenen Kontexten unterschiedliche Bedeutungen hat, zeigt sich auch in Nutzungsschnittstellen. In der Abbildung oben sehen Sie abbildhafte Darstellungen. Es ist leicht erkennbar, was sie abbilden, doch ist allein vom Zeichen her nicht klar, wofür sie stehen. Die Lupe steht in Photoshop für die Vergrößerung des Bildes, in Firefox für die Suche, der Pinsel steht in Photoshop für das Zeichnen auf dem Bild und in Word für das Übertragen von Formatierungseigenschaften und die Weltkugel stand in den Systemeinstellungen von Windows 95 noch für die internationalen Einstellungen (Sprache, Währung, Maße etc.), während sie in Windows 7 nun für Internetverbindung steht. Bleibt schlussendlich noch ein Schlüssel. Dieses Icon könnte für alles Mögliche stehen, etwa für das Verschlüsseln einer Datei. Das konkrete Exemplar stammt aus einem Einstellungsfenster des Macintosh, in dem ein Anmeldepasswort vergeben werden kann. Es steht dort für die Funktion, ein Passwort automatisch zu generieren.

Fassen wir zusammen: Auch wenn man erkennt, was auf einem Icon abgebildet ist, kann man allein aus dem Zeichen nicht ableiten, für was es im jeweiligen Kontext steht. Das Abgebildete zu erkennen ist nicht das Gleiche wie seine Bedeutung zu verstehen. Die Bedeutung erschließt sich immer erst durch einen Lernprozess, in dem durch Handeln im jeweiligen Kontext eine Zuordnung etabliert wird, wie ein Zeichen zu nutzen bzw. zu verstehen ist. Icons sind also nicht selbsterklärend, aber sie können unterstützende Hinweise für die Wiedererkennung liefern.

Obschon es wichtig ist zu verstehen, dass Icons nie selbsterklärend sind und man nicht lediglich aus dem Anblick eines Icons ableiten kann, wofür es steht, muss man doch die konstruktiven Eigenschaften herausstellen, die gute abbildhafte Icons mit starkem Hinweischarakter mit sich bringen. Verwendet man etwa eine Feder für einen Editor und eine Schreibmaschine für die Druckfunktion und hat man diese Zuordnung einmal erlernt, dann ist das Wiedererkennen eben dieser Objekte bei späterer Betrachtung ein guter Hinweis auf diese Funktionen, oder, um es mit dem Vokabular aus dem Kapitel Differenzerfahrung zu sagen, eine gute Unterstützung bei der Bildung von Hypothesen darüber, welche Funktionen welchem Element der Nutzungsschnittstelle zugeordnet sind.

Anforderungen an die Icon-Gestaltung

Wir haben festgestellt, dass Icons und Text einander gut ergänzen. Wenn ein geeignetes Icon gewählt wurde, verkörpert dies eine Entlastung beim Wiedererkennen und Erinnern seiner Bedeutung, ohne die Beschriftungstexte explizit lesen zu müssen. Tägliche Erfahrung lehrt uns jedoch auch, dass es sehr auf die Auswahl und Gestaltung der Icons ankommt, denn schlecht gestalte oder ungeschickt ausgewählte Icons können auch mehr irritieren als unterstützen oder Fehlbedienungen provozieren. Basierend auf den Erkenntnissen über die menschliche Wahrnehmung und unseren Überlegungen zu arbiträren, abbildhaften und konzeptuellen Icons leiten wir eine Reihe grundlegender Forderungen an die Icon-Gestaltung ab.

Doch zuvor noch ein Hinweis: Auch wenn wir von „Icon-Gestaltung“ sprechen, wollen wir – wie schon bei den Schriftarten – nicht nahelegen, Icons ohne eine entsprechende Grafikausbildung zu gestalten. Meist ist das Zeichnen von Icons auch nicht erforderlich, weil es viele gute sowohl kostenfreie als auch kommerzielle Icon-Sätze gibt. Das Wissen, das wir vermitteln wollen, ist gleichwohl erforderlich, um eine angemessene und begründete Auswahl einzelner Icons oder ganzer Icon-Sätze treffen zu können. Unsere Betrachtungen dazu orientieren sich an den vier bereits bekannten Forderungen: Wiedererkennbarkeit, Unterscheidbarkeit, Einfachheit und Ablenkungsfreiheit.

Wiedererkennbarkeit durch Abbildhaftigkeit

Wir haben gesehen, dass es nicht möglich ist, aus dem Aussehen eines Icons abzuleiten, wofür es steht. Wenn ein Icon etwas abbildet, das man wiedererkennen kann, kann dieses Wiedererkannte bei späteren Betrachtungen aber ein guter Hinweis auf die Bedeutung sein. Ein solches Icon erleichtert den Prozess und kann gewissermaßen als Abkürzung zum Zuordnen der vorher erlernten Bedeutung betrachtet werden, weil weniger Alternativen beim Hypothesenbilden bedacht werden müssen.

Abbildhafte Darstellungen knüpfen an vertraute Wahrnehmungen an und fördern die Wiedererkennbarkeit bzw. entlasten das Gedächtnis. Wiedererkennbarkeit bedeutet daher bei der Icon-Gestaltung, abbildhafte Icons zu verwenden.

Das Potenzial, dass abbildhafte Icons einen Hinweis auf eine vorher erlernte Bedeutung des Icons beinhalten können, kann sich jedoch nur dann entfalten, wenn das Dargestellte mit dieser Bedeutung auch etwas zu tun hat. Dies ist bei den obigen Icons der Fall. Eine Briefmarke kann daran erinnern, dass das Icon für „E-Mail“ steht, ein Block kann an die Funktionalität eines Editors erinnern und Foto und Kamera sind jeweils gute Hinweise auf Funktionen zur Bilderverwaltung oder zur Bildbearbeitung.

Es gibt leider auch Icons, die abbildhaft sind, deren Abbildung aber keinen Hinweischarakter hat. Eine Erdbeere ist beispielsweise kein Hinweis auf einen Editor und ein Pylon ist kein Hinweis auf einen Mediaplayer. Wenn wir im Folgenden von „Abbildhaftigkeit“ sprechen, gehen wir jeweils davon aus, dass ein Bild mit Hinweischarakter verwendet wird. Bezugslose Bild-Icons wie ein grinsendes Gesicht für den Dateimanager Finder beim Apple Macintosh oder ein Pylon für den VLC-Mediaplayer können aufgrund ihrer Besonderheit sehr auffällig sein, die Argumentation an dieser Stelle ist aber nicht von Interesse.

Voraussetzung für die Wiedererkennbarkeit durch Abbildhaftigkeit ist eine hinreichend detaillierte und auf die übliche Art und Weise dargestellte Repräsentation. Reduziert man die Details zu sehr oder verwendet eigenartige Darstellungsweisen und Perspektiven, besteht die Gefahr, dass die Qualität des Hinweischarakters sinkt. Die rechts abgebildeten Icons sind zwar abbildhaft, doch eher als problematisch zu betrachten. Das linke Bild steht in der Vorschau-Anwendung von MacOS für „Bearbeiten“. Abgebildet ist die Spitze eines Filzstiftes. Gerade durch die Kombination mit dem Kreis ist dies aber schwer zu erkennen. Das rechte Icon wird häufiger als Icon für das Versenden einer Nachricht gesehen. Aber was stellt es dar? Es handelt sich tatsächlich um die abbildhafte Darstellung eines Papierfliegers, jedoch in einer eigenartigen Perspektive direkt von oben.

Unterscheidbarkeit

Um ein Objekt schnell unter vielen anderen herauszufinden zu können, müssen sich diese Objekte optisch gut voneinander unterscheiden. Je geringer bzw. feiner die Unterschiede sind, desto aufwändiger gestaltet sich der Wahrnehmungsprozess, desto mehr Sequenzialität gibt es also. Es gilt daher, unterscheidbare Icons zu verwenden, um unnötigen Erschließungsaufwand und Fehler zu vermeiden.

Diese Icons oben können das Problem mangelnder Unterscheidbarkeit gut verdeutlichen: Sie unterscheiden sich jeweils nur in einem kaum sichtbaren Detail. „Stopp“ und „Alle stoppen“ auf der linken Seite unterscheiden sich außer in der Beschriftung nur in der Anzahl der scheinbar um die Weltkugel herumfliegenden Ordner. Ansonsten sind die recht komplexen Icons identisch. In solchen Fällen gerät das Erkennen schnell zu einem Suchspiel (finde die fünf Unterschiede). Alternativ müsste auch der Text jedes Mal gelesen werden; in diesem Fall wäre das Icon auch verzichtbar.

Einfachheit

Jedes Bildschirmobjekt muss zunächst durch den Wahrnehmungsapparat erschlossen und dann in seiner Gesamtheit erfasst werden. Wenn das dargestellte Gebilde einfach ist, bedeutet das weniger Aufwand für den Wahrnehmungsapparat, als wenn es viele Details wahrzunehmen gilt.

Pure geometrische Formen wie diese Verkehrszeichen sind immer einfach. Sie können schnell und ohne näheres Hinsehen wahrgenommen werden. Bei Verkehrszeichen ist das besonders wichtig, denn sie müssen auch in schnell fließendem Verkehr verlässlich wahrgenommen werden, ohne dass sie die Aufmerksamkeit zu stark binden. Ein Autofahrer sollte nicht damit beschäftigt werden, die Verkehrszeichen erst zu enträtseln bzw. zu entziffern. Die Gestaltungsfreiheit bei der Nutzung arbiträrer Zeichen wird jedoch mit einer mangelhaften Gedächtnisentlastung erkauft.

Arbiträre Zeichen können einfach gestaltet sein, müssen es aber nicht. Da es sich um willkürliche Zeichen handelt, können sie auch beliebig komplex sein. Solche Icons treten jedoch selten auf, denn sie würden eher ein Hindernis als eine angemessene Unterstützung verkörpern. Willkürliche Zeichen bieten aber einen hohen Gestaltungsspielraum, um verschiedene sich teils widersprechende Anforderungen austarieren zu können.

Ablenkungsfreiheit durch Gleichförmigkeit

Im Kapitel Architektur der Wahrnehmung haben wir erläutert, wie sehr einzelne, von der Masse abweichende Objekte präattentiv wahrgenommen werden, also die Aufmerksamkeit auf sich ziehen. In einem Arrangement von Icons will man das im Regelfall nicht, denn kein Objekt soll so gestaltet sein, dass es ablenkt. Es gilt also, die Icons ablenkungsfrei zu gestalten bzw. sie entsprechend auszuwählen.

Damit Icons ablenkungsfrei sind, müssen sie gleichförmig gestaltet werden. Nicht gleichförmig gestaltete Icons werden präattentiv vorausgewählt und werden damit zu optischen Schreihälsen. Oben sehen Sie eine Ansicht der Systemsteuerung von Windows 8. Unter den vielen Icons befindet sich eines, das des Flash-Players, das so auffällig anders als alle anderen gestaltet ist, dass es unweigerlich die Aufmerksamkeit auf sich zieht. Bei der Nutzung der Systemsteuerung muss man jeweils gegen diesen visuellen Schreihals ankämpfen. Das Problem ist nicht nur die rote Farbe, sondern auch, dass es als einziges Icon die komplette Fläche ausfüllt und dadurch größer und präsenter wirkt als die anderen Elemente im Fenster. Das Problem mit diesem auffälligen Icon ist übrigens nicht etwa Microsoft zuzuschieben, denn das Icon des Flash-Players stammt ja nicht von Microsoft, sondern vom Flash-Hersteller Adobe. Die Icons der Windows-8-Systemsteuerung mögen nicht unbedingt ideal sein, aber sie enthalten von Haus aus keine derart ablenkenden Elemente.

Auch die abgebildeten Icons in der Software „Schild-NRW“, die in Schulen in NRW zur Schülerverwaltung eingesetzt wird, sind uneinheitlich. Daher fallen einzelne Icons besonders auf. Die ersten beiden sind im Windows-XP-Stil gehalten, während die anderen einen noch älteren Stil aufweisen. Einige Icons sind überdurchschnittlich bunt, wie zum Beispiel das Icon mit den drei Männchen in grün, rot und blau. Das Fernglas hingegen hat einen überdurchschnittlich hohen Schwarz-Anteil und ist dadurch viel dunkler als die übrigen Icons und damit auch auffälliger.

Der Effekt stark ablenkender Objekte tritt schnell auf, wenn Icons aus verschiedenen Sammlungen kombiniert werden, sei es im Prozess der Gestaltung oder wenn das Icon-Arrangement während der Nutzung an die jeweiligen Bedürfnisse angepasst wird. In solchen Fällen ist es schwierig, robust zu gestalten, wäre aber durch Vorgaben und technische Einschränkungen möglich, etwa der Art, dass die Sättigung von Icons automatisch reduziert wird oder nur monochrome Icons verwendet werden können.

Gestaltungskonsequenz: Reduzierte Icons

Wir haben vier Forderungen zur Gestaltung oder der Auswahl von Icons aufgestellt: Sie sollen einfach, ablenkungsfrei (also gleichförmig), abbildhaft (also wiedererkennbar) und unterscheidbar sein. Es ist nicht einfach, alle unter einen Hut zu bringen. Maximiert man die Wiedererkennbarkeit durch die Verwendung sehr detaillierter Bilder oder Fotos, ist die Darstellung sehr detailreich und erfüllt nicht mehr das Kriterium der Einfachheit. Maximiert man die Gleichförmigkeit, sind alle Icons nahezu identisch, wodurch der Ablenkungseffekt minimiert wird. Unterscheidbarkeit ist dann jedoch nicht mehr erfüllt. Es liegen bei der Icon-Gestaltung also zwei grundlegende Design-Konflikte vor.

Einfachheit versus Wiedererkennbarkeit (oder auch direkt auf Icons bezogen: Einfachheit versus Abbildhaftigkeit)

Einfachheit und Abbildhaftigkeit stehen in einem Widerspruch zueinander. Man kann sich diesen Widerspruch verdeutlichen, indem man ihn systematisch aufschreibt.

• Einfachheit ist gefordert, damit Icons schnell erfasst werden können. Einfachheit bedeutet, dass Icons wenig detailreich sind.
• Wiedererkennbarkeit ist gefordert, um das Abkürzungspotenzial von Icons auszunutzen. Wiedererkennbarkeit wird durch Abbildhaftigkeit realisiert. Abbildhafte Icons sind detailreich.
• Icons müssen beiden Forderungen entsprechend, also zugleich, sehr detailreich und wenig detailreich sein. Das heißt, Einfachheit und Wiedererkennbarkeit stehen über dem Aspekt des Detailreichtums in einem Konflikt zueinander.

Ablenkungsfreiheit versus Unterscheidbarkeit (oder auch direkt auf Icons bezogen: Gleichförmigkeit versus Unterscheidbarkeit)

Auch Ablenkungsfreiheit und Unterscheidbarkeit stehen in einem Konflikt zueinander und auch in diesem Fall lässt sich der Konflikt auf die gleiche Art und Weise aufschreiben:

• Ablenkungsfreiheit ist gefordert, um zu vermeiden, dass ein Element die Aufmerksamkeit grundlos auf sich zieht. Bei Icons erreicht man Ablenkungsfreiheit durch die Gleichförmigkeit, was heißt, dass die Icons wenige Unterschiede untereinander aufweisen sollen.
• Unterscheidbarkeit ist gefordert, damit ein gesuchtes Icon schnell und sicher ausgewählt werden kann. Damit Icons voneinander unterschieden werden können, müssen sie hinreichende optische Unterschiede zueinander aufweisen.
• Icons müssen beiden Forderungen entsprechend, also gleichzeitig, wenige Unterschiede und viele Unterschiede zueinander aufweisen. Das heißt, Ablenkungsfreiheit und Unterscheidbarkeit stehen über dem Aspekt der Menge der optischen Unterschiede in einem Konflikt zueinander.

Die Anforderungen müssen also austariert werden. Wie schwierig das sein kann und wie begrenzt möglicherweise die mit vertretbarem Aufwand erzielbaren Ergebnisse sein können, zeigen wir im nachfolgenden Abschnitt. Dazu gehen wir einmal etwas ausführlicher auf experimentelle Untersuchungen ein, um zu verdeutlichen, dass es wichtig ist, Gestaltungsvorschläge so weit wie möglich zu überprüfen und experimentell abzusichern. Zum anderen zeigt dieses Beispiel auch, dass der damit verbundene Aufwand zum einen sehr hoch ist und zum anderen zeigt, dass es in einem konfligierenden Gestaltungsfeld nicht möglich ist, in kontrollierten Experimenten alle Gestaltungsvariablen isoliert zu untersuchen und, vor allem aufgrund der Designkonflikte, nicht alle Konstellationen des Zusammenspiels der verschiedenen Faktoren unabhängig vom jeweiligen Gestaltungskontext erschöpfend und abschließend zu untersuchen. Eine nur auf experimentellen Befunden basierende Gestaltung ist somit nicht möglich. Entscheidend dafür ist, dass zum Beispiel Fragen nach der Gesamtzahl von Icons im Untersuchungsfeld oder spezifische Fragen nach der Abbildbarkeit anwendungsspezifischer Sachverhalte sowie die Probleme einer robusten Gestaltung bei der Kombination verschiedener Icon-Sätze oder ihrer Anpassung zur Nutzungszeit immer wieder spezifische Gestaltungslösungen erfordern, da sich damit auch die Anforderungen an die Austarierung der Gestaltungskonflikte verändert.

Die für uns gute Nachricht ist jedoch, dass die im Exkurs vorgestellten empirischen Untersuchungen und die Interpretation der entsprechenden Ergebnisse grundsätzlich die von uns vorgestellte Sichtweise bestätigen. Je mehr es also im Prozess der Gestaltung gelingt, die vorgestellten Gestaltungskonflikte auszutarieren, desto eher wird das Ergebnis ergonomisch auch zufriedenstellend ausfallen, solange sie nicht experimentellen Befunden widersprechen.

Untersuchung von Gestaltungsalternativen

Die vier aufgeführten Forderungen auszutarieren ist keinesfalls trivial. Das Austarieren von Gestaltungskonflikten beinhaltet notwendigerweise Prioritäten zu setzen, also festzustellen, ob und bis zu welchem Grad die unterschiedlichen Forderungen jeweils erfüllt bzw. verletzt werden sollten, also in welcher Situation beispielsweise die Abbildhaftigkeit wichtiger ist als die Einfachheit. Dies lässt sich nicht aus isolierten Laborexperimenten ableiten. Man könnte auch sagen, Gestaltung ist im Gegensatz zur reinen Experimentalwissenschaft ein schmutziges Geschäft.

Wir betrachten in der Folge eine Reihe von Untersuchungen des Psychologen Jens Wandmacher und seiner Forschungsgruppe aus der Frühzeit der Gestaltung von Nutzungsschnittstellen Anfang der 1980er Jahre. Zu dieser Zeit war die Verwendung von Icons noch neu, sodass die Ergebnisse nicht von Konventionen und Vorerfahrungen geprägt waren und eine Vielzahl von Gestaltungsalternativen in Betracht gezogen wurde. Die Untersuchungen und Abwägungen münden in das Konzept der reduzierten Icons, das wir zum Ende dieses Kapitels vorstellen.

In ihren experimentellen Untersuchungen ging es zunächst um die Frage, ob Icons grundsätzliche Vorteile gegenüber Textkommandos haben und inwiefern die Gestaltung eines Icons für seine performante Nutzung eine Rolle spielt. Dazu haben sie eine Reihe von Experimenten durchgeführt.

Im ersten Experiment, das wir uns anschauen wollen²³, ging es darum, zwei Darstellungen eines Kommandosatzes, bei dem einer aus geschriebenen Worten und der andere aus Icons bestand, miteinander zu vergleichen. Der Einfluss von Vorkenntnissen wurde dadurch ausgeschlossen, dass durch Training gleiche Voraussetzungen geschaffen wurden. Der Kommandosatz und die Bilder waren den Versuchspersonen vor dem Beginn des Experiments bereits bekannt. Im Experiment wurde ihnen dann beispielsweise die Aufgabe präsentiert: „Sie wollen ein Dokument drucken“. Im Anschluss daran bekamen sie entweder ein Textmenü oder einen Icon-Satz zu sehen. Um die Aufgabe zu lösen, mussten sie die Nummer des entsprechenden Elements auf einer Nummerntastatur eingeben²⁴.

Die Abbildung oben zeigt die Ergebnisse des Experiments. Zweierlei fällt auf: Zum einen schneiden die Icons im Experiment durchweg besser ab als die Wortkommandos. Zum anderen gibt es sehr große Unterschiede bei der Performanz der einzelnen Icons, während die Wortkommandos alle recht nahe beieinander liegen. Betrachtet man die entsprechenden Icons im Einzelnen, lässt sich eine Hypothese formulieren:

Kann es sein, dass das Icon für „Graphik“ so schlecht abschneidet, weil es so komplex ist, und die Icons für „Löschen“ und „Schreiben“ so gut, weil sie so einfach sind? Weitere Untersuchungen waren angesagt.

Einfache Formen trotz Abbildhaftigkeit

In einem weiteren Experiment verglichen Arend und Wandmacher²⁵ verschiedene Arten von Icons miteinander. Die Wortkommandos kennen Sie teilweise aus dem vorherigen Experiment. Die abbildhaften Icons zeigen sehr detaillierte Zeichnungen von Büroobjekten. Die arbiträren Icons bestehen aus einfachen geometrischen Figuren, die keinen abbildhaften Charakter aufweisen, also kein Objekt abbilden. Am interessantesten für uns sind die oben rechts abgebildeten Icons, die auf ihre globalen Eigenschaften reduziert worden sind. Globale Eigenschaften haben nichts mit Internationalität zu tun. Gemeint ist vielmehr, dass das jeweilige Icon lediglich die „groben“ Eigenschaften wie die allgemeine Form und Lage eines Objekts darstellt und nicht „kleine“ Eigenschaften wie die Oberflächentextur oder spezifische Details.

Im Experiment wurden nun diese Icon-Formen miteinander verglichen. Der Aufbau des Experiments war ähnlich wie beim zuvor beschriebenen Versuch. Zu bewältigen waren eine einfache Such- und Auswahlaufgabe und eine komplexere Dreifachaufgabe, bei der drei Elemente in bestimmter Reihenfolge auszuwählen waren. Gemessen wurden wieder die Zeiten bis zur Eingabe der korrekten Ziffer. Wenn nun die Abbildhaftigkeit für die Performanz eines Icons ausschlaggebend wäre, müssten die detailreichen abbildhaften Icons am besten abschneiden. Wenn es die Einfachheit wäre, müssten die arbiträren und die reduzierten Icons gleichermaßen gut abschneiden, denn beide zeigen einfache Formen.

Das Resultat des Experiments zeigt, dass die komplexen, detailreichen, abbildhaften Icons mit großem Abstand am schlechtesten, sogar schlechter als die Wortkommandos, abschneiden. Der Nachteil ihres Detailreichtums ist offenbar so groß, dass sie den erhofften Abkürzungscharakter von Icons gänzlich verspielen oder gar ins Gegenteil verkehren. Erlernte arbiträre Icons schneiden im Test besser ab, als man vermuten sollte. Die für uns wichtigste Folgerung aus dem Experiment ist aber, dass die auf ihre globalen Eigenschaften reduzierten Icons offenbar ein idealer Kompromiss zwischen der Einfachheit der arbiträren Icons und der Detailliertheit der abbildhaften Darstellungen sind. Sie sind wiedererkennbar genug, um das Gedächtnis zu entlasten bzw. die Erinnerung zu unterstützen, und einfach genug, um nicht zu viel Erkennungsaufwand einzufordern.

Unterscheidungen im Globalen statt im Lokalen

Die globalen Eigenschaften von Icons standen auch in der nächsten Untersuchung im Mittelpunkt des Interesses. Untersucht wurden Icons, die sich in ihren globalen Eigenschaften von solchen abgrenzten, die nur Unterschiede in ihren lokalen Eigenschaften, also in Details, aufwiesen.

Diese Abbildung zeigt einen typischen Icon-Satz, bei dem sich die Icons nur in einer lokalen Eigenschaft unterscheiden. Global, also auf ihre Grundform reduziert, zeigen alle fünf Icons die gleiche Form, nämlich einen Zylinder, eine konventionalisierte Darstellung für eine Datenbank.

Diese Untersuchung wurde an Icons für die Textverarbeitung durchgeführt. Die Unterscheidung zwischen rein abbildhaften und rein arbiträren Icons spielte in diesem Falle keine Rolle, da die Icons für typische Textmanipulationen sich teils nur sehr schwer rein abbildhaft darstellen lassen. Neben abbildhaften Elementen müssen also auch konzeptuelle Elemente wie Pfeile und bekannte arbiträre Zeichen wie das Durchstreichen genutzt werden. Die entstandenen Icons sind laut Arend, Muthig und Wandmacher „definitely not self-explanatory“. Sie müssen auf jeden Fall erlernt werden. Dafür geben sie aber, wenn man sie kennt, einen optischen Hinweis auf die Funktion und unterstützen damit die Wiedererkennung.

Der Experimentalaufbau des Versuchs ist wieder vergleichbar mit den vorherigen Untersuchungen²⁶. Die Versuchspersonen saßen vor einem Tastenfeld, das den Positionen der Icons entsprach, und hatten wiederum eine Such- und Auswahlaufgabe durchzuführen. Das Ergebnis der Untersuchung zeigt ein eindeutiges Bild. Die reduzierten Icons, die sich in ihren globalen Eigenschaften unterscheiden, schnitten erheblich besser ab als die abbildhafteren Icons, bei denen die Unterschiede nur in lokalen Merkmalen bestehen. Letztere sind optisch so komplex und die jeweiligen Unterschiede so gering, dass ihre Performanz jener der Wortkommandos sehr nahekommt. Schaut man sich die gefundenen Ergebnisse im Detail genauer an, stellt man bei den reduzierten Icons eine große Bandbreite fest.

Unter den reduzierten Icons hat „Wort suchen“ bei Weitem am besten abgeschnitten. Es ist laut Wandmacher das „unterschiedlichste“ von allen, denn es enthält als einziges einen Kreis. Die hohe Unterscheidbarkeit dieses Icons könnte also sehr gut den Ausschlag für sein gutes Abschneiden im Test gegeben haben.

Um Unterscheidbarkeit zu gewährleisten, ist diesen Ergebnissen folgend darauf zu achten, dass sich die gewählten Icons in ihren globalen Eigenschaften unterscheiden. Das kann problematisch sein, wenn es eine Vielzahl von Funktionen gibt, die an einem komplexen Objekt jeweils ein Detail manipulieren. Die Textverarbeitungs-Icons sind ein gutes Beispiel. Alle Funktionen beziehen sich auf das Textdokument. Reduzierte Icons können somit nicht erzeugt werden, indem man die detaillierten Icons auf ihre globalen Eigenschaften reduziert, denn dann wären sie nahezu identisch und jeglicher Hinweis auf die spezifische Funktionalität wäre dahin. Bei der Gestaltung der optimierten Icons wurde daher die Granularitätsebene gewechselt. Statt das Objekt „Textdokument“ darzustellen, beschränkte man sich auf die Teilobjekte, auf die sich die Bearbeitung jeweils bezieht, also eine Zeile oder ein Wort.

Zwar kann man den Icons nicht mehr ansehen, auf welches Gesamtobjekt sie sich beziehen, denn dieses Objekt ist nicht in den Icons präsent, doch ist dies bei der Textverarbeitung nicht problematisch. Im gegebenen Fall ist der Kontext aller Icons derselbe. Es gibt daher keine Notwendigkeit, das Dokument in jedem Icon abzubilden. Das ist nicht immer der Fall. Eine Software könnte über eine Reihe von Icons verfügen, die sich auf ein Dokument und andere, die sich etwa auf eine Zitatdatenbank beziehen. In so einem Fall könnte man das Problem lösen, indem verschiedene Elemente miteinander kombiniert werden.

Gibt es in einer Anwendung nur einen einzigen Objekttyp, so reicht ein simples +, um ein neues Objekt zu erstellen. Kann aber eine Vielzahl von Objekten hinzugefügt werden, reicht das Plus-Zeichen nicht mehr aus. In den obigen Android-Icons ist das Plus-Zeichen jeweils mit einem anderen Zeichen kombiniert worden. Wichtig dabei ist, dass keines der beiden Elemente zu einem Detail des anderen wird, beide also gut und schnell erkennbar bleiben, um die Unterscheidbarkeit zu gewährleisten.

Fazit: Auf globale Eigenschaften reduzierte Icons

Die vorgestellten experimentellen Untersuchungen untermauern unseren hypothesengeleiteten Ansatz zum Austarieren von Konflikten und geben nützliche Anregungen, wie die angesprochenen Design-Konflikte aufgelöst werden können. Das Ziel der Icon-Gestaltung und der Icon-Auswahl muss demnach sein, reduzierte Icons zu finden, die einen ausreichenden Hinweischarakter auf ihre Funktionalität beinhalten, sich aber untereinander hinreichend unterscheiden. In der Praxis erfordert dies, Details so zu reduzieren, dass am Ende eine recht einfache geometrische Form übrig bleibt, die aber immer noch detailliert genug ist, um das dargestellte Objekt erkennen zu können. Wo es erforderlich ist, sollten diese noch durch etablierte arbiträre und konzeptuelle Zeichen komplettiert werden.

Die Abbildung zeigt drei Icons, die diesen Ansprüchen genügen. Die durch die Icons abgebildeten Objekte sind ohne Weiteres zu erkennen, wobie die Darstellung so vereinfacht worden ist, dass keine komplexen Details wahrgenommen werden müssen.

Die Übersicht unten zeigt die verschiedenen, von uns beschriebenen Icon-Arten, eingeteilt nach dem Grad ihrer Abbildhaftigkeit und ihres Hinweischarakters. Die nicht abbildhaften Icons haben wir als „Gegenstandslose Icons“ zusammengefasst. Unter ihnen gibt es die „Arbiträren Icons“ und die „Konzeptuellen Icons“. Bei den abbildhaften Icons unterscheiden wir echte „Bild-Icons“ und die „Bezugslosen Bild-Icons“. Die letzteren sind für uns in der Ergonomie nicht interessant. Ihre Gestaltung fällt eher in den Bereich der Markengestaltung. Bei den „Bild-Icons“ können wir die detailreichen „Fotorealistischen Icons“ von den „Reduzierten Icons“ abgrenzen. Da letztere nur die globalen Eigenschaften eines Objekts darstellen, sind sie etwas weniger abbildhaft, aber immer noch abbildhaft genug, um ihren hohen Hinweischarakter zu erhalten. Sie stellen also einen idealen Kompromiss zwischen Abbildhaftigkeit und Wiedererkennbarkeit dar.