101
GRÁFICA DIGITAL I Filip Ziolkowski COMPOSICIÓN

Diseño y composicion

Embed Size (px)

Citation preview

Page 1: Diseño y composicion

GRÁFICA DIGITAL IFilip ZiolkowskiCOMPOSICIÓN

Page 2: Diseño y composicion

COMPOSICIONY DESIGNER TIPS

Page 3: Diseño y composicion
Page 4: Diseño y composicion
Page 5: Diseño y composicion

Existen 13 leyes:Ley de la Totalidad: El todo es más que la suma de sus partes.Ley de la Estructura: Una forma es percibida como un todo, independientemente de las partes que la constituyen.Ley del Contraste: Una forma es mejor percibida, en la medida en que el contraste entre el fondo y la forma sea más grande.Ley de la Compleción: Si un contorno no está completamente cerrado, el espíritu tiende a cerrarlo.Noción de Pregnancia: El concepto "pregnancia" se relaciona, también, con la idea de "impregnación". Es decir, aquello con lo que nos quedamos "impregnados" cuando miramos.Es la forma cargada de información, la fuerza de la forma, es la dictadura que la forma ejerce sobre los ojos.Principio de Proximidad: Los elementos aislados, pero con cierta cercanía tienden a ser considerados como grupos.Principio de Memoria: Las formas son tanto mejor percibidas cuanto mayor sea el número de veces presentadas…Principio de Jerarquización: Una forma compleja será tanto más pregnante en cuanto la percepción esté mejor orientada: de lo principal a lo accesorio (jerarquizadas).

http://es.slideshare.net/percynegrete/leyes-de-la-gestalt-12293125?next_slideshow=1http://es.slideshare.net/luti82/leyes-de-la-gestalt-2056078http://es.slideshare.net/percynegrete/leyes-de-la-gestalt-12293125

Page 6: Diseño y composicion
Page 7: Diseño y composicion

Comunicación

Page 8: Diseño y composicion

- Cual es el objetivo?- Cual es el audiencia?- Tono?- Simple o saturado?- Que sensación se quiere lograr?

ejemplo: productos baratos vs caros- Que sensación se quiere lograr?- AIDA - Metáforas y figuras retoricas para llamar atención http://www.slideshare.net/rokoromeo/figuras-retrica-en-la-publicidad- Genera credibilidad, emociones, lógica

Page 9: Diseño y composicion

Color

Page 10: Diseño y composicion

- Uso máximo 4 colores- Claros - Emoción positiva - Saturados – Para niños- Seriedad y profesionalismo - Opacos - Blanco – Para la claridad- Psicología del Color- Circulo cromáticohttps://color.adobe.com/es/

Page 11: Diseño y composicion
Page 12: Diseño y composicion
Page 13: Diseño y composicion
Page 14: Diseño y composicion

Contraste

Page 15: Diseño y composicion

- Color- Tamaño- Tipografías- Texto y fondo- Enfoque: text bold, linea, Italic, color

solo 10% del documento

Page 16: Diseño y composicion
Page 17: Diseño y composicion

Repetición

Page 18: Diseño y composicion

- Cogerencia: Repite elementos visuales (fuentes, tamaños, iconos, colores) para crear la continuación, coherencia

- Personalidad del diseño

Page 19: Diseño y composicion
Page 20: Diseño y composicion

Orden

Page 21: Diseño y composicion

- Todos los objetos son conectados- Alinear- Cercanía de los objetos parecidos- Establece estilo:

- estabilidad (horizontales) - dinamismo (angular)- Manten margenes- Usa reticula- Hierarquia del documento- Punto de enfoque- F / Z

Page 22: Diseño y composicion
Page 23: Diseño y composicion

PUNTO DE ENFOQUE

Page 24: Diseño y composicion
Page 25: Diseño y composicion

RETICULAGRID

Page 26: Diseño y composicion
Page 27: Diseño y composicion

F / Z

Page 28: Diseño y composicion
Page 29: Diseño y composicion

HIERARQUIA

Page 30: Diseño y composicion
Page 31: Diseño y composicion

Espacio Blanco (Negativo)

Page 32: Diseño y composicion

- 1+1 =3 Cuando creas dos objetos, espacio entre ellos es el 3 objeto

- Propósito del uso espacio negativo Saturación sin espacio crea falta la credibilidad

Page 33: Diseño y composicion

http://www.noupe.com/tutorial/55-adobe-illustrator-icon-design-tutorials-2.html

Page 34: Diseño y composicion
Page 35: Diseño y composicion
Page 36: Diseño y composicion
Page 37: Diseño y composicion
Page 38: Diseño y composicion

Tipografía

Page 39: Diseño y composicion

- 2 fuentes de diferentes familias, contrastantes

- Personalidad - comunicación- Evite fuentes comunes (Comic)- Legibilidad- Interlineado, leading, tracking

Page 40: Diseño y composicion

Iconos

Page 41: Diseño y composicion

- Para facilitar la lectura del documento usa iconos, contornos - shapes

- Agrega iconos para memorizar - Líneas, flechas para captar

atención solo cuando necesario

Page 42: Diseño y composicion

Fotografía – Ilustración

Page 43: Diseño y composicion

- Mejora la recordación - Resolución (72 para web, 300 para print)- Busca plano para comunicar- El cuerpo para la salud, vitalidad, sensualidad- La cara para comunicar personalidad y intelecto- Dirección del cuerpo / cara- Usa el tamaño de objetos y dimensión para

comunicar- Cogerencia entre estilo, color, luz- Simetría o asimetría para comunicar la paz o

dinamismo- Los ángulos creativos llaman la atención

Page 44: Diseño y composicion

SIMETRÍA

Page 45: Diseño y composicion

•COMPOSICIÓN SIMÉTRICALa composición simétrica es sencilla, solemne y formal; pero fría y demasiado mecánica.

•Muchos de los temas que se fotografían habitualmente tienen uno o varios planos de simetría. Personas, animales, objetos, incluso la línea del horizonte pueden actuar en tal sentido.

•Los motivos situados a ambos lados del eje de simetría tienen el mismo "peso visual".

Page 46: Diseño y composicion

COMPOSICIONES SIMÉTRICAS

Page 47: Diseño y composicion

•COMPOSICIÓN ASIMÉTRICASe la conoce con el nombre de las formas de letras o figuras que adoptan. Las más utilizadas son la triangular y las realizadas en forma de S, L, o C., que parecen ser las que mejor lectura y recorrido visual proporcionan.

Page 48: Diseño y composicion

STATIC VS DINAMIC

Page 49: Diseño y composicion
Page 50: Diseño y composicion
Page 51: Diseño y composicion

PLANOS

Page 52: Diseño y composicion

El encuadre

Page 53: Diseño y composicion

El encuadre

Page 54: Diseño y composicion

El plano detalle es el plano más cercano. Como ocurría con otro tipo de planos, el contexto de la escena definirá que se trate de un plano detalle o no. De esta forma, una imagen de la torre Eiffel puede ser un primer plano de la torre o un plano detalle de la ciudad. Este tipo de planos son difíciles de emplear con acierto, ya que pueden confundir al espectador al no dar referencia alguna ni del entorno ni, siquiera, del propio sujeto. Los detalles se agrandan al máximo y la carga emocional alcanza su punto álgido.

Page 55: Diseño y composicion

ANGULO

Page 56: Diseño y composicion
Page 57: Diseño y composicion

Composición

Page 58: Diseño y composicion

- Hierarquia - Scanable F/Z- Regla de los tercios- Sangrado - Fibonacci

Page 59: Diseño y composicion
Page 60: Diseño y composicion
Page 61: Diseño y composicion
Page 62: Diseño y composicion
Page 63: Diseño y composicion

LINEA DE COMPOSICION

Page 64: Diseño y composicion
Page 65: Diseño y composicion
Page 66: Diseño y composicion

LA REGLA DE LOS TERCIOS

Page 67: Diseño y composicion
Page 68: Diseño y composicion
Page 69: Diseño y composicion
Page 70: Diseño y composicion
Page 71: Diseño y composicion
Page 72: Diseño y composicion
Page 73: Diseño y composicion
Page 74: Diseño y composicion

EQUILIBRIO

Page 75: Diseño y composicion
Page 76: Diseño y composicion
Page 77: Diseño y composicion
Page 78: Diseño y composicion
Page 79: Diseño y composicion
Page 80: Diseño y composicion
Page 81: Diseño y composicion

SANGRE

Page 82: Diseño y composicion
Page 83: Diseño y composicion
Page 84: Diseño y composicion

DESIGNER TIPS

Anotan!

Page 85: Diseño y composicion

UN ELEMENTOPRINCIPAL

Page 86: Diseño y composicion
Page 87: Diseño y composicion

THE GOLDEN RATIOFIBONACCI

Page 88: Diseño y composicion
Page 89: Diseño y composicion
Page 90: Diseño y composicion
Page 91: Diseño y composicion
Page 92: Diseño y composicion
Page 93: Diseño y composicion
Page 94: Diseño y composicion
Page 95: Diseño y composicion

GESTALT RULE

Page 96: Diseño y composicion

Gestalt psychology (German: Gestalt [ɡəˈʃtalt] "shape, form") is a theory of mind. Gestalt psychology tries to understand the laws of our ability to acquire and maintain meaningful perceptions in an apparently chaotic world.

Page 97: Diseño y composicion
Page 98: Diseño y composicion
Page 99: Diseño y composicion
Page 100: Diseño y composicion

DESIGNER TIPS

Page 101: Diseño y composicion

1. QUE QUIEREMOS COMUNICARNOS? 2. COLOR3. CONTRASTE4. REPETICIÓN5. ORDEN6. ESPACIO BLANCO7. TIPOGRAFIA8. ICONOS9. FOTOGRAFIA / ILLUSTRACION 10. UN ELEMENTO PRINCIPAL, PUNTO DE

ENFOQUE