Affordance is een term die oorspronkelijk werd bedacht door een psycholoog, JJ Gibson, in de jaren 1970. Hij definieerde het als de relatie tussen een omgeving en een actor. Tegenwoordig gaat betaalbaarheid verder dan gedrags- of cognitieve psychologie en in het ontwerp van digitale interfaces. Inzicht in de bruikbaarheid zal u toelaten om het ontwerp van producten en interfaces beter te begrijpen, waardoor u een veel betere ontwerper wordt.
Een situatie waarin de sensorische kenmerken van een object intuïtief de functionaliteit en het gebruik ervan impliceren. - Crowdcube
Crowdcube's definitie van de definitie van de leek is perfect. Alle objecten om ons heen hebben een andere, duidelijkere dan andere. Affordance is de mogelijkheid van een actie met een object; het is geen eigenschap van het object zelf. Met andere woorden, een knop kan worden ingedrukt; de mogelijkheid om op een knop te drukken is zijn bekwaamheid.
De originele definitie bedacht door JJ Gibson beschreef alle mogelijke fysieke acties die je zou kunnen ondernemen met een object. Na verloop van tijd veranderde de definitie. De definitie is nu breder en omvat de vindbaarheid van acties. Deze verandering heeft geleid tot de technologische evolutie van digitale interfaces. Ontdekkendheid is een interessant concept in het digitale rijk, want wanneer u een computer gebruikt, kunt u acties ontdekken via de hints die u in de interfaces zelf krijgt.
Neem een stap terug naar de fysieke wereld, waar je ziet dat objecten fysieke eigenschappen hebben zoals grootte, vorm of gewicht die hints geven over wat je ermee zou kunnen doen. Hier zijn een paar klassieke voorbeelden. Laten we beginnen met een theekopje; het is klein en heeft een handvat, wat vasthouden mogelijk maakt. Zijn ondergedompelde komvormige vorm geeft aan dat hij ook iets kan bevatten. Als het thee vasthoudt, is het de moeite waard om het theekopje te drinken en eruit te drinken. Een ander voorbeeld is een tandenborstel: deze heeft een lang-maar-dun handvat, dat handig is, enzovoort.
Fysieke objecten kunnen worden gesorteerd op drie betaalwijzen:
Waarneembare toegankelijkheid is de basisdefinitie van affordance, waarbij de kenmerken van een object een actie impliceren.
Verborgen bruikbaarheid is wanneer een object een veroorzaking heeft die niet zo voor de hand liggend is; als je bijvoorbeeld naar een bierfles kijkt, zou je niet kunnen zeggen dat je het kunt gebruiken om een andere bierfles te openen.
Valse bekwaamheid is wanneer er een waargenomen bekwaamheid is; maar er gebeuren geen resultaten van de mogelijke actie. Bijvoorbeeld op een knop drukken die niets doet, zoals het gebruik van de afstandsbediening van uw tv om de tv in te schakelen, maar het werkt om een of andere reden niet. De bruikbaarheid is er nog steeds - je kunt zoveel als je wilt op die knop drukken - maar er gebeurt niets, er is geen functie.
Digitale interfaces zijn speciaal. Ze stellen ons in staat dingen te doen die beperkt zijn tot een tweedimensionale wereld die een computerscherm is. Er zijn zoveel dingen die we zouden kunnen doen binnen elke app, website of programma; maar ze hebben allemaal één grote, verlammende beperking: ze kunnen je geen fysieke aanwijzingen geven over wat je kunt doen. In plaats daarvan vertrouwen ze allemaal op visuele aanwijzingen of affordances. Dit kan erg lastig zijn als je de belangrijke rol van betaalbaarheid bij het creëren van succesvolle interfaces niet begrijpt.
Als u begrijpt hoe de affordances werken, kunt u ze in uw voordeel gebruiken. Wanneer u een tool als betaalmiddel kunt gebruiken, kunt u ontwerpen maken die intuïtief en gebruiksvriendelijk zijn. Intuïtieve ontwerpen spreken hen zeker aan - hoogstwaarschijnlijk omdat we veel websites of apps vervelend en irritant vinden - dus het is echt verfrissend om ze te gebruiken. Daarnaast zorgen conversies voor affordance-effecten voor een groot succes bij het maken van een succesvol ontwerp.
Als u volledig wilt begrijpen hoe affordances werken in interfaceontwerp, moeten we specifiek worden. Laten we dat nu doen door zes verschillende betaalbaarheidstypes te bekijken die te zien zijn in digitale interfaces, waaronder: expliciet, patroon, verborgen, vals, metaforisch en negatief.
Vergelijkbaar met de waarneembare bruikbaarheid, zijn expliciete voordelen de hints afgegeven door de taal of het fysieke uiterlijk van het object. Een verhoogde knop met de tekst 'Klik mij' is een goed voorbeeld van zowel taal- als fysieke aanwijzingen. De verhoogde weergave van de knop geeft aan dat u kunt klikken en dat geldt ook voor de tekst 'Klik mij'. Het is duidelijk.
Taal speelt zo'n belangrijke rol bij het begeleiden van gebruikers via digitale interfaces. Een invoerveld dat u om uw 'volledige naam' vraagt, geeft u de mogelijkheid om uw naam erin in te voeren. Taal biedt duidelijke richtlijnen voor niet alleen wat u zou moeten doen, maar ook wat u zou kunnen doen. Het invoeren van letters, zoals uw naam, is anders dan het invoeren van nummers, zoals uw telefoonnummer, en u kunt vertellen welke u kunt doen door de context van de tekst. Het is echter ook belangrijk om te overwegen hoe duidelijk uw interface is om te gebruiken zonder expliciete, duidelijk omschreven aanwijzingen. Uw ontwerp moet bruikbaar en intuïtief zijn zonder de hand van uw gebruikers bij elke stap te houden.
Een patroonbekwaamheid is affordance uiteengezet door conventies. Een goed voorbeeld is een logo dat in de linkerbovenhoek van een webpagina kan worden aangeklikt. Het is een patroon dat we overal tegenkomen; dus we verwachten het overal. Tekst met een andere kleur, soms onderstreept of cursief, bij ongewijzigde hoofdtekst, zoals een alinea, wordt verondersteld een link te zijn. E-mail wordt vaak weergegeven met een envelop, terwijl instellingen worden weergegeven met een versnelling.
In deze voorbeelden heeft e-mail geen echte envelop nodig - die nooit heeft - en evenmin hoeven instellingen met versnellingen te werken. Het is een metaforisch patroon waaraan we al heel lang worden blootgesteld; dus het werd een conventie.
Patronen zijn geweldig voor het communiceren van mentale snelkoppelingen, maar alleen als uw gebruikers op de hoogte zijn van deze patronen. Er zijn altijd nieuwe patronen geïntroduceerd, bijvoorbeeld, het hamburgermenu is een relatief nieuw concept voor menu's en navigatie. Wanneer u ontwerpt met nieuwe patronen in gedachten, moet u ervoor zorgen dat uw gebruikers ermee vertrouwd zijn. Maar als je weet dat je publiek eerder is blootgesteld aan deze patronen, kun je een aantal fantastische ontwerpen maken zonder expliciet te zijn.
Verborgen bruikbaarheid in digitale ontwerpen is vergelijkbaar met die van fysieke objecten. In de digitale wereld is de feitelijke bruikbaarheid echter pas beschikbaar nadat een actie is ondernomen om deze te onthullen. Bijvoorbeeld, zwevend over een knop om te zien of het niet actief is, en daarom klikbaar. Vervolgkeuzemenu's zijn een ander voorbeeld, waarbij u het menu niet ziet tenzij u de muisaanwijzer plaatst of klikt op het bovenliggende item.
Verborgen affordances worden vaak gebruikt om de visuele complexiteit van een ontwerp te vereenvoudigen. In het voorbeeld van het vervolgkeuzemenu gebruiken we de vervolgkeuzelijst om alle navigatieopties te verbergen, omdat er te veel zijn om alles in één keer weer te geven. Als een gebruiker ergens naartoe wil navigeren, moet hij dit binnen de vervolgkeuzelijst vinden. Nu, een groot nadeel van verborgen affordances is dat ze van de gebruiker verlangen dat hij de affordance vindt, terwijl hij soms geen hints geeft over hun bestaan. Je weet niet wat je kunt verwachten. Het is een raadspel, om zo te zeggen, gebaseerd op het vinden van deze voordelen als je gaat.
Onjuiste toegankelijkheid in de digitale ruimte biedt iets anders dat onverwacht is, zoals het inschakelen van uw lampen in plaats van de tv met de afstandsbediening van de tv, of helemaal geen actie. Dit type betaalbaarheid is overal op internet, meestal per ongeluk, zoals een knop die er actief uitziet maar niets doet, een logo dat nergens aan is gekoppeld, de woorden 'klik hier' in de tekst die helemaal geen link zijn of een rode knop die iets goed doet met een groene knop die iets slechts doet.
Valse affordance is het grootst in ontwerpen waar details zijn gemist, zoals een verbroken link-situatie. Kleuren hebben specifieke associaties met hen. In de westerse wereld is groen goed, terwijl rood slecht is. Wanneer je de twee verwisselt, verwar je zeker sommige van je gebruikers, vooral wanneer de knoppen naast elkaar staan. Dit betekent niet dat je het niet kunt doen; maar je moet voorzichtig zijn als je dat doet. U wilt geen valse bedoelingen in uw ontwerp als u het kunt helpen. Je moet je gebruikers niet zo verrassen.
Skeuomorphism leunde zwaar op metaforische affordances, zoals imitaties van echte objecten, om te communiceren. Iconen zijn daar prachtige voorbeelden van: kaart, winkelwagen of mand, thuis, printer, video, microfoon, telefoon, etc. Neem bijvoorbeeld het concept van e-mail. De oorsprong ligt in de metafoor van een fysieke letter; het pictogram is meestal een envelop. Het is een geweldig voorbeeld van overal metaforische affordance. Als je iets ontwerpt en niet zeker weet hoe je het moet overbrengen, is het altijd goed om terug te gaan naar de fysieke wereld, althans voor inspiratie en een startpunt.
Nu hoef je niet over de top te gaan zoals Apple's oude ontwerpen, waar ze voor hun game-app de achtergrond een groen pooltafelkleed maakten. Vergelijk dat echter met hun huidige Games-app-pictogram, dat slechts enkele bubbels bevat. Wat hebben ze met spellen te maken? Ik weet het niet, de metafoor is er niet meer. Of dat een goede zaak is of niet, is aan jou om te beslissen. Of de metafoor er in je ontwerp moet zijn of niet, is aan jou.
Negatieve affordance kan worden beschouwd als specifiek duidend op geen affordance; het is wanneer je een inactieve knop hebt of een knop die inactief lijkt. Het meest voorkomende voorbeeld hiervan is wanneer een knop of een koppeling grijs wordt weergegeven. Nu, hier is het lastige gedeelte: het is niet dat je specifiek probeert een gebruiker te vertellen dat je deze knop niet kunt gebruiken - hoewel het zou kunnen zijn - maar dat de knop verschijnt die je niet kunt gebruiken, zelfs als dat in feite mogelijk is.
Er zijn bepaalde gevallen waarin u duidelijk wilt aangeven dat u niets zou kunnen doen. Als een gebruiker bijvoorbeeld bij het invullen van een formulier nog niet alles heeft ingevuld, kan uw knopstatus inactief worden weergegeven omdat u niet wilt dat deze nog doorgaat. Maar als de knop inactief lijkt, maar actief is, dan is het gewoon een slecht ontwerp. Wees voorzichtig met deze.