¡DISEÑO UI! Las leyes de Gestalt
Tags: ui, design, webdev, spanish
Published: 2024-01-17 13:50:47


Hola Mundo, hoy vamos a hablar de un aspecto teórico del diseño UI


## **¿Qué son las leyes de Gestalt?**
Son unas serie de leyes que creo la facultad de Gestland, estas leyes se crearon a partir de como los humanos interpretamos las cosas.
Estas leyes ayudan al diseñador a interpretar como focalizar el objetivo del diseño de cara al Usuario.

**Ley de figura y fondo**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/o0hm8lfdf73bko60trpi.png)

En todo diseño hay una figura y un fondo, estas se diferenciaran por su forma, tamaño o color.

> _Otras formas de diferenciar la figura del fondo: Sombras, bordes, patrones, etc_

**Ley de la semejanza**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ky47dl713z7mee26gijc.png)

Si hay elementos que son similares, el cerebro asociará que están en un mismo grupo.


> _Como hacer semejanzas: Por forma, por tamaño, por color, etc._

**Ley de la proximidad**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q4v76wgi3rzv19vl097x.png)

Si hay elementos cerca, el cerebro los asocia como un mismo grupo pero, si están lejos los toma como grupos separados.

> _Otras formas de separar y agrupar: Espacios, líneas, colores, peso de la fuente, etc._

**Ley del cierre**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lqypj2t77ksrqasy0x60.png)


El cerebro cierra los espacios de las figuras así no estén completas

> _Como hacer cierres: Puntos, líneas discontinuas, sombras desplazadas, etc._

**Ley de la pregnancia**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/37kq483jtb0oz8w9k9s0.png)

En un diseño debe haber un elemento que resalte más que los demás (Elemento más importante).

> _Como resaltar: Peso de la fuente, color diferente, líneas, fondo, capas, etc._


**Ley de la experiencia**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tw0uo5nnlx45g1m241rm.png)

El ser humano tiene experiencias previas almacenadas en el subconsciente y puede relacionar elementos.

> _Como aplicar: Botones con sólo bordes, figuras nuevas con texto, iconos en vez de textos, etc._

**Ley de la simplicidad**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ag75ca0rpm6j36c3tu8v.png)

El cerebro simplificará lo que más pueda las figuras y elementos.

> _Como simplificar: Utilizar la cantidad mínima de elementos posibles (bordes, separadores, cajas, etc)_


**Ley de la simetría y el orden**


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kehg086umjzxbr6782ee.png)


El cerebro asocia en un mismo grupo a los elementos que tienen simetría.

> _Como hacer simetría: Compensar espacios, alinear elementos, etc._

**Ley de la continuidad**

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sk3vf9or18gunrw3f0ja.png)

El cerebro asocia a los elementos que siguen una misma dirección, como parte de un mismo grupo.

> _Como hacer continuidad: Carruseles, tabs, secuencias, partir elementos, etc._


**Conclusiones**
Si quieres ser un experto en UI debes manejar muy bien las leyes de Gestalt, te ayudarán en gran medida para obtener interfaces intuitivas, limpias y profesionales.

Si os gusta mi contenido no dudéis en darle apoyo.



- Linkedin: https://www.linkedin.com/feed/
- GitHub: https://github.com/EloyParga