Estos son un conjunto de principios que fueron establecidos a principios del siglo XX por los psicólogos de la Gestalt. Fundamentalmente, estos principios, capturan cómo los seres humanos dan sentido y perciben las imágenes.
Qué son los principios de la Gestalt
Los principios de la Gestalt definen cómo los seres humanos simplifican y organizan las imágenes complejas que están compuestas por muchos elementos, ordenando inconscientemente cada parte del sistema para crear un todo, en vez de interpretar cada parte como un elemento independiente uno de otro y sin relación entre si.
La Gestalt, recoge nuestra tendencia a percibir el todo en vez de los elementos individuales. Por lo tanto, podemos decir que, los principios de la Gestalt nos ayudan a entender cómo las personas perciben visualmente el mundo, incluidas las interfaces de una aplicación o un sitio web.
Hay varios principios de la Getalt que incluyen: proximidad, similitud, región común, continuación, cierre, figura y fondo y simetría y orden. El principio de proximidad es muy importante en UX, se trata de que los elementos que visualmente están muy cerca se percibirán como parte de un mismo grupo.
Principio Gestalt de proximidad aplicado a la interfaz digital
Probablemente el principio de proximidad es el que más nos interesa. Realmente lo que viene a decirnos este principio de la Gestalt es que percibimos que los objetos que están próximos tendemos a agruparlos.
Los seres humanos tendemos a organizar de forma automática las cosas. Nuestro cerebro entiende que los objetos próximos forman parte del mismo grupo.
La práctica de colocar elementos comunes juntos y separar elementos no relacionados se puede ver en casi todas partes en el diseño de interfaces de usuarios.
Para conseguir que nuestro cerebro agrupe los elementos es clave la cantidad de espacio en blanco que exista entre ellos en nuestros diseños de interfaz. Aunque los elementos tengan diferentes formas.
1. Mercadona
Por ejemplo, en el sitio web de Mercadona para PC, podemos comprobar como los enlaces del menú los agrupamos, puesto que son opciones de navegación, mientras que el dropdown de selección de idioma está más separado y no lo incluimos en el grupo de enlaces del menú.
En este caso también agrupamos por el principio de proximidad cada bloque dentro de la estructura de la página.
2. Cabify
En el site de Cabify ocurre prácticamente lo mismo. Gracias al principio de proximidad somos capaces de percibir cada grupo conformado por elementos independientes donde el espacio en blanco juega un papel muy importante.
3. Carrefour
Otro ejemplo es en el sitio de Carrefour España. En el Header, en el mismo contenedor del logotipo y del botón que da acceso al menú de navegación, existen 4 acciones rápidas en la parte derecha que tendemos a agrupar.
4. Amazon
La ley de proximidad también se utiliza para agrupar campos en los formularios. Un formulario con muchos campos que no están agrupados parece más complicado de completar.
Por ejemplo en este formulario del proceso de compra de Amazon España, podemos ver como que agrupan los campos ayudados también del espacio que existe entre la etiqueta del campo y su campo correspondiente del formulario.
Colocar elementos relacionados muy cerca y usar espacios en blanco para crear grupos significativos es un principio fundamental en el diseño visual o de interfaz.
Colocar elementos agrupados que tengan relación proporciona una buena usabilidad al sitio. Si estos elementos están relacionados y agrupados en la zona en la que se centra el usuario cuando ejecuta la tarea, mucho mejor.
Créditos
La imagen de cabecera es de Usplash
5 Principles of Visual Design in UX
Psicología aplicada en la experiencia de usuario