Los siete principios fundamentales del diseño de Don Norman

Principios de diseño de UX: Parte 2 de 3

Analizando los siete principios fundamentales del diseño de Don Norman

En parte unoanalizamos siete preguntas importantes dentro de un Ciclo de acción Del libro más vendido de Don Norman, El diseño de las cosas cotidianas..

“Cualquiera que utilice un producto siempre debería poder determinar la respuesta a las siete preguntas”. —Don Normando.

Para ayudar a determinar las respuestas a sus siete preguntas, Norman ha ideado una lista de Siete principios fundamentales de diseño. Podemos aplicar cada principio como una estrategia de diseño especial para hacer que los productos o cosas sean eficientes, efectivos y atractivos.

Diseño de Outcrowd. La página de destino utiliza puntos focales, como llamadas a la acción, imágenes y encabezados, navegación, jerarquía visual y espaciado. Hacerlo facilita a los usuarios determinar las posibles acciones.

Cada vez que nos involucramos con algo cotidiano, como el control remoto de un televisor, o un producto como un sitio web o una aplicación, averiguamos dónde y cómo realizar diversas funciones. A través de una buena capacidad de descubrimiento, podemos considerar las diferentes opciones y elegir la que debería funcionar para alcanzar nuestro objetivo. Sin embargo, no podemos hacer esto si las acciones no son detectables.

Norman describe una buena capacidad de descubrimiento como: “es posible determinar qué acciones son posibles y el estado actual del dispositivo”. Puntos focales claros (llamados a la acción, imágenes y encabezados); jerarquía visual (contenido estructurado en orden de prioridad); y los sistemas de navegación transparentes constituyen una buena capacidad de descubrimiento y comprensión dentro de un diseño.

Sin embargo, cuando un diseño carece de capacidad de descubrimiento, debemos trabajar más para comprender cómo funciona algo. Tomemos como ejemplo el menú de hamburguesas de un sitio web; es un lugar conveniente para almacenar varios artículos, pero oculta ofertas clave e información esencial.

Otros principios de diseño, en particular los significantes, la retroalimentación y las restricciones (los veremos pronto), también pueden aumentar la capacidad de descubrimiento y reducir posibles errores.

Animación de Hoang Nguyen. Los comentarios actualizan a los usuarios sobre el estado de sus convocatorias de reunión.

Cuando interactuamos con algo o producto cotidiano, necesitamos retroalimentación para comunicar el resultado de nuestras acciones. Sin una respuesta inmediata, nos preguntamos si nuestra acción realizada ha tenido algún impacto.

Norman describe la retroalimentación como “una forma de informarle que el sistema está funcionando según su solicitud”. También explica que la retroalimentación debe ser inmediata, informativa, discretamente planificada y priorizada.

La información importante debe ser inmediata y clara. Por ejemplo, cuando algo sale mal, un diálogo de error nos obliga a prestar atención a comentarios críticos sobre lo que acaba de suceder y qué hacer a continuación.

Sin embargo, una retroalimentación sutil puede informarnos que nuestra acción ha funcionado sin interrumpir nuestro flujo. Por ejemplo, la aplicación móvil de Twitter muestra un pequeño mensaje animado en la parte inferior de la pantalla para confirmar los tweets ejecutados correctamente.

Diseño de Diván Raj. Las experiencias de incorporación son buenos ejemplos de cómo los modelos conceptuales pueden proporcionar a los usuarios una explicación de cómo funciona el producto o servicio.

Un modelo conceptual es una explicación simple y útil de cómo funciona algo. Por ejemplo, una experiencia de incorporación de un sitio web o una aplicación demuestra cómo utilizar el producto o servicio. Norman explica que “el diseño proyecta toda la información necesaria para crear un buen modelo conceptual del sistema, lo que lleva a una comprensión y una sensación de control”.

Podemos encontrar otros ejemplos de modelos conceptuales en packaging, manuales de instrucciones e iconografía. Las interfaces digitales utilizan metáforas visuales para ayudarnos a comprender lo que podemos lograr; por ejemplo, el icono de la papelera representa la idea de eliminar archivos no deseados.

Cuando un modelo conceptual no está claro, podría ir en contra de nuestro modelo mental (nuestra expectativa de cómo debería funcionar algo). Por ejemplo, una conexión USB en forma de trapezoide podría entrar en conflicto con las expectativas de un diseño reversible que permita una única orientación para la inserción.

Diseño de Vectary. El diseño de la perilla del termostato sugiere lo que puede hacer, es decir, girar para aumentar la temperatura.

La asequibilidad es la acción percibida de un objeto y las propiedades que nos ayudan a determinar su funcionamiento. Norman afirma: “El término prestación se refiere a la relación entre un objeto físico y una persona”. Por ejemplo, los diseños de manijas de puertas y cadenas de tracción se relacionan con la acción prevista; por tanto, la forma sigue a la función.

Tomemos, por ejemplo, una silla; su forma permite sentarse. Luego, algunas sillas vienen con ruedas que permiten empujar y tirar. Y, en el caso extremo de un incendio, incluso podríamos percibir el tamaño y el peso de la silla como una oportunidad para romper una ventana.

Debemos señalar que la asequibilidad depende del conocimiento mental (lo que ya entendemos) y de la relevancia cultural. Sin estas propiedades, la acción deseada de un objeto será más difícil de percibir. Tomemos como ejemplo el diseño plano; Es posible que los usuarios novatos no distingan inmediatamente entre botones y cuadros rectangulares que no funcionan.

Diseño de Nhat M. Tran. Los significantes, como botones y señales visuales, indican a los usuarios dónde pueden tener lugar diferentes acciones.

Un significante nos comunica dónde debe tener lugar la acción. Norman explica: “El término significante se refiere a cualquier marca o sonido, cualquier indicador perceptible que comunique un comportamiento apropiado a una persona”. Por ejemplo, la etiqueta de un botón nos dice con precisión qué acción realiza el control correspondiente.

En la película, Pingüinos de Madagascar., una criatura del Ártico pisa un gran botón rojo sin darse cuenta de su acción. Luego, durante las alarmas parpadeantes, el pingüino exclama: “Realmente deberían ponerles una etiqueta a estas cosas”.

Un gran botón rojo suele indicar que realizará una acción crítica, como una salida de emergencia. Sin embargo, en el caso del Penguin, no hubo una indicación clara de la verdadera intención del botón.

Si bien los significantes aclaran dónde actuar, también dependen de la comprensión cultural. Por ejemplo, cuando Amazon lanzó su sitio web en India, los usuarios confundieron el ícono de búsqueda con un bate de ping pong. Esta historia demuestra que los significantes deben tener un significado relevante para ser reconocidos por el usuario objetivo.

6. Mapeo

Animación de Rhema Leverett. El selector de color representa la relación entre los controles y los elementos correspondientes a los que afectan.

El mapeo es la relación entre los controles y su efecto en el mundo. Por ejemplo, los botones de flecha en una máquina arcade de garras corresponden a los movimientos del brazo mecánico que agarra el juguete. Norman explica: “cuando el mapeo utiliza la correspondencia espacial entre el diseño de los controles y los dispositivos que se controlan, es fácil determinar cómo usarlos”.

El mapeo natural nos permite cambiar inconscientemente los efectos de nuestro mundo, como encender los interruptores de luz apropiados. En particular, podemos encontrar buenos comportamientos de mapeo dentro del centro de control de iOS, que utiliza barras deslizantes para comunicar el efecto de nuestras acciones.

Por el contrario, el mapeo antinatural aumenta el esfuerzo físico y cognitivo. Por ejemplo, una distribución poco clara de la cocina dificulta determinar qué mandos controlan las placas correspondientes.

Tenga en cuenta que si un mapeo natural es imposible, utilice significantes para aclarar dónde existen las relaciones.

Diseño de Walid Ghazzo. Un proceso sencillo para crear y gestionar un evento. Los pequeños pasos brindan a los usuarios suficiente información para completar una tarea a la vez.

Los formularios largos, los diseños complicados y las descripciones muy escritas pueden aumentar la distracción y la carga cognitiva (memoria de trabajo).

Sin embargo, las restricciones pueden restringir el tipo de interacciones que pueden tener lugar y, por lo tanto, ayudar a reducir la cantidad de información que procesamos. Norman explica que “las limitaciones físicas, lógicas, semánticas y culturales guían las acciones y facilitan la interpretación”.

Existen diferentes formas de restricciones, incluidas las físicas, semánticas, culturales y lógicas. Cada uno puede ayudar a centrar nuestra atención en una tarea importante y ayudar a reducir la posibilidad de error humano.

Las limitaciones físicas restringen las posibles operaciones; por ejemplo, no podemos mover el cursor del mouse fuera de la pantalla. Las limitaciones semánticas son pistas sobre dónde podemos realizar acciones; por ejemplo, un enchufe significa dónde podemos insertar las clavijas del enchufe. Las restricciones culturales son convenciones sociales, como esperar en una cola para ser atendido. Y finalmente, las restricciones lógicas ayudan a determinar las alternativas; por ejemplo, haciendo scroll es como sabemos ver el resto de la pantalla.