¿Qué es la proporción dorada? Qué necesitas saber y cómo usarla

¿Qué es la proporción dorada? Qué necesitas saber y cómo usarla

Descubre qué tienen en común las Pirámides de Giza y la Mona Lisa de Da Vinci con Twitter y Pepsi.

La Proporción Dorada es una proporción matemática. Se encuentra comúnmente en la naturaleza y cuando se usa en diseño, alberga composiciones que se ven naturales y orgánicas que son estéticas y complacen a la vista. ¿Pero que es exactamente la proporción dorada y cómo puedes usarla para mejorar tus propios diseños?

¿Qué es la Proporción Dorada?

De la manera más  simple que podemos (¡uf!), La Proporción Dorada (también conocida como la Sección Dorada, Medio Dorado, Divina Proporción de la letra Phi Griega) existe cuando una línea es dividida en dos partes y la parte más larga (a) dividida por la parte más corta (b) es igual a la suma de (a)+ (b) dividida por (a), y ambos son iguales a 1.618.

Pero no dejes que tanta matemática te deprima. En diseño, la Proporción Dorada se reduce a estética, crear y apreciar un sentido de belleza a través de la armonía y la proporción. Cuando se aplica al diseño, la Proporción Dorada provee de un sentido de arte, un factor X; un cierto je ne sais quoi (no sé qué).

Esta armonía y proporción se ha reconocido por miles de siglos: desde las Pirámides de Giza al Partenón en Atenas; desde La Creación de Adán de Miguel Ángel en el techo de la Capilla Sixtina hasta la Mona Lisa de Da Vinci; y del logo de la Pepsi al logo de Twitter. Aún nuestros cuerpos y caras, siguen la proporción matemática.

El Foro de la Ciencia

De hecho, nuestro cerebro parece estar con un cableado especialmente para preferir objetos e imágenes que usen la Proporción Dorada. Es casi una atracción subconsciente y aún pequeños ajustes que hagan una imagen más cercana a la  Proporción de Oro, tiene un impacto mayor en nuestro cerebro. La proporción de Oro también se puede aplicar a formas. Toma un cuadrado y multiplica un lado por 1.168 y obtienes un rectángulo de proporciones armoniosas:

Ahora, si acuestas el cuadrado sobre el rectángulo las dos formas te darán la Proporción Dorada.

Si continuas aplicando la fórmula de la Proporción Dorada al nuevo rectángulo en la extrema derecha de la imagen arriba, eventualmente obtendrás éste diagrama con cuadrados progresivamente menores:

¡Bien! ¿Necesitas un descanso?

Espera, solo unas pocas confusiones mentales más para terminar. Si tomas nuestro diagrama de la Proporción Dorada, arriba, y pintas un arco en cada cuadrado, desde una esquina hasta la esquina opuesta, estarás dibujando la primera línea de la Espiral Dorada (o secuencia de Fibonacci), una serie en la que el patrón de cada número es la suma de los dos números previos. Empezando en cero la secuencia es: 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144…y  así continúa.

Al añadir el arco a cada cuadrado, terminas con el diagrama de la Espiral Dorada:

 

 

Encontrarás esta hermosa criatura en todas las formas de la naturaleza, helechos, flores, conchas de mar, y hasta los huracanes, tal vez sea por eso que los encontramos tan atractivos visualmente.

Porque es, de hecho, la naturaleza en su máxima expresión.

natureandwisdom.wordpress.com

Ahora da un paso más y traza un círculo dentro de cada cuadrado, ahora tienes círculos que siguen la proporción de 1:1.618 y están en una proporción balanceada entre ellos.

Así que ahora tenemos cuadrados, rectángulos y círculos que siguen todos la Proporción Dorada y salpican la magia (del número) en tu diseño.

¿Terminamos con las explicaciones?

5 Formas de Aplicar la Proporción Dorada a tus Diseños

Ahora que has sido golpeado en la cabeza con la teoría detrás de la Proporción Dorada, vamos a figurar como puede ser usada para mejorar tus diseños. Puedes aplicar la Proporción Dorada a muchos elementos que componen tu diseño incluyendo el plano, espaciado, contenido, imágenes y formas.

01. Plano - Configura Tus Dimensiones Con La Proporción Dorada

Considera la Proporción Dorada como una guía útil para determinar las dimensiones del plano. Una forma muy simple de aplicar la Proporción Dorada es configurar tus dimensiones a 1:1.618.

Por ejemplo, toma tú típico plano de ancho de 960-pixeles y divídelo por 1.618. Obtienes 594, que será el alto de tu plano.

Ahora, divide ese plano  en dos columnas usando la Proporción Dorada y voila! (¡ahí está!).

Trabajando con estas dos formas tu plano cumplirá con las proporciones armoniosas de la Proporción Dorada.

El plano de dos columnas está bien adaptado al diseño web y verás mucho contenido en línea con éste formato. National Geographic ha adoptado este plano y lo usa para tener un sitio web bien organizado limpio y fácil de leer. Les ofrece a los lectores un sitio web que tiene una sensación natural de orden, balance y jerarquía.

National Geographic website

02. Espaciado - Plano con el Diagrama de la Proporción Dorada

El Espaciado es un elemento muy importante de cualquier diseño, sea el uso de espacio positivo o negativo, y con frecuencia puede hacer o deshacer el resultado final. Determinar el espaciado de los elementos puede ser una aventura que consuma mucho tiempo; mejor, empieza con el diagrama de la Proporción Dorada y deja que los cuadrados te digan dónde poner cada elemento. Esto te asegurará que tu espaciado y tus proporciones están calculados, más que “instintivamente”, como cualquier otro pequeño ajuste para lograr la Proporción Dorada puede hacer toda la diferencia.

Si además están manejando varios elementos, puedes poner diagramas de la Proporción Dorada en capas para continuar con las proporciones consistentes a todo lo largo de tu diseño.

El estudio de diseño Moodley  desarrollo una marca de identidad para el festival de las artes escénicas de Bregenzer Festspiele que incluye un logo, logotipo y el diseño de un collage aplicado a los programas, carteles y campañas al aire libre. El cartel tiene características fotográficas y collages ilustrativos y un logo ondulado con mucho espacio sin imprimir. La Proporción Dorada se usó para determinar el tamaño y localización de cada elemento para asegurar una cubierta bien proporcionada.

Bregenzer Festspiele by Moodley

La agencia de Diseño basada en Singapur Lemon Graphic creo una identidad visual para Terkaya Wealth Management. Aquí los tres elementos del diseño de la tarjeta de negocios- una pequeña águila, el texto y un águila más grande- todas se ajustan en una sección diferente de la Proporción Dorada.

Además, ponen una Proporción Dorada sobre el águila pequeña que también se ajusta a las proporciones.

Terkaya by Lemon Graphic.

03. Contenido - Traza la Espiral Dorada

La espiral dorada puede usarse como una guía para determinar la colocación del contenido. Nuestro ojo es naturalmente atraído al centro de la espiral, que es donde se verán los detalles, así que enfoca tu diseño en el centro de la espiral y coloca áreas de interés visual dentro de la espiral. Vuelve a ver el sitio de National Geographic y notarás que hay un segundo logo, más pequeño cerca del centro de la espiral. Es un excelente lugar para duplicar las imágenes de la marca porque tu ojo es llevado naturalmente a esa zona.

¿Subliminal? Tal vez.

La Proporción Dorada puede hacer eso.

Sitio web National Geographic

Este sitio web por y para el diseñador gráfico Tim Roussilhe se ve con un contenido muy denso, pero está muy bien organizado de acuerdo a la Proporción Dorada y a la Espiral Dorada, que se enfoca en el texto en la parte superior izquierda del sitio web. Tu ojo inicia en el mero centro con “Buenos Días Mi Nombre es Tim.” Después viaja más allá de la descripción de lo que Tim hace, hacia los botones del menú, coloca el logo en la parte superior izquierda, antes de llenar el resto con espacio negativo, habiendo absorbido todos los detalles que necesita.

Bonjour My Name is Tim

El contenido se hace obviamente cada vez más denso conforme la espiral progresa en esta identidad visual para Saastamoisen säätiö. El tamaño de cada letra se reduce, así como el espacio entre cada letra conforme la mirada se acerca a la espiral. Las letras no necesariamente se leen en orden, pero existe suficiente repetición como para que se vuelva familiar.

Saastamoisen säätiö

Helms Workshop  diseño esta marca para Fullsteam Brewery y uso la Proporción Dorada y la Espiral Dorada para el plano y el contenido. Varios elementos del diseño encajan dentro de cuadrados separados y la vista va pasando de la letra principal, hasta la estampa, el ABV, y lugar donde se hizo. La intención del Taller de Helms para Fullsteam fue crear una “narrativa de la marca, alrededor de un semi ficticio propietario de una plantación de steampunk de un nombre distante…” La Espiral Dorada ayuda a contar la narrativa en la etiqueta conforme obtenemos detalles tanto de él como de la marca.

Fullsteam Brewery by Helms Workshop

04. Imágenes - Proporción Dorada (o Regla de los Tercios)

La composición es importante para cualquier imagen, ya sea para transmitir información importante o para crear una fotografía estéticamente placentera. La Proporción Dorada puede ayudar a crear una composición que llevará los ojos a los elementos importantes de la foto. Usando la Proporción Dorada, divides la foto en tres secciones desiguales y luego usas líneas e intersecciones para componer la imagen.

Esta proporción es 1:1.618:1 de manera que el ancho de la primera y tercera columnas verticales será de 1 y el ancho de la columna vertical del centro será 0.618. De igual manera con las filas horizontales: la altura de la primera y tercera filas horizontales será de 1, y la altura de la fila central será de 0.618. Ahora, usa esas líneas e intersecciones para dibujar la mirada del espectador y enfoca su atención. También crea tensión y añade interés y energía a la composición.

Otra (un poco simplificada) manera de colocar las imágenes vía la Proporción Dorada es usar La Regla De Los Tercios. No es tan precisa como la Proporción Dorada pero te llevará muy cerca. Para la regla de los tercios, coloca todas las líneas verticales y horizontales 1:1:1 de manera que todos los espacios sean iguales. Alinea los elementos importantes de la imagen alrededor del centro del rectángulo, idealmente en sus cuatro esquinas.

Ésta cubierta de la revista Complex, presentando a Solange Knowles, usa la Proporción Dorada para determinar la proporción de espacio positivo y negativo. La parte superior de la nariz de Solange y (casi toda) su frente, alcanzan la línea horizontal superior; mientras que su nariz y ojo caen en las dos líneas verticales alrededor del centro del rectángulo.

Revista Complex

Jason Mildren diseño ésta cubierta para la revista Pilot que trabaja a partir de la Regla de los Tercios. Hay interés en las esquinas del centro del rectángulo, mientras que el mero centro en su mayor parte está vacío. En éste modelo, el ojo cae exactamente en las esquinas y está penetrando a la audiencia.

Revista Pilot por Jason Mildren

Ésta cubierta de La revista Feld  usa la Proporción Dorada mandando la vista hacia el centro del ojo del modelo de la cubierta. Funciona bien porque él está fuera del centro y el lado de su cara está casi alineado  con la guía izquierda vertical.

Revista Feld  

Y en general, el patrón de la cubierta sigue la Proporción Dorada y la Espiral Dorada. El contenido está concentrado dentro de la espiral y se hace más detallado hacia el centro de la espiral.

Revista Feld

05. Formas - Círculos Dorados

Igual que la Proporción Dorada puede aprovecharse para crear cuadrados y rectángulos que son armoniosos en proporción uno con el otro, también puede aplicarse para crear círculos. Un círculo perfecto en cada cuadrado del diagrama seguirá la proporción de 1:1.618 con el círculo del cuadrado adyacente.

Usando los Círculos Dorados, no solo crearás armonía y proporción, sino también consistencia a lo largo de la forma. Regresemos a Pepsi y a Twitter.

El  Logo de la Pepsi  está basado en dos círculos que se intersectan y que siguen la Proporción Dorada. Mientras el círculo menor no es inmediatamente evidente en la iteración final forma la base del corte blanco en el centro del logo.

El  El logo de Twitter usa geometría y esta marcadamente basado en  círculos perfectos . Existe una falta menor de precisión cuando se alinean con la Proporción Dorada pero en su mayor parte, el logotipo de Twitter utiliza Círculos Dorados para balance, orden y armonía.

Tu Turno

Puedes usar varios elementos de la Proporción Dorada para diseñar mejor. Los ajustes pueden ser muy sutiles, pero puede ser todo lo que necesite para pasar a ser de un buen diseño a un excelente diseño, especialmente en los ojos del que lo mira.

Como György Dóczi escribió en  The Power of Limits (El Poder de los Límites), “El poder de la sección dorada para crear armonía proviene de su capacidad única para unir diferentes partes de un todo de manera que cada una preserve su identidad propia y además se mezcle dentro del gran patrón de un solo todo”

La mejor herramienta para crear diseños increíbles