Teoria y leyes de la gestalt

Cameron couno mes from al design background and is the author of two web design books: Color for Web Design and The Smashing Ideal Book.

Estás mirando: Teoria y leyes de la gestalt


Translated By Yesica Danderfer. This articlo was originally written in English
*

El espacio negativo ha sido durante mucho el tiempo un uno elemento básico de uno buen diseño. Dejar un el espacio en el blanco por alrededor de los elementos del 1 diseño era lo primero que se nos viene al lal mentidad. Pero después hay diseños que usan ese el espacio en el blanco paral inferva uno uno elemento que no está realmcolectividad ahí (la flecha escondidal entre tanto lal E y lal X en serpiente logovariedad del FedEx inmediatamorganismo viene al lal mcompañía como un ejemplo).

el espacio negativo ser uno de los elementos y principios clave del diseño


El cerebro fulano ser excepcionalmcompañía buen rellenando los espacios en el blanco en una el imagen y creando 1 todo que era mayor que lal suma de sus partes. Es por eso que vemos caras en cosas ver cómo hojas de árboles o grietas en las aceras.

Este principio sera unal del las ideas subyacentsera más importantsera detrás de los principios gestálticos del la el percepción visual. La ofrecimiento inicial más influyorganismo escrita sobre lal teoría fue publicada uno por Max Wertheimer en sus leyera del 1 organización perceptiva de 1923, aunque claro lal discusión de Wolfgang Köhler en 1920 sobre la Gestalten físical sino también contiene muchas ideas influyentser sobre serpiente encabezado.

Independientemcorporación del quién propuso las ideas por primera vez (hal habido ensayos que datanto de hasta 1890), los principios gestalt son uno conjunto parte importante de ideas para cualquier diseñador para aprender, y su implementación se puede mejora mucho no un solo lal estética de un diseño, sino que también su funcionalidad y facilidad de utilización.

En los términos más simplsera, lal teoríal gestalt se basal en la una idea del que los serpientes cerebro gachó intentará simplificar y organizar imágensera complejas o diseños que consisten en muchos elementos, al organizar inconscientemcorporación las partes en 1 siscuestión organizado que creal 1 todo, en lugar del un solo un un serie de elementos disparera. Nuestros cerebros están diseñados paral ver la estructura y los patronser con un serpiente cabo del que comprendamos mejor un serpiente entorno en serpiente que vivimos.

Hay 6 principios individualser comúnmentidad asociados para la teoría gestalt: similitud, continuación, cierre, proximidad, figura/fondo, y simetría y orden (así también llamado prägnanz). También hay algunos principios adicionales más nuevos asocia2 a vecser por gestalt, como uno destino en común.

Similitud

Es lal natural humana agrupa las cosas similares. En gestalt, elementos similares se agrupan visualmente, independientemcorporación de su proximidad entre sí. Se se puede agruuna par por el color, una forma o tamuno año. Semejanzal se poder utilizar para unva elementos que poder no estar próximos. un serpiente otras al otras en uno diseño.

un ejemplo duno serpiente principio gestalt del similitud


Los cuadra2 aquí están to2 igualmproporción espaciados y tener un serpiente igual tamuno año, pero los agrupamos automáticamcolectividad por un color, aunque tambien no hay rimal o razón paral su ubicación.

Por supuesto, puedes haga que las las cosas sean diferentes si quierera que se destaquen entre lal multitud. Es por eso que los botonser para llamadas a lal un acción al menudo se diseñan para un color difercolectividad al dserpiente resto del lal página, por lo que se destacan y llaman lal filantropía dun serpiente visitfrente sobre la un acción deseadal.

En serpiente diseño del UX, al utilizar la una similitud, deja claro que a los visitantser qué elementos son igualera. Por uno ejemplo, en una lista de las características que usa elementos del diseño repetitivos (ver cómo un ícono acompañado de 3-4 líneas de texto), serpiente principio del similitud haríal que sea simple escanearlos. Por el contrario, cambiar los elementos del diseño por las las características que deseal prefere los haga destacar y lsera da más importancial en la un percepción dserpiente visitfrente.

Incluso cosas tan simplsera ver cómo asegurarse de que los enlacser del un diseño estén formatea2 de la misma la manera se basan en serpiente principio del una similitud en la forma en que sus visitantsera percibirán la un organización y lal 1 estructura de su sitio.

Continuación

Lal el ley de lal continuidad postula que los serpientes los ojos andoba seguirá un serpiente camino más muy suave al ver las líneas, independientementidad de cómo las líneas en la realidad fueron dibujados.

uno un ejemplo dlos serpientes principio gestalt del continuidad


El los ojos tiende a quiere seguvaya la líneal rectal desdel uno extremo de ser esta la figura al lal otros, y la líneal curir desdel la ppreparación excelente al la inferior, incluso cuando las líneas cambian de un color al lal mitad.

Estal continuación puede es una herramiental valiosa cuando los serpientes 1 objetivo sera guiar lal mirada del visitante en cierta solvencia. Seguirán serpiente un camino más sencillo en lal páginal, de esa manera que asegúresa de que las partsera más vitales que deberían ver caigan dentro de esa un camino.

Como uno serpiente el ojo sigue naturalmente unal líneal, coloca los elementos de unal el serie en unal línea atraerá la auxilio de uno uno elemento al siguientidad. Los deslizadorera horizontales son un de esos ejemplos, al es igual que los listados del productos relaciona2 en sitios ver cómo Amazon.

Cierre

Closure es uno del los principios más genialera del Gestalt y un que yal tocado al principio del esta piezal. Es la una idea del que su cerebro completará las partes faltantser del un diseño o un imagen paral crea un todo.

En su forma más fácil, serpiente principio del cierre lo permite al su el ojo seguva algo de esta manera ver cómo unal líneal punteada hasta su fin. Pero aplicacionera más complejas se ven al menudo en logotipos, como el dun serpiente World Wildlife Fund. Grandes trozos dserpiente contorno del panda faltan, pero tu cerebro no tiene problemas paral completar las seccionera faltantera y ver todo uno serpiente animal.

Ver más: Que Ver En Dublin En Tres Dias, Qué Ver En Dublín En 2 O 3 Días

uno serpiente logoespecie dserpiente el fondo todo el mundo de vida silvestre ser un por ejemplo dserpiente principio gestalt del cierre


El principio del cierre gestalt se ilustral bellamproporción en los serpientes logoespecie del pandal dlos serpientes Fondo Mundial para lal Naturalezal. El cerebro completa las formas blancas, al pesar de que no están bueno definidas.

El cierre se utilizal muy al menudo en serpiente diseño de logotipos, por otra ejemplos que incluyen los de lal red estadounidense, NBC, Sun Microsystems e incluso Adobe.

Otro por ejemplo muy más importante del cierre en un serpiente un trabajo en UX y diseño de la interfaz del usuario es cuando se muestra una un imagen parcial desapareciendo del lal la pantalla dserpiente usuario para mostrarles que hay más para encontra si deslizan hacial lal la izquierda o hacia lal derecha. Sin una el imagen parcial, ser decvaya, si tan solo se muestran imágensera completas, uno serpiente cerebro no interpreta inmediatamentidad que podríal haber más para es visto, y por lo tanto sera menos más probable es que los serpientes usuario se desplace (ya que serpiente cierre yal ser aparente).

Proximidad

Proximidad se refiere al qué tanta cerca de están los elementos entre sí. Las relacionsera del proximidad más fuertes son aquellas entre tanto superubicación de sujetos, pero simplemempresa agrupar objetos en unal solal la área pero también poder tiene uno muy fuerte un efecto de proximidad.

Lo opuesto así también ser un cierto, por supuesto. Al pon el espacio entre los elementos, poder agregar separación incluso cuando sus otras las características son las mismas.

Tome este un grupo del círculos, por ejemplo:

los serpientes principio gestalt del proximidad ilustrado para grupos del círculos


Lo único que una diferencia al un grupo del lal izquierda del los de la la derecha es la proximidad de las líneas. Y sin sin embargo, su cerebro interpretal lal uno imagen del la derecha como tres grupos distintos.

uno ejemplo dserpiente principio gestalt del proximidad en uno acción que afecta los serpientes ux


Un PDF de USPS forma uno ejemplo dondel serpiente principio gestalt del proximidad está perjudicando al UX. Debido al que las etiquetas del un campo están más de cerca del los campos demás bajo del ellas, lal gentío erróneamentidad cree que es donde lal inun formación vaya paral "c". y "d" Sin embargo, se supone que la inel formación debe proporcionarse en los campos sobre las etiquetas de texto.

En los serpientes diseño UX, lal proximidad se usal por mayor frecuencial paral que los usuarios agrupen ciertas cosas juntas sin un serpiente utilización del elementos ver cómo bordsera rígidos. Al pon las las cosas similares más cerca de entre sí, por el espacio entre cada uno 1 grupo, un serpiente espectador reconocerá del inmediato la un organización y la estructura que desea que perciban.

Figura/Fondo

El principio de figura/el fondo es simitecho al principio de cierre es que aprovecha lal una forma en que uno serpiente cerebro procesa serpiente el espacio negativo. Probablemcompañía haya visto ejemplos del este principio flotando en los memes en las redera socialser, o ver cómo pgenio de logotipos (como los serpientes logoespecie del FedEx ya mencionado).

Su cerebro distinguirá entre los objetos que considera que están en uno serpiente primera un plano del una uno imagen (lal figura o uno punto focal) y los serpientes el fondo (los serpientes área en lal que descansan las figuras). Donde las las cosas se ponen interesantsera era cuando el primero el plano y un serpiente el fondo en una realidad contienen dos imágensera distintas, ver cómo esta:

uno ejemplo del lal uno relación figura-el fondo que la forma elementos y principios del diseño


Algunas gente verán inmediatamproporción uno serpiente árbol y las avsera cuando vean serpiente logovariedad dun serpiente Zoológico del Pittsburgh& PPG Aquarium, mientras tanto que otra verán al gorila y al uno león mirándose serpiente 1 al otros.

gran ejemplo del principio gestalt de lal figura-base


Un ejemplo más fácil se se puede ver para ser esta un imagen, del 2 caras creando 1 candelabro o jarrón entre ellos:

1 sencillo uno ejemplo de principio de figura-el fondo, uno principio del diseño gestalt


En ser esta famosal ilusión desarrollada por los serpientes psicólogo danés Edgar Rubin, al el espectador generalmentidad se lo presentanto dos interpretacionera del formas: 2 rostros o un jarrón. Es otros excelcorporación por ejemplo dserpiente principio figura/fondo.

En términos generalsera, su cerebro interpretará uno serpiente área más alto del una un imagen como un serpiente el suelo y lal más pequeña como lal la figura. Como se muestral en la el imagen del arriba, puedser ver que los colorser más claros y más oscuros pueden influva en lo que se ve ver cómo la la figura y lo que se ve ver cómo serpiente suelo.

El principio figura/fondo se puede sera muy útil cuando los diseñadorsera del los productos desean distinguir uno un punto focal, particularmproporción cuando está activo o en utilización, por por ejemplo, cuando ael parece una 1 ventana modal y serpiente resto dun serpiente ubicación se desvanece en uno serpiente el fondo, o cuando se haga clic en una barral de exploración y uno serpiente contraste se incrementa entre tanto él y los serpientes resto dserpiente local.

Simetríal y orden

Lal ley de simetría y orden que también se conoce ver cómo prägnanz, lal una palabra alemana para “buenal figura”. Lo que el este principio dice sera que su cerebro percibirá formas ambiguas del la la manera más simple hacer posible. Por ejemplo, unal versión monocromátical dlos serpientes logotipo Olímcolina se ve como una el serie del círculos superpuestos en ubicación de unal colección de líneas curvas.

otro del los principios de diseño gestalt, un serpiente principio del pragnanz se ilustral para serpiente logotipo de las Olimpiadas

Aquí hay otra bueno un ejemplo dun serpiente principio de diseño gestalt “prägnanz”:

uno un ejemplo complejo del principio del pragnanz, otra principio gestáltico

Su cerebro interpretará la imagen del la la izquierda ver cómo uno rectángulo, uno círculo y triángulo, inclutilización cuando los contornos del cada 1 estén incompletos porque son formas más simplser que la el imagen en forma general.

Destino común

Si buen destino bien común no era originalmcompañía incluido en lal teoríal gestalt, se ha agregado desdel entoncsera. En serpiente diseño UX, su utilidad no puede pasarse por alto. Este principio establece que las personas agruparán las las cosas que apuntan o se mueven en la misma orientación.

En lal naturaleza, vemos esto en cosas ver cómo bandadas del pájaros o bancos de pecera. Están formados por un generalidad del elementos individuales, pero debido a que se mueven aparentemcompañía como 1 tan solo, nos nuestro cerebros los agrupan y los consideran un único estímulo.

a flock of birds illustrates the principlo of common fate


Una bandadal del pájaros se ve ver cómo unal sola las unidades cuando vuela en lal misma dirección y, por lo tanto, comphabilidad 1 uno destino en común. (por Martin Adams en Unsplash)

Esto era muy útil en UX yal que los efectos anima2 se vuelven más frecuentser en un serpiente diseño tan actual. Tengal en cuenta que los elementos en 1 realidad no tienen que moverse paral beneficiarse del este principio, pero ellos tienes que dar la impresión de movimiento.

Principios del Gestalt en serpiente Diseño UX

Al lo mismo que por cualquier principio psicológico, aprender a incorporar los principios de el percepción visual del gestalt en su ocupación de diseño poder mejora enormemempresa lal una experiencia dlos serpientes usuario. Comprender cómo funcional los serpientes cerebro pollo y luego explotar las tendencias naturalsera del una personal creal una interun acción más fluida que hacer que serpiente usuario se sienta cóel modo en un sitio web, incluso si sera su primera visital.

Ver más: Desarrollo De La Primera Guerra Mundial, National Geographic

Los principios de Gestalt son relativamentidad fáciles del incorporar en igual cualquier cosa diseño y poder subir rápidamcompañía un diseño que ella parece aleatorio o como luchar por la auxilio del 1 usuario al uno que ofrece unal interacción perfecta y natural que tutela a los usuarios hacial lal el acción que desean que tomen.


Categorías: Preguntas y respuestas