Los principios de la Gestalt capturan cómo las personas dan sentido al mundo que les rodea y a las imágenes que perciben. Definen cómo los seres humanos simplifican y organizan las imágenes complejas que están compuestas por muchos elementos, ordenando cada parte para crear un todo.
En la entrada anterior, Gestalt. Principio de proximidad para diseñar interfaces, se puede encontrar una definición más amplia de qué es la Gestalt, sus principios y en qué consiste el principio de proximidad. Es uno de los más importantes en UX o Experiencia de Usuario.
Principio Gestalt de similitud o semejanza aplicado a la interfaz digital
El principio de similitud de la Gestalt se puede explicar como todos aquellos elementos de diseño que parecen similares de alguna manera, por ejemplo, si comparten color, forma o tamaño, se perciben como que están relacionados. Los elementos que parecen diferentes se perciben como pertenecientes a grupos separados.
El ser humano tiende a realizar agrupaciones de cosas similares independientemente de su proximidad entre sí. A través del principio de semejanza o similitud se pueden agrupar elementos que no estén cerca unos de los otros por tener el mismo color, forma o tamaño.
1. Adobe
En la página de Adobe XD, se puede comprobar como aplicar un color a ciertos elementos de la página hace que nuestro cerebro los relacione y por tanto pensemos que o funcionan igual o de forma muy similar. El uso del color tiende a destacar por encima de otros rasgos según el principio de similitud de la Gestalt.
Este ejemplo lo vemos en el botón comprar ahora. Siempre tiene el color sólido azul, lo que hace que lo asociemos a la misma funcionalidad, pero en cuanto a la forma es igual que empezar gratis. Ambos son botones, lo entendemos por su forma, pero con distinta funcionalidad gracias al color.
2. Carrefour España
En la página de inicio de Carrefour España, podemos comprobar como tendemos a agrupar los elementos gracias al principio de semejanza o similitud de la Gestalt. En este caso nos afectan los rasgos de color, forma y tamaño.
Nuestro cerebro agrupa automáticamente las categorías del supermercado. Cada elemento dispone de la misma forma circular, con el mismo color de fondo y el mismo color para el texto de la categoría.
Por otro lado, nuestro cerebro agrupa las 3 tarjetas de debajo gracias al rasgo de tamaño y forma. Algo curioso, es que dentro de esta agrupación, nuestro cerebro tenderá a agrupar las dos tarjetas de color rojo, dejando a la tercera aislada dentro del grupo.
Colocar elementos relacionados a través de rasgos como la forma, el color o el tamaño para crear grupos y relaciones es un principio fundamental en el diseño visual o de interfaz y ayuda a mejorar la Usabilidad y la Experiencia de Usuario de los sitios web y aplicaciones.
Créditos
La imagen de cabecera es de Unsplash
Similarity Principle in Visual Design
The Law of Similarity – Gestalt Principles (1)