13.5: Teoría de la Gestalt
- Page ID
- 68012
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\( \newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\)
( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\id}{\mathrm{id}}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\kernel}{\mathrm{null}\,}\)
\( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\)
\( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\)
\( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\AA}{\unicode[.8,0]{x212B}}\)
\( \newcommand{\vectorA}[1]{\vec{#1}} % arrow\)
\( \newcommand{\vectorAt}[1]{\vec{\text{#1}}} % arrow\)
\( \newcommand{\vectorB}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vectorC}[1]{\textbf{#1}} \)
\( \newcommand{\vectorD}[1]{\overrightarrow{#1}} \)
\( \newcommand{\vectorDt}[1]{\overrightarrow{\text{#1}}} \)
\( \newcommand{\vectE}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash{\mathbf {#1}}}} \)
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\(\newcommand{\avec}{\mathbf a}\) \(\newcommand{\bvec}{\mathbf b}\) \(\newcommand{\cvec}{\mathbf c}\) \(\newcommand{\dvec}{\mathbf d}\) \(\newcommand{\dtil}{\widetilde{\mathbf d}}\) \(\newcommand{\evec}{\mathbf e}\) \(\newcommand{\fvec}{\mathbf f}\) \(\newcommand{\nvec}{\mathbf n}\) \(\newcommand{\pvec}{\mathbf p}\) \(\newcommand{\qvec}{\mathbf q}\) \(\newcommand{\svec}{\mathbf s}\) \(\newcommand{\tvec}{\mathbf t}\) \(\newcommand{\uvec}{\mathbf u}\) \(\newcommand{\vvec}{\mathbf v}\) \(\newcommand{\wvec}{\mathbf w}\) \(\newcommand{\xvec}{\mathbf x}\) \(\newcommand{\yvec}{\mathbf y}\) \(\newcommand{\zvec}{\mathbf z}\) \(\newcommand{\rvec}{\mathbf r}\) \(\newcommand{\mvec}{\mathbf m}\) \(\newcommand{\zerovec}{\mathbf 0}\) \(\newcommand{\onevec}{\mathbf 1}\) \(\newcommand{\real}{\mathbb R}\) \(\newcommand{\twovec}[2]{\left[\begin{array}{r}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\ctwovec}[2]{\left[\begin{array}{c}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\threevec}[3]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\cthreevec}[3]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\fourvec}[4]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\cfourvec}[4]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\fivevec}[5]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\cfivevec}[5]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\mattwo}[4]{\left[\begin{array}{rr}#1 \amp #2 \\ #3 \amp #4 \\ \end{array}\right]}\) \(\newcommand{\laspan}[1]{\text{Span}\{#1\}}\) \(\newcommand{\bcal}{\cal B}\) \(\newcommand{\ccal}{\cal C}\) \(\newcommand{\scal}{\cal S}\) \(\newcommand{\wcal}{\cal W}\) \(\newcommand{\ecal}{\cal E}\) \(\newcommand{\coords}[2]{\left\{#1\right\}_{#2}}\) \(\newcommand{\gray}[1]{\color{gray}{#1}}\) \(\newcommand{\lgray}[1]{\color{lightgray}{#1}}\) \(\newcommand{\rank}{\operatorname{rank}}\) \(\newcommand{\row}{\text{Row}}\) \(\newcommand{\col}{\text{Col}}\) \(\renewcommand{\row}{\text{Row}}\) \(\newcommand{\nul}{\text{Nul}}\) \(\newcommand{\var}{\text{Var}}\) \(\newcommand{\corr}{\text{corr}}\) \(\newcommand{\len}[1]{\left|#1\right|}\) \(\newcommand{\bbar}{\overline{\bvec}}\) \(\newcommand{\bhat}{\widehat{\bvec}}\) \(\newcommand{\bperp}{\bvec^\perp}\) \(\newcommand{\xhat}{\widehat{\xvec}}\) \(\newcommand{\vhat}{\widehat{\vvec}}\) \(\newcommand{\uhat}{\widehat{\uvec}}\) \(\newcommand{\what}{\widehat{\wvec}}\) \(\newcommand{\Sighat}{\widehat{\Sigma}}\) \(\newcommand{\lt}{<}\) \(\newcommand{\gt}{>}\) \(\newcommand{\amp}{&}\) \(\definecolor{fillinmathshade}{gray}{0.9}\)El diseño gráfico puede ser fuente de conflicto en algunos lugares de trabajo. La gente suele tener opiniones fuertes sobre lo que les gusta y lo que no les gusta cuando se trata de imágenes. Vamos por nuestro presentimiento. Pero, estos sentimientos viscerales son altamente subjetivos y se basan en nuestro contexto individual. Esto puede dificultar la evaluación justa de los gráficos cuando no somos el público objetivo. A veces, ayuda tener algo de lenguaje para hablar sobre las opciones de diseño.
La Teoría Gestalt es un marco para entender cómo las personas ven las imágenes en su conjunto. Fue desarrollado en la década de 1920 por los psicólogos alemanes Max Wertheimer, Wolfgang Kohler y Kurt Koffka. El término Gestalt significa todo unificado. Gestalt funciona porque la mente busca organizar la información visual. Existen seis principios básicos de la Gestalt: (1) similitud, (2) continuación, (3) cierre, (4) proximidad, (5) figura/suelo, y (6) simetría y orden.
Similaridad

Cuando los elementos visuales tienen una forma similar o se ven entre sí, un espectador a menudo conectará los componentes discretos y verá un patrón. Este efecto se puede utilizar para crear una sola ilustración, imagen o mensaje a partir de una serie de elementos separados. Básicamente, si algo tiene la misma forma, color, tamaño o textura, los humanos los verán como vinculados. Por ejemplo, cada sección de 'Preguntas para Reflección' de este libro tiene el mismo color, forma y disposición. Si comienzas a usar una fuente y un tamaño en particular para un encabezado, debes continuar con el patrón para que los lectores no se confundan.
Continuación

La continuación es la tendencia de la mente a ver una sola línea continua de conexión en lugar de componentes discretos (ver Figura 12.2). El ojo se dibuja a lo largo de una trayectoria, línea o curva, siempre y cuando haya suficiente proximidad entre los objetos para hacerlo. Esta tendencia se puede utilizar para apuntar hacia otro elemento en la composición, o para dibujar la mirada alrededor de una composición. El ojo continuará por el camino o dirección sugerida por la composición incluso cuando la composición termine, continuando más allá de las dimensiones de la página.
Para entender este principio, piensa en esta famosa ilusión óptica, que es un dibujo de un árbol que tiene varias caras ocultas en él. Eres capaz de ver las caras porque tu mente “continúa” las líneas para completar la forma del rostro.
Cierre

El cierre es una técnica de diseño que utiliza la tendencia de la mente a completar formas incompletas (ver Figura 12.3). El principio funciona si al espectador se le da suficiente información visual para percibir una forma completa en el espacio negativo. En esencia, la mente 'cierra' una forma, un objeto o una composición. En el ejemplo anterior, el triángulo está formado por la mente del espectador, que quiere cerrar la forma formada por los huecos y espacios de los círculos y líneas adyacentes. El triángulo parcial, delineado en negro también insinúa la forma faltante. La ilusión óptica anterior es también un ejemplo de cierre, porque tu mente 'cierra' la forma de la cabeza.
Proximidad

La proximidad es una disposición de elementos que crea una asociación o relación entre ellos (ver Figura 12.4). Si los elementos individuales son similares, probablemente se percibirán primero como un todo y en segundo lugar como componentes discretos. Si, como en el ejemplo anterior, algunos de los componentes se forman para crear un “entero” grande, elementos similares posicionados lejos de la forma principal también se asociarán con la forma grande. En este caso, el espectador los interpreta como caerse o alejarse de la forma principal. Las formas utilizadas no tienen que ser geométricas para crear el efecto de proximidad. Cualquier componente que sea similar en forma, color, textura, tamaño u otro atributo visual puede lograr proximidad.
Pensar en la proximidad te ayuda a pensar en cómo tu audiencia está encontrando relaciones entre las partes de tu documento. Por ejemplo, si una foto está bajo un titular en un periódico, el público asociará los dos elementos. Muchos de los titulares contenidos en esta lista de famosos errores periodísticos, por ejemplo, son errores de proximidad.
Figura/Suelo

La segregación figura/suelo se refiere al contraste entre el primer plano y el fondo de una imagen. Los diseñadores gráficos suelen utilizar este principio para diseñar el espacio negativo alrededor de un objeto. El área donde se usa más comúnmente es cuando se coloca texto sobre una imagen. Si no hay suficiente contraste entre la figura y el suelo, el lector no podrá leer el texto.
Simetría y orden

La simetría y el orden siguen la premisa de que una composición no debe crear una sensación de desorden o desequilibrio (ver Figura 12.6), porque el espectador perderá el tiempo tratando de reordenarla mentalmente en lugar de enfocarse en el contenido incrustado. El ejemplo fotográfico de la Figura 12.7 se compone simétricamente y permite al espectador concentrarse en la figura en el centro. Alcanzar la simetría en una composición también le da equilibrio a la composición y una sensación de armonía.

Para ver la Teoría Gestalt en acción, navega por esta imagen de un cartel de un festival de cine de los años 50. Vea cuántos principios puede encontrar, luego haga clic en los puntos de acceso para ver algunos de los principios.
Consulta\(\PageIndex{1}\)
Descripción de la imagen
Descripción de la imagen de la Figura 12.2: Una serie de rectángulos redondeados alineados para crear una línea curva continua a través de las formas para ilustrar el principio de continuidad.
Figura 12.7 Descripción de la imagen: Un póster para la Feria Mundial de Chicago, que tiene un fuerte sentido de simetría en su composición. Hay una gran torre que se extiende a través de la mitad de la página y dos torres más pequeñas de igual longitud a cada lado de la misma.