Conceptos Básicos y Teoría del Color 2015

Conceptos Básicos y Teoría del Color

Objetivos de la Unidad

Al finalizar la presente unidad el participante será capaz de:

a) Diferenciar entre una imagen vectorial y una

rasterizada.

b) Conocer los alcances y aplicabilidad de Adobe

Photoshop CS5.

c) Diferenciar y definir el Color y sus Propiedades.

d) Diferenciar, definir y manejar los diferentes modos

de color.

e) Identificar y manipular los elementos básicos que

componen el espacio de trabajo de Adobe

Photoshop.

DEFINICIÓN

Adobe Photoshop (Taller de Fotos) es una aplicación informática en forma de taller de pintura y

fotografía que trabaja sobre un "lienzo" y que está destinado para la edición, retoque fotográfico

y pintura a base de imágenes de mapa de bits (o gráficos rasterizados), desarrollado y

comercializado por Adobe Systems Incorporated, parte de Adobe Creative Suite, compatible

con programas como Ilustrador, InDesing , After Effects etc. Tiene un acceso más sencillo a

las herramientas, una plataforma amplia, voluble, amigable y profesional, que nos permite

editar Mapas de Bits, imprimirlos, publicarlos en la Web, y en dispositivos móviles, en síntesis

con Photoshop CS5 tenemos una Herramienta que nos permite explotar toda nuestra

imaginación.

El presente Curso de Adobe Photoshop CS5 está diseñado para que el alumno adquiera los

conocimientos que le permitan editar imágenes rasterizadas, retoques fotográficos básicos,

montajes e infinidad de efectos y opciones.

IMAGEN RASTERIZADA

Una imagen rasterizada, también llamada bitmap, imagen matricial o pixmap, es una estructura

o fichero de datos que representa una rejilla rectangular de pixeles o puntos de color,

denominada raster, que se puede visualizar en un monitor de ordenador, papel u otro

dispositivo de representación. A las imágenes rasterizadas se las suele caracterizar

técnicamente por su altura y anchura (en pixeles) y por su profundidad de color (en bits por

pixel), que determina el número de colores distintos que se pueden almacenar en cada pixel, y

por lo tanto, en gran medida, la calidad del color de la imagen.

DIBUJO VECTORIAL

Es una imagen digital formada por objetos geométricos independientes (segmentos, polígonos,

arcos, etc.), cada uno de ellos definido por distintos atributos matemáticos de forma, de

posición, de color, etc. Por ejemplo un círculo de color rojo quedaría definido por la posición de

su centro, su radio, el grosor de línea y su color. El interés principal de los gráficos vectoriales

es poder ampliar el tamaño de una imagen a voluntad, editarla (Rotarla, Girarla, Deformarla

etc.) sin sufrir el efecto de escalado que sufren los gráficos rasterizados.

INTRODUCCIÓN

Adobe Photoshop CS5 se ha convertido en la aplicación estándar para el tratamiento digital de

las imágenes. Las continuas mejoras han hecho de este programa uno de los más

profesionales para la edición y retoque fotográfico. tiene diversas aplicaciones que van desde

hacer un simple retoque hasta crear montajes y escenarios complejos, gracias a su volubilidad

podrá crear de una manera rápida y profesional cualquier tipo de publicidad escrita,

ilustraciones para utilizarlas en programas de animación como Adobe Flash, o simplemente

impórtala a su dispositivo móvil, la plataforma de diseño que provee Adobe Photoshop es tan

flexible y amigable que sin duda le permitirá explotar al máximo su potencial como diseñador,

en todos los ámbitos visuales en los cuales pueda representar una imagen.

DEFINICIÓN DE COLOR

El mundo es de colores, donde hay luz, hay color. La percepción de la forma, profundidad o

claroscuro está estrechamente ligada a lo que se llama color. El color es un atributo que

percibimos de los objetos cuando hay luz. Ya que nuestros ojos solo miran todo aquello que

“Toca” la luz. La luz es constituida por ondas electromagnéticas que se propagan a unos

300,000 kilómetros por segundo. Esto significa que nuestros ojos reaccionan a la incidencia de

la energía y no a la materia en sí. Las ondas forman, según su longitud de onda, distintos tipos

de luz, como infrarroja, visible, ultravioleta ó blanca. Las ondas visibles por nosotros son

aquellas cuya longitud de onda está comprendida entre los 380 y 770 nanómetros, un

nanómetro equivale a la mil millonésima parte de un metro, ósea que es mil veces más

pequeño que un micrómetro.

Los objetos devuelven la luz que no absorben hacia su entorno. Nuestro campo visual

interpreta estas radiaciones electromagnéticas que el entorno emite o refleja, como la palabra

"COLOR".

Propiedades del Color

Se definen como el Tono, la Saturación, el Brillo.

A. Tono Matiz o Tonalidad es el atributo que diferencia el color y por el cual designamos los colores: verde, violeta, anaranjado.

APLICABILIDAD

COLOR

B. Saturación Es la intensidad cromática o pureza de un color, que se le puede definir como valor; es la claridad u oscuridad de un color, está determinado por la cantidad de luz que un color tiene. Valor y luminosidad expresan lo mismo.

C. Brillo

Es la cantidad de luz emitida por una fuente lumínica o reflejada por una superficie.

A continuación estudiara los modelos de colores más utilizados, en el mercado Hondureño, también existen Lab; HSV; CMYKOG entre otros, este último también llamado Hexacromía que es de amplio uso en la industria del empaque, pero que tiene poca difusión y uso en nuestro mercado. Modelo RGB Tiene como base los colores producidos por luz, (ejemplo el monitor de la computadora, la

Pantalla del Cine, del Televisor etc.) que son el Rojo, Verde y Azul, (por sus siglas en Ingles) al

color Blanco y Negro se les llama colores acromáticos ya que los perciben como “no colores”

(Usted percibe el color Negro cuando un objeto absorbe toda la luz que llega a él, y el color

Blanco cuando la refleja totalmente); este modo de color es el recomendado para presentar

imágenes que serán mostradas en monitores de computadoras, impresas en papel fotográfico,

etc. Este modo solo utiliza los 3 colores que se han descrito para reproducir hasta 16,7 millones

de colores, el modo RGB asigna un valor de intensidad a cada pixel que varía entre 0 (Negro)

y 255 (Blanco), por ejemplo un color Rojo Brillante seria:

R: 250, G: 20 B: 10.

El Rojo más brillante que se puede conseguir mediante este modo de color es:

R: 255, G: 0 B: 0.

Si todos los valores son cero el resultado sería color Negro, y si todos los valores son 255 el

resultado sería color blanco puro, es por esto que esta síntesis se le llama aditiva.

MODELOS DE COLOR

Modelo CMYK

También llamado modo de colores sustractivos, son colores basados en la luz reflejada, de los

pigmentos aplicados a las superficies, que está formada por el color Magenta, Cyan y Amarillo,

son los colores básicos de las tintas que se utilizan en la mayoría de los sistemas de impresión,

motivo este del desplazamiento de lo que se conoce como colores primarios, la mezcla de

estos 3 colores da como resultado el color Negro, (de allí el nombre de colores sustractivos)

mezcla que da como resultado un color negro poco intenso, por lo que se le agrega el pigmento

Negro puro, formando así el Perfil CMYK (por sus siglas en Ingles la K representa el “Black”),

los procedimientos que utilizan las Imprentas conocidos como tricromía y cuatricromía, se

basan en este modo de color, en este modo de color el blanco puro se genera si los cuatro

componentes tiene un valor de 0, un color naranja se consigue con los valores C:0, M: 50, Y:

100, K: 0,

Escala de Grises Es una graduación empleada en la que el valor de cada pixel posee un valor equivalente a una graduación del gris. Las imágenes representadas de este modo de color están compuestas en porcentajes de gris, que van desde el negro más profundo, variando gradualmente en intensidad del gris, hasta llegar al blanco puro. Lo que se llama imágenes en blanco y negro. El proceso humano de percepción de los estímulos que recibe del entorno entre ellos, los mensajes bi-media (imagen-texto) puede ser analizado en tres etapas:

A. Sensación: implica que el ojo es atacado por sénsums lumínicos, en nuestro caso un sénsum lumínico-cromático: la sensación del Color.

B. Percepción: el ojo funciona como un radar y está programado para reconocer formas, a fin de poder interactuar con su entorno. Una “forma” es una disposición en el espacio que a la vez que lo define, lo ocupa, una estructura que se debe aislar, separar de su contexto para hacerla inteligible (proceso que generalmente se hace inconsciente e instantáneamente). Dicho proceso cuando la forma no es tan sencilla como la de una esfera, un huevo o un cubo puede implicar cierta cantidad de complejidad. Por tanto, el

EL COLOR COMO MEDIO EXPRESIVO

Sensación Percepción Integración

hecho de focalizar y extraer mentalmente una forma de su contexto, y el de discernirla (suprimiendo la posible ambigüedad), es un acto del individuo; un acto más complejo que el de la sensación, de la cual, de hecho, no puede decirse que sea un acto del individuo, sino una acción externa, por encima de él. La sensación impregna el espíritu: va de fuera a dentro. La percepción va de dentro a fuera: hay una participación activa del sujeto. Reconocer una forma quiere decir, indistintamente:

1) Percibirla directamente en el momento dentro del entorno espacio-tiempo al que se

denomina “realidad”

2) Percibirla representada, en una imagen, que es un fragmento congelado sobre el papel, o cualquier otro soporte de comunicación y que también forma parte de lo real, aunque por estar encasilladas en los soportes que las representan parecen oponerse a “la realidad”

C. Integración: en esta etapa el ojo funciona como aparato integrador y supone la comprehensión (comprender y aprehender al mismo tiempo) de una información o de un mensaje. Si la “sensación” es el efecto del color, y puede llamarse “percepción” a la estructura formal de una imagen, pasos necesarios e inherentes de la etapa de la “integración” que se denomina como un desciframiento, y puede ejemplificarse por la lectura secuencial de un texto y la extracción, el desciframiento de su significado. En este proceso que comporta las tres etapas mencionadas, hay una progresión de la complejidad y, también, de la participación activa del individuo.

En la etapa de la sensación óptica recibe una “información” inmediata; la sensación es ella

misma instantaneidad. En la etapa de la percepción se inicia la intervención de la atención por

parte del individuo. La atención tiene diversos grados de intensidad, y se puede hablar de

atención distraída, atención pasiva, atención interesada, atención activa: ejemplo la exploración

de la imagen o la lectura de un texto. En la etapa de la integración se reconoce, además de la

atención, cierto esfuerzo intelectual para comprender y asimilar. Este triple proceso sintetiza,

por tanto, la colaboración progresiva del sujeto a partir de la sensación recibida. Esta

participación creciente implica un esfuerzo de atención, un esfuerzo intelectual y una inversión

de tiempo. La inversión de tiempo es más considerable en la tercer etapa (la lentitud que

requiere el desciframiento semántico de un texto) que en la segunda etapa (percepción de una

imagen), y es prácticamente nula en la primera etapa (sensación cromática), que en realidad

desencadena el interés para llevar a cabo el triple proceso que se ha estudiado.

Por ello es que la etapa de la sensación es tan importante en el mundo del Diseño Gráfico, ya

que el color tiene capacidad de expresión, significado y provoca una reacción o emoción.

Cuanto más intensa o saturada es la coloración, más cargado está de expresión y emoción.

Todo color posee un significado propio, capaz de comunicar una idea. El color no sólo tiene un

significado universalmente compartido a través de la experiencia, sino que tiene también un

valor independiente informativo a través de los significados que se le adscriben simbólicamente.

No obstante esto, “el lenguaje de los colores”, es decir, sus funciones y variables, es tan rico y

complejo que imposibilita fijarlo en una clasificación; al mismo tiempo que es difícil, siempre es

peligroso intentar delimitar con demasiada rigidez cada una de las categorías. El Color y su

fenomenología constituyen un mundo de sutilezas aún poco conocido. Lo que nos permite

categorizar los colores surge de una actitud pragmática del visualista, ya que diseñar lleva

implícito utilizar colores y, por tanto, aplicar intenciones comunicativas. Estos usos e

intenciones no siempre están relacionados con “la realidad de los colores en la percepción del

mundo visible”, sino con una voluntad plástica. (Es necesario comprender la diferencia que hay

entre la percepción del mundo y la percepción icónica). Esto significa que el color, ahora, ya no

está considerado como una sustancia lumínica, sino como materia. De esta forma se convierte

en un elemento de la plástica y la gráfica, en el mismo sentido que lo son las Formas, las

Imágenes y el Texto. Elementos todos estos que serán objeto de combinatorias y

manipulaciones expresivas, que viene hacer la función propia del diseñador.

Para facilitar su estudio dividiremos a los colores en dos grupos.

A. Cálidos Se llaman colores cálidos aquellos que van del rojo al amarillo.

B. Fríos Se llaman colores fríos los que van del azul al verde.

Esta división de los colores en cálidos y fríos radica simplemente en la sensación y experiencia humana. La calidez y la frialdad atienden a sensaciones térmicas subjetivas. Los colores, de alguna manera, nos pueden llegar a transmitir estas sensaciones. Un color frío y uno cálido se complementan, tal como ocurre con un color primario y uno compuesto.

Al terminar de Cargar la Aplicación Abobe Photoshop, se habilitara el “Espacio ó Mesa de

Trabajo” el cual se carga por defecto. Cualquier disposición de Paneles, Barras y Ventanas se

le denomina Espacio o Meza de Trabajo, aprenderá como personalizar el espacio de trabajo,

para un manejo más rápido y amigable del programa.

ELEMENTOS DEL ESPACIO DE TRABAJO

A. Barra de Menús

En la parte superior organiza los comandos debajo de los menús.

B. Paneles

En Abobe Photoshop CS5 hay dos Paneles principales.

1. Panel de Control

Aparece debajo de la Barra de Menús y muestra las distintas opciones

para la herramienta que se utiliza en ese momento.

ESPACIO DE TRABAJO

2. Panel Herramientas

Contiene todas las herramientas del programa Abobe Photoshop CS5.

C. Ventanas:

Se utilizan para acceder a distintas opciones en el entorno que brinda el Programa Adobe

Photoshop, por ejemplo la Ventana Gestión de Color, permite cambiar los colores de

Trazados, Rellenos, Degradados, y otras opciones.

Puede crear un espacio de trabajo personalizado moviendo y manipulando los paneles y las

ventanas también puede guardar espacios de trabajo y pasar de uno a otro.

A. Reorganizar, acoplar y desacoplar ventanas

Un conjunto acoplado es un conjunto de ventanas o grupos de ventanas que se muestran

juntos, generalmente en una orientación vertical. Estos conjuntos se acoplan y

desacoplan moviéndolos dentro y fuera de un conjunto acoplado.

1. Para acoplar una ventana, arrástrela por su ficha al conjunto apilado, a la

parte superior, a la parte inferior o entre otras ventanas.

2. Para acoplar un grupo de paneles, arrástrelo por su barra de título (la

barra vacía sólida que se encuentra encima de las fichas) al conjunto ha

acoplar.

3. Para quitar una ventana o grupo de ventanas, arrástrelas fuera del conjunto acoplado por su ficha o barra de título. Puede arrastrarla a otro conjunto acoplado o hacer que flote con libertad.

GESTIÓN DE VENTANAS Y PANELES

Ventana del Navegador

arrastrado a un nuevo conjunto

acoplado, indicado por un

resaltado vertical azul.

B. Apilado de paneles flotantes

Cuando arrastra una ventana fuera de su conjunto apilado pero no a una zona de

colocación, esta flota con libertad. Las ventanas flotantes se pueden situar en cualquier

lugar del espacio de trabajo. Puede apilar ventanas flotantes o grupos de manera que se

muevan como una unidad cuando arrastra la barra de título.

1. Para apilar ventanas flotantes, arrastre una ventana por su ficha a la zona de colocación en la parte inferior de otra ventana.

2. Para cambiar el orden de apilado, arrastre una ventana arriba o abajo por su ficha.

3. Para quitar una ventana o un grupo de ventanas de la pila, de manera que flote por sí misma, arrástrela fuera de su ficha o barra de título.

Al guardar la posición y el tamaño actuales de los paneles como un espacio de trabajo con

nombre, puede restaurar dicho espacio de trabajo incluso aunque mueva o cierre un panel. Los

nombres de los espacios de trabajo guardados aparecen en el conmutador de espacios de

trabajo de la barra de la aplicación.

1. Elija Ventana > Espacio de trabajo > Nuevo espacio de trabajo.

2. Escriba un nombre para el espacio de trabajo.

3. En Capturar, seleccione una o ambas de las siguientes opciones:

Métodos abreviados de teclado Guarda el conjunto actual de métodos

abreviados de teclado

Menús o Personalización de menús Guarda el conjunto actual de menús.

Paneles apilados flotantes de

libre movimiento.

GUARDAR ESPACIOS DE TRABAJO

A

C

E

F

G

B

D

Para crear un documento nuevo en Adobe Photoshop CS5, puede dar clic en Archivo>Nuevo;

también puede utilizar el método abreviado de teclado Ctl+N o Cmd+N según su sistema

operativo, esta acción abrirá la siguiente ventana:

A. Nombre del documento. B. Tamaños por defecto. C. Tamaño de resolución. D. Modo de color E. Unidad de medida

F. Profundidad de color. G. Tamaño estimado de imagen (archivo).

Puede usar las opciones de modo de pantalla para ver las imágenes en toda la pantalla. Puede

mostrar u ocultar la barra de menús, la barra de título y las barras de desplazamiento.

Realice una de las siguientes acciones:

1. Para visualizar el modo por defecto (barra de menú en la parte superior y barras

de desplazamiento en el lateral), seleccione Vista>Modo de pantalla> Modo de

pantalla estándar. O bien haga clic en el botón Modo de pantalla de la barra

aplicaciones y seleccione Modo de pantalla estándar en el menú emergente.

2. Para visualizar una ventana en pantalla entera con una barra de menú y un fondo

gris del 50%, pero sin barras de título ni de desplazamiento, seleccione Vista >

Modo de pantalla > Modo de pantalla entera con barra de menús. O bien haga

clic en el botón Modo de pantalla de la barra aplicaciones y seleccione Modo de

pantalla entera con barra de menús en el menú emergente.

3. Para visualizar una ventana en pantalla entera sólo con un fondo negro (sin

barras de título, de menús ni de desplazamiento), seleccione Vista > Modo de

CREAR DOCUMENTO NUEVO

MODOS DE PANTALLA

Cuadros de color frontal y de

fondo del Panel Herramientas

pantalla > Modo de pantalla entera. O bien haga clic en el botón Modo de

pantalla de la barra aplicaciones y seleccione Modo de pantalla entera en el

menú emergente.

Nota: Puede pasar de un modo de pantalla a otro solo presionando la tecla ( f ).

El color frontal actual aparece en el cuadro superior de selección de color del cuadro de

herramientas y el de fondo, en el cuadro inferior.

A. Icono de coles por defecto. B. Icono conmutar colores. C. Cuadro de color frontal. D. Cuadro de color de fondo.

A. Para cambiar el color frontal, haga clic en el cuadro superior de selección de color en el cuadro de herramientas y elija un color en el Selector de colores

B. Para cambiar el color de fondo, haga clic en el cuadro inferior de selección de color en el cuadro de herramientas y elija un color en el Selector de colores

C. Para invertir los colores frontal y de fondo, haga clic en el icono Conmutar colores del cuadro de herramientas Nota: También puede conmutar los colores pulsando la tecla (x)

D. Para restaurar los colores frontal y de fondo por defecto, haga clic en el icono Colores por defecto del cuadro de herramientas

Barra de

Aplicaciones,

Boton Modo de

Pantalla.

SELECCIÓN DE COLORES USANDO PANEL HERRAMIENTAS

SELECTOR DE COLORES

El selector de colores de Photoshop nos permite elegir colores de 4 modelos de color distintos,

CMYK, RGB, HSB, Lab, también puede seleccionar colores específicos, utilizando sistemas de

color como ser PANTONE, TOYO, etc.

A. Color seleccionado. B. Color original. C. Color ajustado. D. Icono de alerta de fuera de gama. E. Icono de alerta de un

color no compatible. F. Solo muestra colores compatibles con Web. G. Campo de color. H. Regulador de color. I.

Valores de color.

Nota: Al seleccionar un color del Selector de color, éste muestra los valores numéricos para HSB, RGB, Lab, CMYK y números

hexadecimales simultáneamente. Esto resulta útil para visualizar la manera en que los distintos modelos de color describen un color.

Para elegir un color, introduzca los valores de los componentes del color en los cuadros de

texto HSB, RGB y Lab también puede utilizar el regulador y del campo de color, Si opta por

seleccionar el color con el regulador y el campo de color, haga clic en el campo de color o

mueva el triángulo del regulador de color, mueva el marcador circular o haga clic en el campo

de color.

A. Selección de un color con el modelo RGB

Puede elegir un color especificando sus componentes rojo, verde y azul.

1. En el selector de color, introduzca los valores numéricos adecuados en los cuadros de texto R, G y B. Especifique valores entre 0 y 255

2. Si desea seleccionar visualmente un color con el regulador y el campo de color, haga clic en R, G o B y, acto seguido, ajuste el regulador y el campo de color

B. Selección de un color con el modelo CMYK

Puede elegir un color especificando el valor de cada componente como un porcentaje

de cian, magenta, amarillo y negro, también puede utilizar el regulador.