Saltar al contenido principal

Gestalt Psychology

CURSO: Gestalt Psychology and Web Design

Elaboró: Víctor Angeles

Fecha de elaboración: 11 feb 2025

Orígen y significado de la Gestalt

La Gestalt surge a inicios del siglo XX, derivado del Estructuralismo: corriente epistemológica que estudia la mente humana en sus componentes más simples, en el cómo se ensamblan para crear experiencia complejas y cómo se correlacionan con eventos físicos y visibles. Esta perspectiva afirma que las percepciones se crean a partir de sensaciones.

La palabra Gestalt significa "Forma" o "Estructura" o a "Cualquier todo separado".

Es una teoría que describe la pecepción humana según las formas en que la información visual se reúne para formar objetos completos y significativos a partir de elementos visuales individuales.

Los padres de la psicología Gestalt son Max Wertheimer, Kurt Koffka y Wolfgang Kohler.

Ejemplo.png

"El todo es diferente a la suma de sus partes".

Esta frase afirma que la organización perceptual subyace a la percepción humana y que precibimos el objeto completo antes que las partes que lo componen, es decir, el reconocimiento de elementos u objetos visuales totales no se produce mediante un proceso de identificación y unión de partes compuestas, si no que, identificamos objetos completos y significativos sin esfuerzo consciente y de manera inmediata. Aunque la frase que se suele escuchar es "El todo es mayor que la suma de sus partes", lo cierto es que es una traducción errónea, ya que la suma no necesariamente se percibe como un conjunto, sino como algo distinto a lo que inicialmente está estructurado.

Notas rápidas:

  • El pensamiento humano presenta sesgos perceptuales.
  • La Gestalt proporciona principios de organización perceptual.
  • Las leyes de la gestalt influyen en la experiencia del usuario.

Principios subyacentes de la organización perceptual

La percepción visual humana tiende a "convertir" la información visual en representaciones familiares y personalmente significativas de nuestro entorno.

Principio de emergencia​

Es la generación de elementos significativos que emergen de una escena visual y que identificamos con poco esfuerzo mental, en el cuál se configura el objeto de manera completa sin una identificación consciente de los elementos que lo componen.

Principio de emergencia.png

Figura/Fondo​

Es la capacidad para centrar la atención en un objetivo relevante o significativo y filtrar el resto de una escena visual, garantizando el uso de una baja carga cognitiva.

Es la sensación de que un elemento de una escena estuviera al frente de la vista, por encima o de que fuera la principal.

Figura-Fondo.png

Ley de Pragnanz​

Es la tendencia humana a ver patrones de estímulos de manera organizada y de la forma más simple posible, en lugar de ver formaciones complicadas, ambiguas y disociadas.

Nos ayuda a interactuar con el entorno de forma segura, confiable, rápida y precisa.

Ley de Pragnanz.png

Invariancia​

Es la capacidad para reconocer la mayoría de las formas y figuras a pesar de que muestren variaciones, como por ejemplo: rotación, orientación, traslación, escala, deformación elástica e iluminación.

Sin esta capacidad de reconocimiento, el esfuerzo cognitivo requerido sería significativamente impactante al evaluar cualquier escena cambiante, el mundo sería incongruente y confuso.

Invariancia.png

Cosificación​

Es la conversión de un elemento abstracto en algo concreto, en el que nuestro sistema visual construye una impresión completa en la mente para hacer que la escena sea más significativa y menos confusa.

El sistema visual humano genera formas completas a partir de información sensorial limitada, llenando los espacios blancos.

Cosificación.png

Multiestabilidad​

Es la sensación de alternar visualmente entre imágenes/figuras/formas cuando estas son ambiguas y presentan dos o más interpretaciones posibles y significativas.

Ahora bien, si un texto descriptivo o comentario nos atrae a una determinada interpretación, a menudo ignoramos la interpretación alternativa pero, una vez que el sistema visual ha detectado la presencia de otra forma significativa, se experimenta la multiestabilidad.

Multiestabilidad.png

Vivimos en un mundo de constantes distracciones y de competencia visual, peleando constantemente por nuestra limitada capacidad de atención y procesamiento.

Notas rápidas:

Los principios de Gestalt...

  • Se pueden utilizar para mejorar las cualidades placenteras, estéticas y divertidas de nuestros productos.
  • Se pueden utilizar para crear escenas significativas a partir de una pequeña cantidad de elementos (simplicidad y minimalismo).
  • Se pueden utilizar para emplear diseños simples pero efectivos.
  • Nos permiten que los espacios en blanco o negativos se puedan utilizar para evocar escenas visuales e imágenes que llaman la atención.

Leyes de Gestalt de la organización perceptual

Ley de semejanza​

Es un sesgo de formación de grupos que ocurre cuando los elementos comparten características superficiales.

Ejemplo: flechas del mismo color y dirección junto a otras de otros colores y dirección inversa.

Nuestra capacidad para detectar instantáneamente cualidades compartidas por diferentes elementos y agruparlas "mentalmente" nos permite centrarnos en objetos específicos dentro de una matriz visual.

Ley de semejanza.png

Aplicación práctica:

  • Ayuda a los usuarios a identificar inmediatamente qué elementos de la pantalla están agrupados por ser similares.
  • Estas similitudes pueden ser la forma, el color, el tamaño o la coincidencia de la fuente al usar texto.
  • Se puede potenciar este sesgo de percepción aumentando la similitud de los elementos que el usuario debería considerar pertenecientes al mismo grupo y disminuyendo la similitud de los elementos que no deberían considerarse agrupados.
  • La similitud también juega un papel esencial en la coherencia de la interfaz, indicándole al usuario que por ejemplo sigue dentro del sitio o app aún cuando esté en una sección distinta, sigue siendo parte del todo.
  • Un mal uso de esta ley relentizaría la detección de elementos en el proceso de búsqueda visual e incluso podrían ocasionar una selección errónea de elementos, ya que el usuario interactuaría por ensayo y error.

Ley de semejanza_ejemplo.png

Ley de proximidad​

La ubicación de los elementos y su relación entre sí informan y sesgan la información que extraemos de nuestro entorno, es decir, la proximidad de los elementos influye en nuestra percepción, cuando los elementos están cerca unos de otros, es más probable que los percibamos como agrupados.

Así mismo, no sólo la proximidad de elementos afecta la percepción humana, sino también su distancia con otros grupos o elementos no agrupados.

Ley de proximidad.png

Aplicación práctica:

  • Se puede ayudar a los usuarios colocando elementos que deberían verse agrupados muy cerca, mientras se puede separar aquellos elementos que no deben agruparse.
  • Ayudamos a detectar instantáneamente objetos "completos" del flujo sensorial, en lugar de que el usuario tenga que reconstruir las partes que componen al conjunto o grupo.

Ley de proximidad_ejemplo.png

Ley de significado​

Es una tendencia humana a agrupar elementos visuales cuando forman un objeto, elemento o escena visualmente significativa o personalmente relevante.

A lo largo de la vida almacenamos información sobre el mundo, adquiriendo gradualmente recuerdos y representaciones mentales de objetos, escenas completas y cualquier otro elemento visual. Estos recuerdos y representaciones mentales se estimulan, reconociendo así patrones visuales similares o que recuerdan algún evento o experiencia anterior.

El reconocimiento es un tipo de proceso de memoria que ocurre cuando un patrón neuronal asociado con un evento previo (por ejemplo, ver un perro) es excitado por una instancia nueva y similar (por ejemplo, ver a otro perro).

Ley de significado.png

Aplicación práctica:

  • Se puede explotar la tendencia humana a identificar grupos de ciertos elementos visuales como formas completas y significativas.

Ley de significado_ejemplo.png

Ley de simetría​

Es una tendencia humana a percibir elementos visuales agrupados cuando forman parte de una disposición simétrica.

Nuestros órganos visuales centran nuestra atención en el centro, buscando así un equilibrio entre las dos mitades de un objeto o escena desde el centro. Estamos predispuestos a percibir simetría y simplicidad.

Ley de simetría.png

Aplicación práctica:

  • Se puede utilizar nuestra atracción natural por la simetría para crear exhibiciones agradables, así mismo, para ayudar a los usuarios a identificar elementos agrupados y pertenecientes a una misma categoría.
  • Cuanto más parecidos son los objetos, más tienden a agruparse.

Ley de proximidad_ejemplo.png

Ley de la continuidad​

Somos capaces de seguir figuras bastante complejas, incluso cuando están ocluidas por otros elementos.

Ejemplo: cuando un objeto pasa por encima o detrás de otro, todavía vemos dos formas distintas que siguen un camino particular.

Ley de continuidad_1.png

Ley de continuidad_2.png

Aplicación práctica:

  • Es posible jugar con esta cualidad siempre y cuando el usuario obtenga consistencia en las figuras, imágenes, iconos y cualquier otro elemento gráfico que se utilice, tanto en cómo se muestra como en cómo se verá comportarse cuando interactúan con él.

image.png

Ley del destino común​

El movimiento es una característica llamativa. Es útil emplear el destino común para llamar la atención del usuario sobre elementos clave dentro de las visualizaciones y dar a entender en qué dirección habrá movimiento.

Ley del destino común.png

Aplicación práctica:

  • El movimiento es una característica llamativa. Es útil emplear el destino común para llamar la atención del usuario sobre elementos clave dentro de las visualizaciones y dar a entender en qué dirección habrá movimiento.

Ley del destino común_ejemplo.png

Ley de cierre​

Hay ocasiones en las que no podemos ver un objeto totalmente completo, sin embargo, combinamos la información visual disponible para formar un objeto completo y significativo.

Nuestro impulso por darle sentido al mundo es tal que el sistema visual humano a menudo interpreta el espacio en blanco como un objeto completo.

Por ejemplo, las figuras que están ocluidas o incompletas se siguen percibiendo como un todo aunque no podamos ver el elemento completo.

Principio de cierre.png

Aplicación práctica:

  • Los objetos no tienen que estar enteros o completos para que podamos identificarlos exitosamente como tales.
  • A menudo hay ocasiones en las que el diseñador puede mantener al mínimo el número de elementos que componen una pantalla, sin sacrificar el significado ni afectar la capacidad del usuario para identificar grupos o información importante.

Principio de cierre_ejemplo.png

Ley de conectividad de los elementos​

Identifica la tendencia perceptiva a agrupar elementos cuando están conectados entre sí.

Ejemplo. cuando están conectados una serie de elementos por una línea sin importar la distancia entre estos.

Ley de conectividad.png

Aplicación práctica:

  • Al emplear el elemento de conectividad, el diseño muestra claramente cómo se vinculan los diferentes elementos y la conexión es significativa y útil.

Ley de conectividad_ejemplo.png

Ley de región común​

Cuando los elementos visuales están rodeados por un límite claro, consideramos que todos los elementos dentro de esta área pertenecen y forman un grupo distinto de todos los demás elementos circundantes.

Un simple borde o límite puede acelerar el proceso de extracción de información de una escena o visualización, podemos dirigir nuestra atención a elementos específicos sin tener que escanear todos los elementos visuales, los elementos dispares se vuelven más significativos.

Ley de región común.png

Aplicación práctica:

  • Se pueden usar bordes, márgenes, cuadrículas y líneas que nos ayudan a distinguir un conjunto de información de otro, identificar agrupaciones y centrarnos en una pequeña cantidad de elementos relevantes.

Ley de región común_ejemplo.png

Ley de sincronía​

Ocurre cuando los elementos visuales aparecen al mismo tiempo pero no están en movimiento.

Cuando varios acontecimientos suceden al mismo tiempo tendemos a percibirlos agrupados o interpretamos que comparten el mismo significado.

Ejemplo: luces que encienden al mismo tiempo se distinguen de aquellas que se quedan apagadas.

Ley de la sincronía.png

La aparición de elementos de manera simultanea ayuda a los usuarios a centrarsu atención en aquellos elementos activos y con los cuáles puede interactuar.

Ley de la sincronía.png

Pareidolia​

Se refiere a nuestra propensión innata a imponer estructura y extraer patrones significativos de elementos visuales vagos o aleatorios.

Proviene de la apofenia, la experiencia que consiste en percibir patrones, conexiones en sucesos aleatorios o en datos aparentemente sin sentido.

Pareidolia.png

Notas rápidas:

  • La percepción humana tiende naturalmente a formar grupos, patrones y objetos organizados a partir de información visual.
  • La percepción humana está "programada" para ver, ante todo, objetos completos; ¿De qué nos serviría una masa de líneas, curvas e información ambiental desconectadas?
  • El mundo puede estar lleno de formas y objetos complejos, pero la percepción humana procesa estas formas complejas de una manera que nos deja con una representación mental mucho más simple.
  • El sesgo perceptivo de interpretar las cosas simétricas como más atractivas es inconsciente y muy probablemente tiene su origen en la forma en que seleccionamos parejas sanas.
  • El uso de unas pocas líneas simples o espacios en blanco/negativos puede cambiar completamente nuestra percepción de una escena o imagen visual.

Los beneficios de un enfoque de diseño impulsado por la Gestalt

Beneficios del uso adecuado​

Ayuda a los usuarios a localizar la información y los elementos visuales de manera sencilla y rápida. "Percibir la estructura de nuestro entorno nos ayuda a dar sentido a los objetos y eventos rápidamente" Jeff Johnson (Designing With the Mind in Mind, 2010).

El uso de formas significativas del mundo físico pueden ayudar a promover la comprensión y la conciencia inmediata de cómo se agrupan los elementos y cómo funcionan.

El uso del recurso de la organización figura-fondo es uno de los más llamativos que atraen la mirada del usuario con mayor intensidad.

El usuario debería poder identificar los elementos relevantes de la tarea de un vistazo o, al menos, sin tener que dedicar una cantidad significativa de tiempo a revisar conscientemente la pantalla.

Las presentaciones simples, claras y explícitas liberan al usuario de la mayor parte de la responsabilidad de toma de dicisiones; dejando además poco margen para malas interpretaciones.

Nos ayudan tanto a agrupar como a distinguir, así un angosto espacio nos ayuda a agrupar, y una mayor separación a diferenciar, de igual amnera, la similitud nos ayuda a unir, y una disimilitud a diferenciar.

Debemos ayudar al usuario a responder las siguientes preguntas en el menor tiempo con un vistaso rápido: ¿Dónde estoy? ¿Qué hay disponible? ¿Qué puedo hacer? ¿A dónde puedo ir?

Llama la atención del usuario, ya sea sobre partes de la pantalla que sean necesarias para sus tareas o para propios fines, modificando así la asignación de la atención.

La composición, el orden y la estructura también son importantes para que el usuario pueda establecer cuál de los elementos requiere su atención y cuándo.

Consecuencias del uso incorrecto​

Cuando todos los elementos se colocan en el mismo espacio sin nada que los separe según su función, significado o relevancia, la visualización es muy difícil de escanear.

Si los usuarios no pueden distinguir un grupo de elementos de otro, tardarán más en sus tareas, cometerán errores o simplemente abandonarán el sitio o la aplicación.

Si los elementos no se comportan como las características del mundo real, es probable que los usuarios se confundan y cometan errores al intentar interactuar con el diseño de acuerdo con sus expectativas basadas en el mundo físico.

Si bien dividir la pantalla en compartimentos puede ayudar al usuario, si cada una de estas secciones está repleta de muchas imágenes, textos y otros elementos diferentes, entonces no sabrá dónde dirigir su atención.

Las visualizaciones complejas, ambiguas y confusas obligan al usuario a salir de su estado mental orientado a las tareas.

Aplicación práctica:

  • Ley de similitud: disminuir la similitud con el resto de la pantalla captará instantáneamente la atención del usuario.

  • Ley de proximidad: el uso de espacios en blanco entre los elementos puede dirigir la atención.

  • Ley de figura/fondo: reducir las características superficiales seductoras de un área de la pantalla y aumentar esas cualidades en una región específica probablemente atraerá la atención del usuario.

image-20250210-225740.png

Notas rápidas:

  • La velocidad con la que somos capaces de separar los elementos interesantes de los no interesantes o los útiles de los innecesarios depende en gran medida de la estructura, el orden y la disposición de la información.
  • Si bien las manipulaciones pueden ser leves y sutiles, son poderosas y tienen el potencial de mejorar las experiencias del usuario y la productividad como resultado directo.
  • Todos los elementos de la interfaz no siempre son significativos al mismo tiempo. Los usuarios realizan tareas en diferente orden, incluir todos los elementos a la vez podría resultar confuso y tedioso, además alentar las subtareas.

Recursos adicionales

https://lawsofux.com/https://ui-patterns.com/patterns/https://medium.com/@mirdesign/teor%C3%ADa-de-la-gestalt-3f79694c070bhttps://www.youtube.com/watch?v=F0_zH-XWiy4