Affordance (affordância)

A pista visual que diz, sem precisar de texto, o que um elemento faz e como se usa.

Hard

O que é

Affordance descreve a relação entre o design de um objeto e o que ele sugere sobre como pode ser usado. O conceito veio da psicologia, com James Gibson, e foi levado pro design por Don Norman no livro “O Design do Dia a Dia”.

Na interface, affordance é o que faz um elemento anunciar sozinho a sua possibilidade de ação. Um botão com leve relevo parece clicável. Um campo com cursor convida a digitar. Uma barra de rolagem na borda sugere que ainda tem mais conteúdo. Em todos esses casos, a pessoa entende a ação pelo padrão visual que já conhece.

Norman separa duas camadas: a affordance real, que é o que o objeto de fato faz, e a affordance percebida, que é o que a pessoa acha que ele faz. Um bom design alinha as duas. Quando o elemento parece clicável mas não é, ou é clicável mas não parece, a pessoa trava ou simplesmente perde a função.

Em uma frase

Esse card não tem affordance de clicável, ninguém vai adivinhar que dá pra tocar nele.

A pergunta que ele responde

Como eu faço a pessoa entender o que dá pra fazer num elemento sem precisar explicar?

Quando usar

Vale considerar ao desenhar qualquer elemento interativo, como botões, links, campos e áreas arrastáveis.

Como não usar

O cuidado é não achar que basta a função existir. Se a pista visual não está lá, na prática a função não existe pra quem usa.

Na prática

Pense num time que troca o botão de envio por um texto azul sem sublinhado. Os cliques caem, e a explicação é direta: ao apagar a pista visual, ele tirou a affordance de clicável daquele elemento.

Não confunda com

Vale separar affordance de signifier, porque um é a possibilidade e o outro, o aviso. A affordance é a possibilidade de ação que o elemento oferece. O signifier é o sinal que anuncia essa possibilidade pra pessoa. E vale lembrar que affordance não é só estética: ela é função percebida.

D

Em inglês

Affordance

Pronúncia

a-fôr-dâns

Também chamado de

affordância, pistas de uso

Origem

James J. Gibson (psicologia da percepção); levado pro design por Don Norman.

Fonte

Saiba mais

Don Norman, O Design do Dia a Dia