Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular....
Transcript of Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular....
![Page 1: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/1.jpg)
Fundamentos de diseño
1
![Page 2: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/2.jpg)
El Color
2
![Page 3: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/3.jpg)
Propiedades del color
3
1. Tono
2. Saturación
3. Brillo
![Page 4: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/4.jpg)
Propiedades del color: Tono
4
Tono ( hue), matiz o croma es el atributo que diferencia el color y por la cual designamos los colores: verde, violeta, anaranjado.
![Page 5: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/5.jpg)
Propiedades del color: Tono
5
Saturación ( saturation) es la intensidad cromática o pureza de un color.
![Page 6: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/6.jpg)
Propiedades del color: Tono
6
Brillo ( brightness) es la cantidad de luz emitida por una fuente lumínica o reflejada por una superficie.
![Page 7: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/7.jpg)
Modelos de
representación del color
7
![Page 8: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/8.jpg)
El círculo cromático
8
• El ojo humano distingue unos 10.000 colores.
• El círculo cromático, es una representación ordenada y circular de los colores de acuerdo con su matiz o tono, en donde se representa a los colores primarios y sus derivados.
• Su uso es compatible tanto con los modelos sustractivos de color (artísticos, pictóricos), como con los modelos aditivos (lumínicos).
![Page 9: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/9.jpg)
El círculo cromático
9
El círculo cromático que conocemos no es del todo correcto, ya que solo representa los tonos en su máxima saturación no teniendo en cuenta la luminosidad de cada uno.
Por tanto, cuando lo utilicemos como referencia para hacer esquemas de color, debemos ser conscientes de esta limitación.
![Page 10: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/10.jpg)
Uso del color
10
Para escoger los colores, nos basaremos en la imagen corporativa de la empresa.
Si esto no existe, debemos definir la gama de colores:
• Basada en las reglas de la teoría del color.
• Basada en la psicología del color.
![Page 11: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/11.jpg)
Psicología del color
11
![Page 12: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/12.jpg)
Psicología del color
12
Podemos clasificar los colores en fríos y cálidos.
![Page 13: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/13.jpg)
Psicología del color
13
Los colores que se eligen en el esquema de color pueden implicar impresiones sutiles y activar distintas asociaciones en los espectadores.
![Page 14: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/14.jpg)
Psicología del color
14
Blanco: significa seguridad, pureza y limpieza. A diferencia del negro, el blanco tiene una connotación positiva y es el más utilizado para dar un aspecto minimalista. Su máximo poder es el de resaltar a los otros colores.
![Page 15: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/15.jpg)
Psicología del color
15
Amarillo: simboliza la luz del sol. Representa alegría, felicidad, inteligencia y energía. Al amarillo simula entrar en calor, provoca alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención, es útil para destacar aspectos importantes de un documento.
![Page 16: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/16.jpg)
Psicología del color
16
Naranja: Representa entusiasmo, felicidad, atracción, creatividad, determinación, éxito, ánimo y estímulo. Por su alta visibilidad también es útil para captar la atención y subrayar aspectos a destacar de un lugar.
![Page 17: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/17.jpg)
Psicología del color
17
Rojo: representa fuego y sangre, está asociado al peligro, la guerra, la energía, fortaleza, determinación así como a la pasión, al deseo y al amor. Visibilidad alta, para avisos importantes, prohibiciones y llamadas de precaución. Adecuado para el mundo del motor (coches y motos), bebidas energéticas, juegos, deportes y actividades de riesgo.
![Page 18: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/18.jpg)
Psicología del color
18
Violeta: se asocia a la realeza y simboliza poder, nobleza, lujo y ambición. Sugiere riqueza y extravagancia. Asociado con la sabiduría, la creatividad, la independencia, la dignidad.
![Page 19: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/19.jpg)
Psicología del color
19
Azul: el color del cielo y del mar, asociado con la estabilidad y la profundidad. Adecuado para mostrar limpieza, para promocionar productos de alta tecnología o alta precisión.
![Page 20: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/20.jpg)
Psicología del color
20
Verde: el color de la naturaleza. Representa armonía, crecimiento, exuberancia, fertilidad y frescura.
![Page 21: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/21.jpg)
Psicología del color
21
Negro: representa poder, elegancia, formalidad, muerte y misterio. Puede dar imagen de elegancia y aumentar la sensación de profundidad y perspectiva. También lo podemos usar para diseños minimalistas.
![Page 22: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/22.jpg)
Psicología del color
22
Neutros (grises, marrones…): representan la neutralidad, la seriedad y la calma. Son colores perfectos para acompañarlos de pequeños toques de colores vivos, ya que son colores monótonos y relajantes.
![Page 23: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/23.jpg)
Psicología del color
23
![Page 24: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/24.jpg)
Psicología del color
24
Algunas asociaciones son globalmente reconocidas, como la de que el amarillo es el color de la luz del Sol, otras son específicas de cada cultura.
Cualquier experiencia que un grupo de personas tenga en común puede crear una nueva asociación con determinados colores. La globalización está exponiendo a la mayoría del mundo a unas imágenes y elecciones de color comunes a través del mundo audiovisual.
![Page 25: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/25.jpg)
Psicología del color
25
Psicología del color. Cómo actúan los colores sobre los sentimientos y la razón-Eva Heller.
![Page 26: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/26.jpg)
Esquemas de color
26
![Page 27: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/27.jpg)
Esquemas de color
27
Se componen del conjunto de colores principales que aparecen en la imagen.
• Crea una primera impresión.
• Ayuda a establecer el estado de ánimo de la escena.
• Da cohesión a todos los elementos de la imagen.
• Ayuda a destacar unos elementos sobre otros sin crear estridencias.
![Page 28: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/28.jpg)
Esquemas de color
28
Ningún color puede ser considerado un valor absoluto, de hecho los colores se influyen mutuamente si se acercan. Los colores tienen diferente realce según el contexto en el que se dispongan o se encuentren.
![Page 29: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/29.jpg)
Monocromático Complementario AnálogoComplementario
DivididoTriaxial
Varias intensidades del mismo color.
Colores opuestos en el círculo.Permite introducir colores fríos y cálidos en el esquema.Puede resultar estridente
Colores adyacentes en el círculo, con un color común.
Combina un color con dos análogos de su complementario.
Combina tres colores equidistantes.
Esquemas de color: armonía
29
![Page 30: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/30.jpg)
Esquemas de color: generadores
30
Para crear nuestros esquemas de color podemos utilizar generadores online gratuitos como el siguiente:
https://color.adobe.com/
![Page 31: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/31.jpg)
Sistemas de trabajo con
color
31
![Page 32: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/32.jpg)
Sistemas de trabajo con color: RGB
32
Colores luz primarios: rojo, verde y azul.
• Al sumarse el resultado es blanco.
• Al apagarse el resultado es negro.
![Page 33: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/33.jpg)
Sistemas de trabajo con color: RGB
33
![Page 34: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/34.jpg)
Sistemas de trabajo con color: RGB
34
![Page 35: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/35.jpg)
Sistemas de trabajo con color: CMYK
35
Colores pigmento primarios: amarillo, cian, magenta y negro.
• Al sumarse el resultado es negro.
• Al eliminar cantidad el resultado es blanco.
![Page 36: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/36.jpg)
Sistemas de trabajo con color: CMYK
36
![Page 37: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/37.jpg)
Sistemas de trabajo con color: CMYK
37
En impresoras domésticas se usan dos sistemas de cartuchos:
4 cartuchos(o 2 si el de color va todo en uno)
6 cartuchos(impresiones más precisas)
![Page 38: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/38.jpg)
Sistemas de trabajo con color: CMYK
38
Proceso impresión offset – Impresión profesional
![Page 39: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/39.jpg)
Sistemas de trabajo con color: CMYK
39
Proceso impresión offset – Impresión profesional
![Page 40: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/40.jpg)
Sistemas de trabajo con color: CMYK
40
Proceso impresión Pantone – Impresión profesional y forma más precisa de conseguir colores exactos.
![Page 41: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/41.jpg)
Sistemas de trabajo con color: CMYK
41
Existen códigos que permiten traducir los pantones a CMYK: por ejemplo, el Pantone Coated 100 C (amarillo canario) se convierte al RGB con el código 246, 235 97 y al CMYK con 0, 41, 61, 4.
Pero, no siempre es posible convertir un color Pantone en un código CMYK. Por el hecho de que las tintas Pantone nacen de barnices y no de la unión de cuatro colores, a veces es imposible encontrar el equivalente exacto en un sistema diferente.
https://store.pantone.com/es/es/color-of-the-year-2017
![Page 42: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/42.jpg)
Sistemas de trabajo con color:
Hexadecimal
42
Se utiliza en diseño web para definir los colores.
Este es el selector de Google, que podemos usar desde nuestro navegador buscado “Selector de color hexadecimal”
![Page 43: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/43.jpg)
Imágenes
43
![Page 44: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/44.jpg)
Imágenes para pantalla
44
• Se miden en píxeles.
• Resolución de 72 ppp.
• Si son para web es muy importante que su peso sea pequeño.
![Page 45: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/45.jpg)
Imágenes para pantalla
45
Usaremos estos formatos:
• Jpg: fotografías e ilustraciones con mucha variación de colores.
• Gif: imágenes animadas.
• Png: ilustraciones de colores planos.
jpg png gif
![Page 46: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/46.jpg)
Imágenes para pantalla
46
Cuando guardamos una imagen de colores planos en jpg aparecen los errores conocidos como artefactos jpg:
png jpg
![Page 47: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/47.jpg)
Imágenes para pantalla
47
Cuando guardamos una imagen de colores planos en jpg aparecen los errores conocidos como artefactos jpg:
png jpg
![Page 48: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/48.jpg)
Imágenes para impresión
48
• Se miden en mm o cm (aunque se trabajen en píxeles).
• Resolución de 150-300 ppp.
• Pesan mucho más que las imágenes para pantalla.
![Page 49: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/49.jpg)
Imágenes para impresión
49
Existen tamaños estándares de papel:
Tamaño folio
![Page 50: Fundamentos de diseño · alegría, estimula nuestra actividad mental y genera energía muscular. Con frecuencia está asociado a la comida. Por su eficacia para atraer la atención,](https://reader034.fdocuments.es/reader034/viewer/2022042810/5f9ad71d5058680d84583c28/html5/thumbnails/50.jpg)
Resolución
50
Podemos hablar de tres estándares:
• 72ppp: pantalla.
• 150ppp: impresora casera
• 300ppp: imprenta