Affordance ist ein Begriff, der ursprünglich von einem Psychologen, JJ Gibson, in den 1970er Jahren geprägt wurde. Er definierte es als die Beziehung zwischen einer Umwelt und einem Schauspieler. Affordanz erstreckt sich heute über die Verhaltens- oder Kognitionspsychologie hinaus auf das Design digitaler Schnittstellen. Wenn Sie Affordance verstehen, können Sie das Design von Produkten und Interfaces besser verstehen, was wiederum zu einem viel besseren Designer führt.
Eine Situation, in der die sensorischen Eigenschaften eines Objekts seine Funktionalität und Verwendung intuitiv implizieren. - Crowdcube
Die Begriffsdefinition von Crowdcubes Laien ist genau richtig. Alle Objekte um uns herum haben Affordanzen, manche offensichtlicher als andere. Affordance ist die Möglichkeit einer Handlung mit einem Objekt; es ist keine Eigenschaft des Objekts selbst. Mit anderen Worten, ein Knopf kann gedrückt werden; die Möglichkeit, einen Knopf zu drücken, ist seine Affordanz.
Die ursprüngliche Definition, die von JJ Gibson geprägt wurde, beschreibt alle möglichen physischen Aktionen, die Sie mit einem Objekt ausführen könnten. Mit der Zeit änderte sich die Definition. Jetzt ist die Definition breiter und umfasst die Auffindbarkeit von Aktionen. Dieser Wandel hat die technologische Entwicklung digitaler Schnittstellen bewirkt. Die Auffindbarkeit ist ein interessantes Konzept im digitalen Bereich, denn wenn Sie einen Computer verwenden, können Sie Aktionen anhand der Hinweise erkennen, die Sie innerhalb der Schnittstellen selbst erhalten.
Machen Sie einen Schritt zurück in die physische Welt, wo Sie sehen, dass Objekte physikalische Eigenschaften wie Größe, Form oder Gewicht haben, die Hinweise darauf geben, was Sie mit ihnen machen könnten. Hier sind ein paar klassische Beispiele. Beginnen wir mit einer Teetasse; es ist klein und hat einen Griff, der Halt bietet. Seine eingetauchte schüsselartige Form zeigt an, dass es auch etwas halten kann. Wenn es Tee hält, ist das Angebot, dass Sie die Teetasse halten und daraus trinken können. Ein anderes Beispiel ist eine Zahnbürste: Sie hat einen langen, aber dünnen Griff, der das Ergreifen ermöglicht, und so weiter.
Physische Objekte können drei Affordance-Typen sortiert werden:
Wahrnehmbare Affordance ist die grundlegende Definition von Affordance, bei der die Eigenschaften eines Objekts eine Handlung implizieren.
Versteckte Affordanz ist, wenn ein Objekt Affordanzen hat, die nicht so offensichtlich sind; Wenn Sie zum Beispiel einfach eine Bierflasche betrachten, könnten Sie nicht sagen, dass Sie damit eine andere Bierflasche öffnen können.
Falsche Affordance ist, wenn es eine wahrgenommene Affordanz gibt; Aus der möglichen Aktion ergeben sich jedoch keine Ergebnisse. Zum Beispiel, indem Sie eine Taste drücken, die nichts bewirkt, wie zum Beispiel mit Ihrer TV-Fernbedienung, um das Fernsehgerät einzuschalten, aber es funktioniert aus irgendeinem Grund nicht. Das Affordanz ist immer noch da - du kannst diesen Knopf so oft drücken wie du willst - aber nichts passiert, es gibt keine Funktion.
Digitale Schnittstellen sind etwas Besonderes. Sie erlauben uns, Dinge zu tun, die auf eine zweidimensionale Welt beschränkt sind, die ein Computerbildschirm ist. Es gibt so viele Dinge, die wir in jeder App, Website oder jedem Programm tun können. aber sie alle haben eine große, lähmende Einschränkung: Sie können Ihnen keine physischen Hinweise geben, was Sie tun können. Stattdessen sind sie alle auf visuelle Hinweise oder Affordanzen angewiesen. Dies kann sehr schwierig sein, wenn Sie die wichtige Rolle, die Affordance beim Erstellen erfolgreicher Schnittstellen spielt, nicht verstehen.
Wenn Sie verstehen, wie Affordances funktionieren, können Sie sie zu Ihrem Vorteil nutzen. Wenn Sie Affordance ein Werkzeug machen können, können Sie Designs erstellen, die intuitiv und einfach zu bedienen sind. Intuitive Designs haben diese gewisse Anziehungskraft auf sie - wahrscheinlich weil wir viele Webseiten oder Apps langwierig und nervig finden - es ist wirklich erfrischend sie zu benutzen. Darüber hinaus bewirkt Affordance Conversions, die bei der Erstellung eines erfolgreichen Designs eine große Rolle spielen.
Wenn Sie vollständig verstehen möchten, wie sich Affordances im Interface Design verhalten, müssen wir spezifisch werden. Lassen Sie uns das jetzt tun, indem wir sechs verschiedene Arten von Affordances abdecken, die in digitalen Schnittstellen zu finden sind: explizite, Muster-, versteckte, falsche, metaphorische und negative Affordanz.
Ähnlich der wahrnehmbaren Affordanz sind explizite Affordanz die Hinweise, die durch die Sprache oder die physische Erscheinung des Objekts gegeben werden. Eine hervorgehobene Schaltfläche, die "Klick mich" sagt, ist ein großartiges Beispiel für Sprache und physische Signale. Das hervorgehobene Aussehen der Schaltfläche zeigt die Möglichkeit des Klickens an und auch der Klick-Text. Es ist offensichtlich.
Die Sprache spielt eine so wichtige Rolle bei der Benutzerführung durch digitale Schnittstellen. Ein Eingabefeld, das Sie nach Ihrem vollständigen Namen fragt, ermöglicht es, Ihren Namen einzugeben. Sprache bietet klare Richtlinien, nicht nur was Sie tun sollten, sondern auch was Sie tun könnten. Das Eingeben von Buchstaben, wie Ihr Name, ist anders als das Eingeben von Zahlen, z. B. Ihre Telefonnummer, und Sie können anhand des Textzusammenhangs erkennen, welche Sie verwenden können. Es ist jedoch auch wichtig zu überlegen, wie offensichtlich Ihre Schnittstelle ohne explizite, ausgeschriebene Anweisungen zu verwenden ist. Ihr Design muss benutzbar und intuitiv sein, ohne die Hand des Benutzers bei jedem Schritt zu halten.
Eine Musteraffordanz ist eine durch Konventionen festgelegte Affordanz. Ein gutes Beispiel wäre ein Logo, das an der oberen linken Ecke einer Webseite anklickbar ist. Es ist ein Muster, das wir überall sehen; also erwarten wir es überall. Text mit einer anderen Farbe, manchmal auch unterstrichen oder kursiv, wird unter einem unveränderten Text wie ein Absatz als Link interpretiert. E-Mail wird oft mit einem Umschlag dargestellt, während Einstellungen mit einem Zahnrad dargestellt werden.
In diesen Beispielen benötigt E-Mail keinen tatsächlichen Umschlag - das hat er nie - und Einstellungen erfordern auch keinen Umgang mit Getrieben. Es ist ein metaphorisches Muster, dem wir lange Zeit ausgesetzt waren. So wurde es eine Konvention.
Muster eignen sich hervorragend zum Kommunizieren von mentalen Verknüpfungen, aber nur, wenn Ihre Benutzer diese Muster kennen. Es werden ständig neue Muster eingeführt, zum Beispiel ist das Hamburger-Menü ein relativ neues Konzept für Menüs und Navigation. Wenn Sie mit neuen Mustern arbeiten, müssen Sie sicherstellen, dass Ihre Benutzer mit ihnen vertraut sind. Aber wenn Sie wissen, dass Ihr Publikum zuvor diesen Mustern ausgesetzt war, können Sie erstaunliche Designs erstellen, ohne explizit zu sein.
Versteckte Affordanz in digitalen Designs ist ähnlich wie bei physischen Objekten. In der digitalen Welt ist jedoch die tatsächliche Affordanz nicht verfügbar, bis eine Aktion unternommen wurde, um sie zu enthüllen. Zum Beispiel, indem Sie den Mauszeiger über eine Schaltfläche bewegen, um zu sehen, ob sie nicht aktiv und damit anklickbar ist. Dropdown-Menüs sind ein weiteres Beispiel, in dem Sie das Menü nur dann sehen, wenn Sie den Mauszeiger auf das übergeordnete Listenelement bewegen oder darauf klicken.
Versteckte Affordances werden häufig verwendet, um die visuelle Komplexität eines Designs zu vereinfachen. Im Dropdown-Menü verwenden wir beispielsweise das Dropdown-Menü, um alle Navigationsoptionen auszublenden, da es zu viele gibt, um alle auf einmal anzuzeigen. Wenn ein Benutzer irgendwo navigieren möchte, muss er dies innerhalb des Dropdown-Menüs finden. Ein großer Nachteil der versteckten Angebote besteht darin, dass der Benutzer die Affordanz finden muss, während er ihnen manchmal keine Hinweise auf ihre Existenz gibt. Du weißt nicht was zu erwarten ist. Es ist sozusagen ein Ratespiel, basierend darauf, diese Affordances zu finden, während du gehst.
Falsche Affordanz im digitalen Raum bietet etwas Unerwartetes - wie das Einschalten des Lichts anstelle des Fernsehers mit der TV-Fernbedienung - oder gar keine Aktion. Diese Art von Affordanz ist überall im Web, meistens zufällig, wie ein Knopf, der aktiv aussieht, aber nichts tut, ein Logo, das nicht mit irgendetwas verbunden ist, die Worte "klicken Sie hier" in Text, die überhaupt kein Link sind oder ein roter Knopf, der etwas Gutes mit einem grünen Knopf tut, der etwas Schlechtes tut.
Bei Designs, bei denen Details übersehen wurden, wie bei einer unterbrochenen Link-Situation, gibt es am häufigsten falsche Angebote. Farben haben spezifische Assoziationen mit ihnen. In der westlichen Welt ist Grün gut, während Rot schlecht ist. Wenn Sie die beiden wechseln, werden Sie sicherlich einige Ihrer Benutzer verwirren, besonders wenn die Tasten nebeneinander stehen. Das bedeutet nicht, dass du es nicht tun kannst; aber du solltest vorsichtig sein, wenn du das tust. Sie möchten keine falschen Angebote in Ihrem Design, wenn Sie es helfen können. Sie sollten Ihre Benutzer nicht so überraschen.
Skeuomorphismus verließ sich stark auf metaphorische Affordances, wie Imitationen von realen Objekten, um zu kommunizieren. Symbole sind wunderbare Beispiele dafür: Karte, Einkaufswagen oder Korb, Zuhause, Drucker, Video, Mikrofon, Telefon, etc. Nehmen Sie das Konzept der E-Mail zum Beispiel. Seine Wurzeln sind in der Metapher eines physischen Buchstabens; Das Symbol ist normalerweise ein Umschlag. Es ist ein großartiges Beispiel für eine metaphorische Affordance. Wenn Sie etwas entwerfen und nicht sicher sind, wie Sie es vermitteln sollen, ist es immer gut, zurück in die physische Welt zu gehen, zumindest als Inspiration und Ausgangspunkt.
Jetzt müssen Sie nicht über die Spitze gehen wie Apples alte Designs, wo sie für ihre Spiele-App den Hintergrund zu einem grünen Pool-Tischtuch gemacht haben. Aber, vergleichen Sie das mit ihrem aktuellen Spiele App-Symbol, das nur ein paar Blasen ist. Was haben sie mit Spielen zu tun? Ich weiß nicht, die Metapher ist nicht mehr da. Ob das eine gute Sache ist oder nicht, bleibt Ihnen überlassen. Ob die Metapher in Ihrem Design vorhanden sein muss oder nicht, liegt ganz bei Ihnen.
Negative Affordanz kann man sich so vorstellen, dass sie keine Affordanz anzeigt; Es ist, wenn Sie eine inaktive Schaltfläche oder eine Schaltfläche haben, die inaktiv aussieht. Der häufigste Fall ist, wenn eine Schaltfläche oder eine Verknüpfung ausgegraut ist. Nun, hier ist der knifflige Teil: Es ist nicht so, dass Sie gerade versuchen, einem Benutzer zu sagen, dass Sie diesen Knopf nicht benutzen können - obwohl es sein könnte - aber dass der Knopf erscheint, dass Sie ihn nicht benutzen können, selbst wenn Sie es tatsächlich können.
Es gibt bestimmte Fälle, in denen Sie deutlich anzeigen möchten, dass Sie etwas nicht tun können. Wenn beispielsweise ein Benutzer beim Ausfüllen eines Formulars noch nicht alle Felder ausgefüllt hat, kann der Status Ihrer Schaltfläche inaktiv angezeigt werden, da sie nicht fortgesetzt werden sollen. Aber wenn die Schaltfläche inaktiv ist, aber aktiv ist, dann ist es einfach schlechtes Design. Sei vorsichtig mit diesem.