Está en la página 1de 59

Principios de la composicin y principios de la imagen.

Una composicin visual es la organizacin de los elementos visuales de una imagen para crear un diseo visualmente llamativo y potente. Cuando se est generando un diseo hay algunos conceptos bsicos que se deben considerar como proporciones- relacin de aspecto o en ingls aspect ratio, encuadre (framing), campo de visin (eld of view), primer plano (Foreground) y fondo (background).

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Proporcin (aspect ratio)


Si primero que tendremos que determinar a la hora de comenzar a realizar un boceto son las dimensiones del rea grca que se va utilizar. Igualmente si cuando se va a tomar una fotografa digital se debe tener en cuenta que hay diferentes aspect ratios. El aspect ratio o la proporcin es el a relacin entre el alto y el ancho de un objeto. Aunque hay muchos tipos de aspect ratios 3:2 y 4:3 son los ms comunes. Para las cmaras de 35 mm y la mayoras de las cmaras digitales de un solo lente reex (SLR) el ratio standar es 3:2.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Proporcin (aspect ratio)


Monitores, televisores y la mayora de las cmaras compactas usan una proporcin de 4:3. El aspect ratio puede afectar las dimensiones de impresin de la imagen, causando el recorte de parte de la imagen para poder lograr el tamao correcto de impresin. Por ejemplo una proporcin de 2:3 se imprime sin problema en un formato de 4 x6, porque las proporciones son compatibles. Pero si se quiere generar una impresin de de 8x10 con una imagen de 3:2, se tendra que hacer un recorte de 2.
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Encuadre (Framing)
Encuadrar una imagen gua al espectador al interior de la imgen. Esto se puede lograr al crear marcos para las fotografas en photoshop o usando elementos visuales de la escena.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Teora de cuadrcula
Usar una grilla no solo hace que los elementos en un diseo estn organizados y alineados sino tambin proporcionados. Muchos historiadores denominan a Piet Mondrian como el padre del diseo por su uso de la cuadrcula.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Sin embargo esta ha inuenciado el arte por miles de aos.

Perspectiva de Durero
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Mosaico rabe
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jeroglcos egipcios
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Proporcin urea
El concepto de dividir los elementos en de una composicin se extiende hasta Pitgoras. El observ que un patrn matemtico ocurra tan a menudo en la naturaleza que crey era inspirado por Dios. Nos referimos a este patrn como la seccin de oro o la divina proporcin. La idea bsica es que una lnea bisecada usando la divina proporcin se logra al dividirla por 1,62. este numero mgico es realmente 1,6180339. Un numero irracional que usualmente es representado por la letra phi

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

En general los diseos creados a partir de una composicin divida por lneas que estn proporcionadas con el segmento de oro son consideradas estticamente agradables. Los artistas del renacimiento empleaban la divina proporcin para dibujos, escultura, arquitectura etc. Los diseadores actualmente lo emplean para crear diseos de pginas, posters, brochures y todo tipo de piezas. Mas que conar en una nocin artstica la divina proporcin da guas lgicas para producir diseos atrayentes.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

La regla de los tercios


Es una versin simplicada de la divina proporcin. Una lnea bisecada por el segmento de oro es divida en dos secciones se son aproximadamente del doble del tamao de la otra. Dividir entonces la composicin en tercios es una manera fcil de aplicar la divina proporcin sin calculadora.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

La regla de los tercios


Igualmente la regla de los tercios es una de las reglas bsicas y clsicas e importantes de la composicin fotogrca. Esta ley nos dice que el tema principal de una fotografa debe situarse en uno de los cuarto puntos donde se cortan las lneas resultantes de dividir la fotografa en tres segmentos verticales y tres segmentos horizontales iguales. Estos puntos es donde se centra la atencin de la persona que observa la fotografa, por eso se denominan puntos fuertes.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

La regla de los tercios


Esta regla procede de la pintura renacentista del siglo XVI. Su objetivo era evitar que el centro de inters estuviera colocado en el centro lo que dara a la imagen un menor dinamismo y equilibrio. Este principio se basa en el hecho de que la vista humana se centra ms a partir de los dos tercios hacia arriba en el lienzo, en la imagen impresa o en una imagen proyectada sobre una pantalla.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Variedad
Se reere a todos los elementos disponibles para la construccin de la composicin.

Formas colores texturas ilustraciones fotografas contornos efectos fondos tipografas


Composicin creada con variedad de elementos: Colores, textos, formas.

El objetivo de la variedad es despertar el inters.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Balance
Al igual que los objetos fsicos tienen un peso, tambin lo hacen los elementos de un diseo. Si los elementos sobre los ambos lados de un diseo tienen el mismo peso, se equilibran entre s. Hay tres formas principales de equilibrio visual: 1.simtrica 2.asimtrica 3.radial

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Balance simtrico
Equilibrio simtrico, o el balance formal, se produce cuando los elementos de una composicin son los mismos a ambos lados de una lnea de eje.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Balance simtrico
las composiciones con equilibrio formal o simtrico reejarn estabilidad, calma y estatismo. No supone una composicin muy audaz auque lo que asegura es una distribucin armnica de los elementos.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Aunque puede que no sea prctico para todos los diseos, este tipo de simetra llamada horizontal, se puede aplicar a los diseos, centrando el contenido o el equilibrio que entre las columnas.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Las otras dos formas de equilibrio simtrico comnmente empleadas en el diseo de logotipos y en impresin son: simetra bilateral: existe cuando una composicin est equilibrada en ms de un eje.
ejemplo de simetra bilateral

ejemplo de simetra radial

simetra radial: se produce cuando los elementos son igualmente espaciados alrededor de un punto central.
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Balance asimtrico
Equilibrio asimtrico, o el equilibrio informal, es un poco ms abstracto (y visualmente ms interesante) que un equilibrio simtrico. En lugar de imgenes en el espejo a cada lado del trazado, el equilibrio asimtrico implica objetos de diferentes dimensiones, forma, tono, o la colocacin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Balance asimtrico
Estos objetos estn dispuestos de modo que, a pesar de sus diferencias, igualan el peso de la pgina.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

A diferencia de un equilibrio simtrico, el equilibrio asimtrico es verstil y, como tal, se utiliza ms a menudo en la Web. Si se echa un vistazo a la mayora de diseos de pgina de dos columnas, se dar cuenta de que la columna ms ancha es a menudo un color ms claro-una tctica que crea un buen contraste para el texto y el contenido principal. La columna de navegacin es a menudo ms oscura, tiene una especie de frontera, o se hace para destacar, con el n de crear equilibrio en el diseo.
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad
Continuidad, Repeticin, Proximidad

La teora del diseo describe la unidad como la manera en que los diferentes elementos de una composicin de interactan uno con el otro. Un diseo unicado es uno que funcione como un todo en lugar de ser identicado como piezas separadas. Cada elemento sobre el plano ejerce fuerzas y tensiones, el conjunto de estos elementos y sus fuerzas relacionadosse constituye en unidad. El valor de la unidad es superior a la simple suma de elementos.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Es importante que la unidad no slo exista dentro de cada elemento de una pgina de una pieza grca, sino que toda la pieza grca debe trabajar como una unidad. Podemos usar varios enfoques para lograr la unidad en una pieza grca como: 1.La continuidad. 2.La proximidad. 3.La repeticin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad por
Continuidad

La

La unidad por continuidad sucede cuando los elementos de la composicin se articulan en torno a la construccin del mensaje, si bien los crculos varan en el tono del color esto no afecta la construccin mental del tringulo que se forma en la alineacin de dichos elementos. Signicando as, que la unidad se construye sin importar la naturaleza de los elementos de la composicin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad por
Continuidad

La

En esta imagen se utiliza una continuidad de puntos que varan de tamao para generar la forma de la manzana, se utilizan adems cuadrados para representar el tallo.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad por
Proximidad

La

La proximidad es una obvia pero a menudo pasada por altomanera de hacer que un grupo de objetos se sienta como una sola unidad. Colocar objetos juntos dentro de un diseo crea un punto focal hacia el cual el ojo gravita.

La cercana de los elementos hace que los captemos como una unidad.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad por

La Proximidad

La proximidad unica los elementos de la composicin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Unidad por

La Repeticin

Una bandada de gansos, un banco de peces, una manada de leones. Cada vez que trae un conjunto de elementos, como conjunto, forman un grupo. De la misma manera, la repeticin de colores, formas, texturas, u objetos similares, ayuda a atar el diseo de una pieza grca, as como para que se sienta como una unidad cohesiva.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Armona
Es el delicado balance entre la variedad y la unidad. La armona en la imagen puede ser creada usando colores como los complementarios. O empleando formas que funcionan bien juntas como el smbolo del ying y el yang.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

La repeticin es a menudo utilizada en los diseos de distintas piezas grcas para unicar los elementos que lo componen. Un ejemplo de este concepto son las listas con vietas. La vieta que precede a cada elemento de la lista es un indicador visual de que los elementos son partes de un todo. Patrones repetidos y texturas tambin pueden ayudar a unicar un diseo.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jerarqua
La unidad de una composicin requiere que la tensin entre fuerzas y los estmulos causados sean integrados por un elemento dominante

El elemento dominante se encuentra apoyado y complementado por otros elementos en condicin de subordinacin. El orden de lectura est dado por la manera en que culturalmente nos enfrentamos al texto. Elemento principal Elementos secundarios: La lectura se hace de manera lineal. de apoyo decorativos informativos

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jerarqua
En el presente ejemplo hay dos tipos de composicin una con y otra sin el uso de jerarqua. La jerarqua visual hace parte importante de la comunicacin de un texto pues facilita el entendimiento del mismo indicando qu es lo mas y lo menos importante

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jerarqua
En el caso de este comic la jerarqua permite la lectura lineal que construye el sentido de la narracin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jerarqua

por Tamao

El tamao de un elemento propicia enfocar la atencin. En este caso la atencin es enfocada por un elemento de tamao pequeo.

El tamao de un elemento propicia enfocar la atencin. En este caso la atencin es enfocada en un elemento de tamao grande.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Jerarqua

por Color

La diferencia de color de un elemento con respecto a los dems de la composicin es una forma de dar importancia y atraer la atencin.

En esta composicin, el elemento que atrae la atencin es la or amarilla que se destaca entre los grises.
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis
En estrecha relacin con la idea de unidad est el concepto de nfasis o la dominancia. En lugar de centrarse sobre los diversos elementos de un conjunto, el objetivo del nfasis es la fabricacin de una caracterstica particular para llamar la atencin del espectador. Una forma de lograr el nfasis est en convertir el elemento deseado en un punto focal. Un punto focal es por lo tanto cualquier elemento que llama la atencin del espectador, en lugar de limitarse a ser parte del diseo en su conjunto o de mezclarse con sus alrededores. Al igual que con la unidad, hay mtodos probados de lograr el nfasis en un punto focal.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

El centro directo de una composicin es el punto en el que los usuarios buscan en primer lugar. Cuanto ms lejos del centro est un elemento, menos probable es que se observe por primera vez. En la Web, la esquina superior izquierda de la pgina tambin tiende a la demanda de mucha atencin por las caractersticas del medio. Por este motivo los logos de la mayora de los sitios web encuentran en esa ubicacin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

1.Recorrido Visual de las reas de Diseo:

Dos puntos determinan el recorrido visual que hacemos ante una composicin. 1.1.Nuestro sistema de percepcin visual humano 1.2.El factor cultural de nuestro mundo occidental, es decir de izquierda a derecha y de arriba hacia abajo.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

1.Recorrido Visual de las reas de Diseo

Desde que entramos hasta que abandonamos la pgina habremos realizado un promedio mximo de diez jaciones visuales por hoja, habindonos detenido una media de dos veces en cada bloque de informacin. Siempre realizamos un recorrido visual en sentido descendente avanzando de izquierda a derecha.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

En caso de enfrentarnos a una informacin en formato dptico, pasaremos de la primera pgina al interior de nuestra comunicacin, procediendo a abrir la pgina por el margen exterior derecho. En el momento en que literalmente empezamos a pasar la pgina, empieza nuestro contacto con el contenido grco de la doble pgina interior.

1.Recorrido Visual de las reas de Diseo

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

1.Recorrido Visual de las reas de Diseo


Por esta razn los diseos deben mantener esta estructura de lectura para alcanzar el xito en la comunicacin. En medios impresos se debe colocar la informacin ms importante en la parte superior derecha de la pieza y seguir ubicando la informacin en forma descendente y en orden importancia. La informacin que queremos que los usuarios recuerden por sobre todo, debemos ubicarla al nal del diseo, en el margen inferior derecho.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por colocacin

1.Recorrido Visual de las reas de Diseo


Las imgenes deben ser colocadas en el rea de diseo, dirigiendo su atencin hacia el centro o interior de la composicin, porque de lo contrario se est sacando del rea de diseo la atencin del usuario. Por lo tanto, los ejes direccionales de las imgenes deben ser situados siempre el centro de la composicin, nunca al contrario.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por continuacin

La idea detrs de la continuidad o el ujo es que cuando nuestros ojos comienzan a moverse en una direccin, que tienden para continuar por ese camino hasta que una caracterstica ms dominante venga.

Continuidad es uno de los mtodos ms comunes que los diseadores utilizan para unicar un diseo. Por ejemplo en una pgina web de forma predeterminada, el borde izquierdo de los ttulos, prrafos y las imgenes crean una lnea vertical por el lado izquierdo. Otra forma sencilla de hacer un uso adicional de este concepto es para alinear los elementos a las lneas de la cuadrcula del diseo impreso. Esto crea varias lneas de continuidad para que los ojos de los usuarios las sigan.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Aislamiento

De la misma manera que la proximidad nos ayuda a crear la unidad en un diseo, el aislamiento promueve el nfasis.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste El contraste se dene como la yuxtaposicin de diferentes elementos grcos, y es el mtodo ms comn para crear el nfasis en un diseo puesto que genera un impacto visual completamente atractivo a los ojos. El concepto es simple: cuanto mayor es la diferencia entre un elemento grco y sus alrededores, el elemento destaca ms. El contraste puede ser creado utilizando las diferencias de color, tamao y forma.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de color

Se da cuando se contraponen colores de valor diferente.

El mensaje de esta composicin se estructura a partir de contraste generado por por los colores verde (fondo), negro (silueta), blanco (producto y textos).

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de forma

Este contraste se logra comparando dos o mas guras con formas diferentes.

La composicin en construccin que se muestra en la fotografa se propone a partir de la yuxtaposicin de formas y colores logrando un contraste llamativo.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de tamao

Contraste generado en la diferencia del tamao de la forma, el cual rompe el ritmo y enfoca la atencin.

En este pster el contraste se genera en la diferencia de los tamaos de las fuentes. (tambin se genera en el juego de colores, pero para este caso nos concentramos en el tamao)

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de

tipografa

Este contraste se genera al comparar tipografas de familias diferentes.

La marca del canal mtv se construy a partir del contraste tipogrco, en este caso. La M es un tipo duro y moderno sobre la que se ubica la sigla TV Escrita en un tipo suave que evoca un brochazo de pintura.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de Proporcin


Otra forma interesante de crear nfasis en una composicin es a travs del uso de la proporcin.

La proporcin es un principio de diseo que tiene que ver con diferencias en la escala de los objetos. Si colocamos un objeto en un entorno de menor escala que el propio objeto, ese objeto aparecer ms grande que lo hace en la vida real, y viceversa. Esta diferencia en la proporcin llama la atencin de los espectadores porque el objeto parece fuera de lugar.
Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

nfasis

por Contraste de Proporcin


En este aviso la proporcin del edicio y el letrero que tiene encima hace que ambos llamen la atencin.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Ritmo
Es la repeticin de elementos de la composicin.

Ritmo regular

Se obtiene de la repeticin de un patrn. Un ritmo regular se da por la repeticin uniforme del patrn

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Ritmo regular

Las manos enlazadas en la parte Inferior de este poster, se han dispuesto de acuerdo al principio de ritmo regular.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Ritmo regular

El diseo de esta cartula presenta ruptura del ritmo regular, lo que se logra con la Alteracin de la posicin de las formas y con la escritura de tipos sobre estas.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Ritmo progresivo
Representa un movimiento orgnico o natural que se usa para crear movimiento visual. Se construye a partir de elementos repetidos, se obtiene alterando cualquiera de las caractersticas (color, posicin, tamao) de los elementos, generando una jerarqua visual que determina el crechendo visual. En este caso se ha modicado el tamao y la posicin de la forma.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Ritmo progresivo
Para lograr la sensacin de movimiento de las formas en esta pieza se ha aplicado el principio de ritmo progresivo.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

ELEMENTOS DE DISEO
lineas el componente bsico de la forma cada linea iene largo, grosor, y direccin Las lneas pueden ser curvas, horizontales, verticales, diagonales, onduladas, entrecortadas o punteadas Formas

PRINCIPIOS DE DISEO
nfasis hace que un elemento espec co se destaque se logra empleando color, tamao, posicin o formas Movimiento simetra cuando la composicin del texto y gr cos est distribuida de manera uniforme alrededor del punto medio La simetra puede ser vertical, horizontal o radial Teora del color La idea de que los colores pueden afectar los pensamientos y emociones de los humanos constraste Similar al nfasis, separa elementos por comparacin o creando diferencias Puede ser logrado por el uso de color, tamao, formas y posicin Regla de los tercios La teora de que los elementos mas interesantes de una composicin como una pagina web, se encuentran desplazados del centro Proximidad Qu tan cercanos estn los textos de los gr cos. La proximidad indica una conexin como poner un texto de caption a una imagen. Repeticin Repetir un elemento para crear consistencia visual. Puede ser lograda en la misma pgina en un sitio web o entre varias pginas en sun sitio a travs del uso de encabezados (headings), colores, tipo de fuentes y repitiendo el diseo bsico entre las diferentes pginas.

una lineas que de ne o implica un lmite

Conduce el ojo en determinada direccin

las formas pueden ser geomtricas, como un cuadrado o un circulo las formas tambin pueden ser orgnicas Textura Un relleno usado en las formas para implicar cmo se puede "sentir" el objeto La textura puede sentirse por ejemplo dura u ondeada

Logrado por el uso de puntos, echas o lneas Balance La pgina es dispuesta en un patrn visual planeado y coherente. Los elementos visuales no estn fuera de proporcin o pesados en una de las reas. Unidad Crea una sensacin de integridad

Los colores pueden ser placenteros o hacer a alguien sentirse incmodo. Espacio en blanco Son reas de las pgina que no tienen texto o gr cos. Incluye mrgenes, relleno (padding) y espaciado de lnea. Alineacin El espaciado de texto y gr cos en relacin los unos con los otros o con las mrgenes de la pgina. Alineaciones comunes: centro, izquierda, derecha o justi cado.

Lograda empleando el mismo color o diferentes tintas de un mismo color.

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

Fuentes de consulta -"The Principles of beautifull web design", Jason Beaird,Sitepoint, 2010,Canada -Digital Design:Foundations of Web Design, Adobe Systems Incorporated , 2010, USA -http://www.slideshare.net/anacida/principios-de-composicin -http://www.slideshare.net/alexei.hidalgo/principios-del-diseo -http://www.imageandart.com/tutoriales/teoria/ composicion_ubicacion/index4.htm -http://www.slideshare.net/amedsito/fundamentos-decomposicion-visual -http://es.scribd.com/doc/15485427/Conceptos-Basicos-de-Diseno -http://www.botanical-online.com/reglasclasicasfotograa.htm -http://www.slideshare.net/Julianalsola/la-composicinfotogrca-1645383

Av.Ricardo Lyon 1177, Instituto Tecnolgico Crossmedia - Providencia, Santiago, Chile | Telfonos 204 3190 - 204 2998 | www.academiamac.cl 2012 Academia Crossmedia -Training & Consulting

También podría gustarte