Un pomo redondo comunica, sin ninguna instrucción escrita, que hay que girarlo; una placa plana en una puerta comunica que hay que empujarla. Nadie necesita leer un manual para saberlo: la propia forma del objeto sugiere cómo usarlo. Ese concepto, aplicado al diseño de interfaces, es la affordance: la cualidad de un elemento que comunica visualmente, por su propia apariencia, cómo se supone que debe usarse, sin necesidad de explicación adicional.
De dónde viene el término, y cómo llegó al diseño digital
El psicólogo James Gibson acuñó el concepto en el contexto de la percepción visual del entorno físico. Don Norman lo popularizó después dentro del diseño de producto, distinguiendo entre affordances reales (lo que un objeto realmente permite hacer) y affordances percibidas (lo que el usuario cree que puede hacer con él, aunque no siempre coincida con la realidad técnica del sistema).
Ejemplos habituales en interfaces digitales
- Un botón con sombra y relieve sutil sugiere que se puede pulsar, mientras un texto plano sin ningún estilo diferenciado no transmite esa misma invitación a la interacción.
- Un campo de texto con un borde visible invita a escribir dentro de él, mientras un área sin ningún borde no comunica con la misma claridad que ahí se puede introducir información.
- Una barra de scroll visible indica que hay más contenido debajo, algo que desaparece por completo si esa barra se oculta completamente por estética, generando confusión sobre si la página termina ahí o continúa.
- Un icono de flecha o de lápiz junto a un texto sugiere que ese texto puede editarse, sin necesidad de ninguna etiqueta adicional que lo explique.
El problema de las «falsas affordances», cada vez más habitual
Un diseño excesivamente minimalista, sin ningún relieve ni borde visual, puede eliminar por completo las affordances de elementos que sí son interactivos, dejando al usuario sin ninguna pista visual de qué puede tocar y qué no. Este problema, conocido informalmente como «ceguera de botón plano» (flat design blindness), se ha vuelto más frecuente con las tendencias visuales minimalistas de los últimos años, que a menudo priorizan la estética limpia por encima de la claridad funcional.
Cómo equilibrar estética minimalista con affordances claras
No hace falta volver a los botones con relieve exagerado de hace dos décadas para resolver este problema: un sutil cambio de color, un ligero sombreado, o simplemente mantener cierta consistencia visual reconocible entre todos los elementos interactivos de un mismo producto, suele bastar para comunicar interactividad sin sacrificar por completo la estética minimalista actual. La clave está en probar con usuarios reales si realmente identifican qué pueden tocar, no solo en confiar en que un diseño «se ve bien» desde el punto de vista puramente visual del propio equipo de diseño.