Diseño gráfico de productos editoriales multimedia. ARGN0110

6.6. Creación y desarrollo de los bancos de imágenes

Cuando estamos desarrollando nuestros proyectos y tenemos que utilizar imágenes, es poco probable que contemos con los medios suficientes para que todas estén producidas por nuestro equipo. Es mucho más eficiente y económico utilizar imágenes prediseñadas que se ajusten a nuestras necesidades. Los bancos de imágenes o stock images son un concepto muy extendido en diseño y publicidad, que responde a esta necesidad. Se trata de una colección de imágenes fotográficas, organizadas temáticamente, cuya licencia el propietario cede para su uso con carácter no exclusivo. Anteriormente a la eclosión de internet, las empresas de bancos de imágenes ofrecían sus servicios a través de catálogos impresos. Actualmente, este sector se ha desplazado a la red y existe un amplio abanico de imágenes de stock en internet, ya sean de pago, gratuitas o con licencias limitadas. Cuando estas imágenes son ilustraciones, se denominan clip-art.

En otro capítulo estudiaremos los distintos tipos de licencia que rigen las imágenes de stock y clip-art, y que deben ser tenidas en cuenta para no infligir derechos de propiedad intelectual.

Todos los recursos visuales que utilicemos en nuestro proyecto conformarán un banco de imágenes, denominado en la mayoría de aplicaciones informáticas “biblioteca”. El programa informático dará la opción de importar imágenes de archivo directamente al proyecto, o a la biblioteca. Es mucho más productivo importar todas las imágenes a la biblioteca o bibliotecas que creemos, para tener nuestro proyecto bien estructurado: no solamente podremos utilizar los recursos en diferentes puntos con más comodidad, sino que al modificar la imagen esta modificación se hará extensible a todas las veces que aparezca en nuestro proyecto.

Aplicación práctica

Usted debe optimizar varios archivos de su banco de imágenes para utilizarlos en un proyecto. Siendo estas las características de las mismas, ¿a qué formato y resolución tendrá que convertirlos?

Imagen A: fotografía de un paisaje, de 3000x1600 p, a 300 ppp, en TIFF.

Imagen B: logotipo de la empresa, de 300x150 p, a 75 ppp, en JPG.

Imagen C: fotografía de un dibujo de línea en blanco y negro, de 500x300 p, a 150 ppp, en JPG.

Imagen D: imagen del botón para acceder a otra pantalla, de 30x50 p, a 75 ppp, en GIF.

SOLUCIÓN

Debemos pasar todas las imágenes a 75ppp. La imagen A debe ser escalada, porque su resolución es excesiva, para ajustarla al tamaño que deba tener en pantalla teniendo en cuenta la resolución del monitor. Los formatos deseables son:

1 Imagen A: JPG.

2 Imagen B: GIF o PNG.

3 Imagen C: comparar el peso de la imagen en JPG y GIF o PNG. Si el JPG tiene pérdida perceptible, elegir GIF o PNG. En caso contrario, elegir el de menor peso.

4 Imagen D: puede quedarse como estaba.

6.7. Equilibrio de color en proyectos digitales

En cualquier fotografía es fundamental que exista un equilibrio adecuado de colores y tonos. Los errores más comunes de equilibrio de color son:

1 Zonas excesivamente blancas o negras que no tienen textura ni grano.

2 Zonas con un color excesivamente saturado que desentonan con el resto de la imagen.

3 Discordancia de tonos o color con respecto al motivo original (imagen demasiado oscura o clara, o con una temperatura de color diferente).

Para evitar estos errores, los fotógrafos suelen hacer una toma de prueba con la máquina, colocando una tarjeta de un tono gris medio o con una escala de colores. Esta tarjeta se denomina “testigo” y ayuda a optimizar los ajustes en el momento de la toma. Igualmente, si se hace una instantánea de prueba con el testigo, después podrá verificarse en pantalla si los tonos y colores de la fotografía están equilibrados. Dado que se conoce el valor tonal objetivo de la carta, se utiliza esta como punto de partida y se ajustan los parámetros para que la carta aparezca en la imagen con su valor real, lo que por añadidura igualará el resto de valores de color y de gris con los del motivo original.

Dentro de un proyecto digital, interesa no solo que las imágenes estén equilibradas, sino que exista un equilibrio de color entre todos los elementos. Si cada imagen ha sido equilibrada correctamente una por una, y son fotografías tomadas en condiciones adecuadas, no tiene por qué haber problemas. Pero, dado que no siempre tenemos total control sobre las fuentes con las que trabajamos, es posible que algunas fotos estén aparentemente equilibradas porque todos los elementos internos están armonizados, y sin embargo al situar la imagen junto a otra se perciba que la fotografía es en general demasiado oscura, demasiado clara o las temperaturas de color no cuadran.

Consejo

Si no disponemos de un testigo en la fotografía, lo cual será bastante frecuente, tendremos que localizar en la imagen una zona de gris neutro para tomarla de referencia.

Temperatura del color

La temperatura del color es un factor que también afecta al equilibrio cromático en las imágenes digitales. Este concepto se refiere, en el campo de la fotografía, a la predominancia de alguno de los colores del espectro sobre los demás. Se mide en grados Kelvin y depende de la fuente de luz en el momento de la toma, pudiendo corregirse con la cámara o bien con programas de retoque fotográfico. Aunque en ocasiones es poco perceptible a simple vista, es más evidente en los colores blancos de la imagen, especialmente por comparación con otras fotografías a diferente temperatura.

6.8. De vectores a píxeles y viceversa

La mayoría de aplicaciones informáticas tienen herramientas para convertir imágenes vectoriales en bitmaps en un proceso que se llama rasterización, y viceversa, mediante una vectorización.

La rasterización no tiene pérdida de información respecto a la imagen original, pero hay que tener en cuenta que una vez se ha realizado, las líneas que conforman la imagen no podrán editarse cambiando su posición, tamaño, etc., con un simple clic, y que al escalarse perderán definición.

La vectorización es un proceso más complejo, porque si la imagen no es una figura plana, el ordenador tiene que establecer planos en la misma para crear figuras vectoriales a partir de ella, y el resultado puede no ser adecuado. Cuando vectorizamos una imagen, pedirán un número de nivel de profundidad. Este número es la cantidad de planos de color que se crearán a partir de la imagen original.

Si la imagen que queremos vectorizar es compleja, facilitará la labor que previamente hagamos una separación de planos (posterización) con una aplicación de retoque fotográfico, para que en la vectorización el resultado se ajuste a nuestras expectativas. En la posterización podremos elegir también el número de planos de color que queremos que tenga la imagen, entendiendo siempre que tres planos de color significa que todos los gradientes de la imagen van a convertirse en planos de color A, B o C.

Vectorizar o rasterizar es una opción que debe ser utilizada teniendo muy claro para qué necesitamos nuestra imagen. No es de gran utilidad vectorizar una imagen fotográfica si no pretendemos que su función sea la que habitualmente se atribuye a los gráficos vectoriales; solo obtendremos una imagen pesada, con un número de puntos de edición enorme, y que visualmente no tendrá más interés que la original.

Sabía que...

La diferencia fundamental entre vectorizar y posterizar una imagen, es que la imagen resultante de la posterización sigue siendo un bitmap, mientras que la vectorización convierte el archivo en un dibujo vectorial.

6.9. Convertir a blanco y negro

En la fotografía tradicional, el blanco y negro era una técnica completamente diferente al color en cuanto a materiales y proceso técnico. Actualmente, en el trabajo digital, todas las aplicaciones de retoque fotográfico permiten eliminar la información de color mediante una herramienta que algunos programas denominan también desaturar.

Cuando convertimos una imagen a blanco y negro, es importante conocer las características del color-luz. Como veremos en el próximo apartado, los colores tienen una luminosidad propia, en base a su capacidad de reflejar o absorber la luz. Cuando una imagen pierde el color, se eliminan los matices (es decir, si un plano es azul, verde o rojo) y lo que queda es el grado de luminosidad del color perdido, que determinará si el gris es más claro o más oscuro. Algunos colores son más brillantes que otros, como el amarillo o el cyan, y los grises resultantes son más claros, mientras que otros como el rojo o el verde se convierten en grises más oscuros.

Importante

Al desaturar una imagen, es posible que necesitemos volver a equilibrarla, puesto que algunos tonos que pasaban inadvertidos en la imagen original podrán convertirse en grises demasiado oscuros o claros.

6.10. Preparación para edición en internet. Adaptación y creación de nuevos elementos

Uno de las dificultades más importantes de los productos multimedia es que la composición de los elementos visuales puede sufrir variaciones según el dispositivo en el que se ejecute. En el caso de la edición en internet, este problema es capital y condiciona desde el punto de partida la mecánica de trabajo en la producción.

Efectivamente, no podemos distribuir los elementos como lo haríamos en un papel, cuando no sabemos a priori ni siquiera si el soporte va a ser horizontal o vertical, (tablet frente a smartphone, por ejemplo). Este tema, la adaptabilidad web, será analizado más a fondo en el siguiente capítulo.

La adaptabilidad es el concepto por el cual la jerarquía de los elementos y su composición no se realiza de forma estática, sino dinámica y condicionada a las características de los dispositivos que puedan ejecutar el producto.

Antes de la aparición de los smartphones y tablets, la solución para la adaptabilidad era estructurar la imagen en marcos (frames) de tamaño relativo al de la ventana del navegador, con lo cual ningún cuadro de texto o imagen tenía un tamaño o ubicación fijos, sino que todos estaban relacionados entre sí proporcionalmente.

Actualmente, la adaptabilidad es un concepto mucho más complejo, y se han creado estándares que facilitan que los diseños sean susceptibles de ser reproducidos en los nuevos dispositivos móviles.

Para garantizar la adaptabilidad en estos términos, el diseñador debe establecer en su página, a través de reglas CSS, unos contenidos mínimos para las pantallas más pequeñas, con su distribución espacial relativa, estableciendo un punto de corte (breakpoint) a partir del cual, si se detecta que el dispositivo y el navegador lo permiten, se añadirán elementos nuevos modificando la estructura visual de los previos.

7. Teoría del color

El color es un fenómeno perceptual de vital importancia a la hora de desarrollar un diseño. Explicar qué es el color y cómo funciona no es una tarea fácil, y ha tenido diversas interpretaciones a lo largo de la historia. En este apartado vamos a estudiar las teorías más importantes sobre este tema, las bases científicas actualmente aceptadas, y por último el modo en que funciona el color en el ámbito de la percepción y el diseño.

7.1. Historia y principales teorías

La primera referencia de estudio científico del color data de la antigua Grecia. Platón, por ejemplo, presume que los objetos desprenden partículas que nuestros ojos reciben, y Aristóteles ya atribuye el carácter de onda a la luz. Euclides escribe un tratado sobre Óptica donde afirma que la luz viaja en línea recta. Ptolomeo, ya en el s. II d.C., descubre que los rayos de luz rebotan en las superficies, en idénticos ángulos de incidencia y reflexión.

Newton (1642-1727) es una figura clave en el descubrimiento de la naturaleza y el comportamiento de la luz. La encuadra en el marco de la óptica, definida claramente como una rama de la física diferente a otras como la mecánica, el magnetismo, etc. En el famoso experimento del prisma, fechado en 1666, evidenció cómo un rayo de luz blanca, al pasar por un cristal prismático en un entorno oscuro, se descompone en siete colores diferentes. Fenómeno que puede revertirse mediante otro prisma idéntico.

Este experimento demuestra que todos los colores del espectro visible están ya en la luz blanca, y por tanto no se desprenden de los objetos de forma autónoma: por el contrario, los objetos reflejan esta luz de una u otra manera, propagándose en línea recta. Y la luz blanca no es otra cosa que la suma de todos los colores. No obstante, Newton sigue considerando la luz un concepto corpuscular. Es Huygens (1629-1695) quien formula una teoría ondulatoria por la cual la luz no es una partícula, sino una vibración.

La verdadera naturaleza de la luz sigue siendo aún una cuestión abierta. No obstante, está científicamente aceptado que se trata de una onda electromagnética, cuya diferencia con el sonido o los rayos X es solamente la longitud de la misma.

La longitud de onda es como se denomina a la frecuencia con la que se repite el ciclo de vibración de esta. Cuando se representa gráficamente, la onda dibuja un movimiento cíclico cuyos puntos de inflexión se llaman crestas en la zona superior, y valles en la inferior. La longitud de onda se identifica como el espacio que hay entre cada cresta de la onda.

Existe un tramo del espectro de ondas que se denomina visible o lumínico, que va desde 780 a 380 nanómetros. Por encima de estas están los rayos ultravioleta, y por debajo, los infrarrojos.

Sabía que...

Existen unos carretes de fotos especiales, y filtros en algunas cámaras digitales, que son capaces de fotografiar la luz infrarroja. Debido a que todo cuerpo caliente emite radiación infrarroja, las superficies orgánicas como hojas de las plantas o piel humana se ven aterciopeladas y con tonalidades diferentes a las habituales.

7.2. Color luz: colores primarios y secundarios

Aunque la luz blanca es la suma de todos los colores, la mezcla de los mismos en un soporte físico mediante témperas, lápices, etc., no resulta en un blanco, sino en un tono gris-marrón. Esto es debido a que existen dos escalas de color diferente: el color-pigmento y el color-luz.

El color pigmento y las mezclas sustractivas

Los objetos tienen una sustancia que los hace opacos, llamada pigmento. Este tiene la propiedad de absorber ciertas longitudes de onda del espectro lumínico; o lo que es lo mismo, ciertos colores. Las ondas que no absorbe son reflejadas. Estos rayos son los que nuestro ojo recibe y, por tanto, los que definen el color que vemos en el objeto.

Por lo tanto, un objeto azul es aquel cuyo pigmento absorbe todos los colores que no sean el azul, y de un objeto rojo o verde podemos esperar lo mismo.

Esto explica que la mezcla de colores en una paleta sea opuesta a la mezcla de colores lumínicos. Si un pigmento verde solo devuelve el verde, al ser mezclado con otro color, ambos pigmentos sumarán su acción absorbente y restarán la cantidad y matices de luz que reflejan. Es por esto que, en las artes plásticas, mezclar los colores excesivamente o sin cuidado produce colores que tienden al marrón grisáceo; y es este el motivo por el que este tipo de mezclas se denomina sustractiva: las ondas de luz reflejadas en la mezcla se van restando entre ellas.

Los colores primarios sustractivos son el amarillo, el cyan y el magenta. De su mezcla a partes iguales se obtiene verde, azul añil y rojo. Los tres primarios mezclados a partes iguales en las condiciones adecuadas darían como resultado el negro, puesto que al mezclar todos los pigmentos primarios, ningún color es reflejado por el objeto, ya que absorbe todas las ondas del espectro lumínico.

El color luz y las mezclas aditivas

Cuando estamos hablando de la escala lumínica, hablamos de mezclas aditivas. Las radiaciones de cada color se van añadiendo unas a otras, y es por ello que todas juntas suman el blanco, que es el color más luminoso posible. La ausencia de luz sería el negro, al contrario que en la escala sustractiva (color pigmento).

Los colores primarios del color luz son el azul, rojo y verde. De la mezcla de estos a partes iguales se obtienen el amarillo, el cyan y el magenta. Es interesante observar cómo la escala de color es inversa a la del color pigmento: los secundarios son ahora primarios y viceversa.

Estas mezclas solo pueden observarse en la pantalla de un ordenador o en focos de luz coloreada; nunca en superficies físicas transparentes como celofán coloreado, cristales teñidos, etc., porque estos, a pesar de ser transparentes, no emiten luz propia sino que reflejan la que reciben y, por tanto, sigue tratándose de mezclas sustractivas cuyos primarios son amarillo, cyan y magenta.

Sin embargo, tres focos de luz primaria (azul, verde y rojo) nos darán la siguiente mezcla al ser proyectados sobre una pared blanca.

Existen diversos esquemas de representación de los colores que facilitan su clasificación. Uno de los más simples es el círculo cromático, donde se representan los colores primarios separados en un ángulo de 120º cada uno, e interponiendo entre ellos todas las gradaciones de mezcla posibles con el primario adyacente a este.

Los colores que resultan de mezclar a partes iguales un primario y un secundario se denominan terciarios. La mezcla de secundarios y terciarios da lugar a colores cuaternarios.

7.3. Propiedades y fisiología del color

Cuando estamos hablando de color tenemos que tener en cuenta que se trata de un fenómeno dual: un concepto físico-óptico objetivo, que sucede en la naturaleza; y un fenómeno intelectual subjetivo, que es la identidad que nuestro cerebro configura a partir de lo que los ojos han recibido.

Fisiología del color

Hasta el momento hemos hablado de color como onda electromagnética, con lo cual se trata de un fenómeno científicamente estudiable y que no está sujeto a interpretación. A continuación, vamos a analizar los aspectos biológicos del color: cómo se percibe a través de la vista, puente de paso entre la realidad objetiva y la impresión subjetiva; y finalmente cómo el cerebro realiza la transducción perceptiva de la que hablábamos al principio del capítulo, convirtiendo la luz en un impulso eléctrico, y el impulso eléctrico en una percepción. En este proceso, pasaremos de un hecho objetivo a una impresión subjetiva.

El color que percibimos de un objeto depende de tres factores:

1 La luz ambiental que el objeto recibe y refleja. El color de esta luz es la materia prima que sirve de punto de partida; no podremos ver una rana verde bajo una luz roja, porque no habrá luz verde que esta pueda reflejar.

2 La pigmentación del objeto y su capacidad de reflexión de la luz.

3 La respuesta biológica de las células receptoras que están en la retina humana.

Las radiaciones lumínicas que penetran en el ojo son registradas en la retina por un conjunto de células denominadas conos y bastoncillos. Mientras que los conos son células especializadas en cada uno de los tres colores primarios (rojo, verde y azul), los bastoncillos son los que perciben la intensidad luminosa (lo que podríamos denominar el brillo de cada color).

Conos y bastoncillos se distribuyen a lo largo de la retina mezclados con los bastoncillos como si se tratara de una película fotosensible. De hecho, el ojo humano tiene un mecanismo de recepción de la luz análogo al de las cámaras fotográficas (y, por ende, el de la cámara oscura): la luz penetra por una pequeño orificio (diafragma en la cámara, pupila en el ojo) y es proyectada, a menor tamaño y boca abajo, en una cámara oscura donde queda registrada; en el caso del ojo, en la retina.

Sin embargo, en el momento en que sucede la transducción a través del nervio óptico, el color se convierte en un proceso intelectual, al igual que la forma. En la decodificación de esta información, el cerebro sigue todos los principios perceptuales que hemos visto en el primer apartado, creando un producto mental subjetivo.

Sabía que...

El daltonismo es un defecto genético que limita la visión de los colores. Quien padece esta afección tiene un fallo genético en la producción de uno de los tres tipos de conos, o varios de ellos. El tipo o tipos de cono cuyo pigmento no se produce, es el que el daltónico percibe como gris.

Propiedades del color

Para hacer una medición lo más objetiva posible del color, existen una serie de parámetros y conceptos que ayudan a expresarnos de un modo más específico a la hora de describir un color.

Propiedades cuantitativas: parámetros RGB

Existen métodos de medición del color homologados que permiten definir un color de cara a ser reproducido. Uno de ellos, de importancia fundamental en el diseño asistido por ordenador, es el que usa los parámetros RGB. Estos cuantifican la cantidad de cada uno de los colores primarios que componen un matiz, en un valor que oscila entre el 0 (ninguno) y el 255 (máximo). Este parámetro se define por los tres colores primarios: R, rojo, inicial de red, G, verde, inicial de green, y B, azul, inicial de blue.

Cualquier matiz lumínico se cuantificaría en 6 dígitos hexadecimales (del 00 al FF, que en base decimal es el 255) o 9 dígitos decimales, expresados en el orden R,G,B. Así, el blanco, donde todos los colores-luz tienen su máxima intensidad, sería el FFFFFF o el 255255255. El verde puro sería 00FF00 o 000255000, el negro, 0 absoluto, y un gris cualquiera tendría los tres parámetros iguales (0F0F0F, por ejemplo, que sería 016016016).

Este sistema permite distinguir entre 1000 millones de matices.

Propiedades cualitativas: matiz, brillo, saturación

A la hora de expresar cómo es un color cualitativamente utilizamos tres conceptos diferentes.

El matiz viene definido por la longitud de onda del color; lo cual permitiría distinguir entre un azul, verde, rojo, etcétera.

El brillo, también denominado luminosidad, expresa la cantidad de luz que el color emite. Un mismo matiz de verde puede ser más intenso o menos en cuanto la fuente de luz sea más potente. Pero este factor también se ve afectado por otras variables, especialmente cuando hablamos de color pigmento; una misma tinta puede ser más o menos luminosa, por ejemplo, según el papel en el que se imprima, puesto que su superficie reflejará la luz recibida en mayor o menor grado. Del mismo modo, un mismo color será más brillante en una habitación luminosa que en una oscura, puesto que tiene menos luz que reflejar.

La saturación define la intensidad de color que hay en un matiz. Los matices poco saturados tienden al gris o a tonos pastel, y tienen poco pigmento o luz poco coloreada, a favor de matices grises o blanquecinos.

Podemos figurarnos estos dos últimos conceptos de forma intuitiva recordando los mandos del televisor. Mientras que el botón de brillo hace que la pantalla ilumine con más fuerza o se haga más oscura, sin modificar la intensidad de los colores, el de saturación convierte la imagen gradualmente en tonos de gris.

Anteriormente nos hemos referido a un cuarto concepto llamado tono, de uso polisémico. Por un lado, es un concepto análogo al de luminosidad: la medida de los grises en una imagen, en contraposición al concepto de color. Pero también se emplea como sinónimo de matiz (tonalidad azul, tonalidad verde...).

Actividades

14. Recorte diez cuadrados de papel de diferentes colores, ordenándolos de más claro a más oscuro en una cartulina negra. Saque una fotocopia en blanco y negro y compruebe si ha acertado en la escala de luminosidad.