INICIO CURSO

MÓDULO 2:

Imagen digital

Unidades     

UNIDAD 1    UNIDAD 3  UNIDAD 4  UNIDAD 5  UNIDAD 6  UNIDAD 7
Formatos gráficos: vectoriales y bitmaps

Las imágenes en un ordenador difieren de otros tipos de imágenes - como pueden ser las fotografías y los dibujos - en el hecho de que son digitales, guardadas en forma de una secuencia de bits y que pueden ser modificadas en diferentes aspectos, como la medida y el color. Cómo se guarda esta información también será diferente según el número de colores que formen la imagen (profundidad de color).

Los gráficos de ordenador se agrupan en dos grandes tipologías de formatos:

  • Gráficos vectoriales

    • Los archivos de gráficos vectoriales contienen un conjunto de instrucciones (vectores). Estos vectores describen las dimensiones y formas de cada línea, círculo, arco o rectángulo que hace el dibujo. Cuando la imagen se visualiza, el programa lee estas instrucciones y reconstruye las formas y los colores para representarlos en la pantalla.

    • La ventaja principal de los gráficos vectoriales es que cada pieza de la imagen puede ser manipulada separadamente. Es posible mover objetos individuales, girarlos en la pantalla, alargarlos, rotarlos, duplicarlos o introducir una distorsión. También hay que tener en cuenta que al modificar la medida de las imágenes, éstas no pierden definición (en cambio, los bitmaps sí), y además, los archivos tienen un tamaño reducido.

    • La principal desventaja de este formato es que las imágenes, cuanto más complicadas son, el ordenador tarda más tiempo en calcularlas y, por tanto, en representarlas.

    • Formatos: CDR, DXF

    • Herramientas: Corel Draw, Illustrator, Freehand...

  • Mapas de bits (bitmaps)

    • Los bitmaps están compuestos por un conjunto de bits en la memoria del ordenador que definen el color y la intensidad de cada píxel de una imagen. Un píxel es cada una de las casillas o celdas en que se puede descomponer una imagen digital. Los bitmaps son típicamente usados para reproducir imágenes que contienen muchos detalles, sombras y colores: fotografías, negativos de películas y otras ilustraciones.

    • Las herramientas usadas para crear bitmaps son los editores gráficos, que permiten pintar píxel a píxel con el color adecuado.

    • Los gráficos de mapas de bits normalmente requieren más espacio en disco que los gráficos vectoriales, el motivo es que los bitmaps contienen información específica sobre cada píxel representado en la pantalla.

    • Formatos: BMP, PCX, JPG, TIF, GIF...

    • Herramientas: Paint Shop Pro, Photoshop, Paintbrush, Corel Photopaint...

Formatos de bitmaps: GIF y JPG

GIF y JPEG (o JPG) son los formatos de imágenes más usados para utilizar tanto en las páginas web como en aplicaciones multimedia que deban transmitirse a través de Internet. Ambos formatos son mapas de bits. GIF son las siglas de Graphics Interchange Format y se desarrolló específicamente para gráficos on line. JPEG corresponde a Joint Photographic Experts Group y se desarrolló como un medio para comprimir fotografías digitales. Como características principales tenemos:

  • Formato GIF:

    • Utiliza un algoritmo de compresión sin ningún tipo de pérdida.

    • Funciona mejor con amplias áreas del mismo color, o sea, que no haya tramas de colores mezclados.

    • Los gráficos están limitados a 256 colores.

    • Admiten transparencia. Eso quiere decir que tienen la posibilidad de convertir en transparente o invisible un solo color, de manera que las zonas que tengan este color sean invisibles.

    • Permiten hacer animación con una técnica de poner muchas imágenes en el mismo archivo GIF.

    • Permite el modo entrelazado, eso significa que la imagen se muestra inicialmente con una baja resolución y poco a poco se va mostrando progresivamente con una mayor resolución a medida que va cargando la información del archivo.

  • Formato JPEG:

    • El algoritmo que utiliza descarta algunos bloques de datos de las imágenes cuando las comprime. Por esta razón es mejor no utilizarlo más de una vez con cada imagen. Cada vez que se utiliza este algoritmo, se eliminan más datos. Se entiende que solo se utiliza el algoritmo cuando se guarda la imagen, aunque no cambie el factor de compresión.

    • Está optimizado para fotografías e imágenes escaneadas con 16 millones de colores o, lo que es lo mismo, de 24 bits de profundidad de color.

    • Permite elegir el grado de compresión, cuanta más compresión más pérdida y el tamaño del archivo es menor.

    • Tardan más tiempo en visualizarse, sobre todo en máquinas lentas, debido a la complejidad del algoritmo de descompresión, ya que necesita mucho cálculo matemático.

    • No admite ninguna clase de transparencia.

    • Este tipo de gráficos son los que ocupan mas espacio en la memoria. No obstante, la mayoría de las veces no es necesario tener las imágenes con tantos colores y por eso utilizaremos una función de Paint Shop que es el cambio de profundidad de color.

La profundidad de color

La profundidad de color se refiere a la cantidad de bits que necesita cada píxel para guardar información de la imagen. Actualmente, gracias a la avanzada capacidad gráfica de las tarjetas de vídeo de los PCs, casi todas las imágenes son del tipo "todo color" o también llamadas "true color" (color verdadero). Eso quiere decir que por cada píxel se necesitan 24 bits, o lo que es lo mismo, 3 bytes, (8 bits corresponden a 1 byte), 8 bits por cada canal de color RGB "Red, Green, Blue" (rojo, verde, azul).

Existen tres formas diferentes de codificar el color:

  • RGB (Red, Green, Blue)
    Codificación del color primario con 1 byte (rango 0-255)
    Cada píxel precisa 3 bytes (1 por color) = 24 bits/píxel. Es la forma mas utilizada para codificar el color.

  • HSB (Hue, Saturation, Bright)
    Definición del color por la combinación de tres características: el tono (o tinte), la saturación y la luminosidad.

  • CYMK (Cyan, Yellow, Magenta, Black)
    Codificación de los pigmentos de cuatricromía empleada en la impresión gráfica.
    Paint Shop Pro no incorpora esta forma de codificar el color.

    En las páginas web, el color que usamos para definir las fuentes, el fondo... se pone en formato RGB, y  además está normalmente en formato hexadecimal. Como tenemos tres componentes (R, G y B), cada uno puede tener un valor entre 0 y 255, o lo que es lo mismo, entre 00 y FF. Por eso te encontrarás casos como por ejemplo FFFFFF, que sería como decir R=255, G=255 y B=255, es decir, el color blanco. En la ventana de definición de colores de Paint Shop Pro verás que salen los tres componentes: en RGB, en HSB y debajo el valor correspondiente en hexadecimal, que es el que pondríamos en la página web.

Cuanta más profundidad de color tenga una imagen mejor se verá, pero más espacio ocupará en la memoria y, por tanto, en el disco. Aquí tienes un ejemplo de la misma imagen en tres profundidades diferentes:

16 millones de colores, 45 Kb

256 colores, 15 Kb

16 colores, 7'5 Kb

El entorno Windows puede cambiar de una manera sencilla la profundidad de color. Es recomendable que tu sistema esté configurado con una profundidad de color de 24 bits para evitar problemas con la visualización de imágenes con muchos colores, como por ejemplo, las fotografías. Para ver qué profundidad de color tienes, ve al escritorio y, en un lugar vacío, pulsa con el botón derecho, y elige la opción Propiedades. A continuación ponte en la pestaña Configuración y selecciona la configuración deseada.


Si trabajas con un ordenador antiguo es probable que no puedas cambiar esta configuración a 24 bits, ya que o la tarjeta de vídeo del ordenador o el monitor no soporten estas características. Si el ordenador es relativamente nuevo (a partir de un Pentium MMX) y no te deja cambiar, muy probablemente necesites instalar o reinstalar los drivers de la tarjeta de vídeo o del monitor.

Un detalle importante es que algunas de las opciones de retoque de imágenes como son algunos filtros y efectos, sólo funcionan si las imágenes están con una profundidad de 16 millones de colores o, lo que es lo mismo, imágenes "true color" (24 bits). También es necesario trabajar con gráficos de 24 bits para poder trabajar con capas (ver unidad 4).

 

Práctica 1: Cambiar el formato
  • Lo primero que harás es cargar un archivo con Paint Shop Pro. Para hacer esto ve a la opción del menú Archivo y después Abrir.... Una vez que haya salido el cuadro de diálogo carga la imagen con el nombre imagen1.jpg (recuerda que antes de cargarla la has debido guardar en el disco duro). Si observas antes el tamaño del archivo con la ayuda del Explorador del Windows, verás que ocupa unos 127 Kb. La extensión de este archivo te indica que se trata del formato de imagen JPG. Este formato se denomina de "compresión con pérdida". Cuanto mayor sea la compresión, más se comprimirán los datos originales y, por tanto, obtendremos menos calidad.

 

  • Seguidamente guarda el archivo con otro formato con la opción Guardar como... del menú Archivo. Selecciona como formato el que tienes en la imagen:

    Lo primero que verás una vez guardada la imagen es el incremento en el tamaño del archivo, exactamente ocupa 1000 Kb. Este formato no utiliza compresión y eso implica que el tamaño sea mucho mayor que la guardada en el otro formato (el JPG).

  • Un detalle a tener muy en cuenta es que todos estos formatos son de 16 millones de colores, tal como te lo muestra en la parte inferior derecha Paint Shop Pro.

  • Ve haciendo pruebas con otros tipos de formatos, como por ejemplo el formato TIF, que también tiene compresión, pero a diferencia del JPG no tiene ninguna pérdida. También puedes probar con el formato PNG, que es otro que tiene compresión sin pérdida. Cada uno de estos formatos resulta adecuado para guardar las imágenes según el destino final que tengan (impresión en papel, página web, documento Word, aplicación multimedia, etc.).

 

Práctica 2: Cambiar la profundidad de color

Una de las operaciones más realizadas con las imágenes es el cambio de profundidad, o lo que es lo mismo, cambiar el número de colores. Este procedimiento se utiliza normalmente para reducir el número de colores, aunque también  puede servir en caso de que se quiera subir la profundidad. Para saber a qué profundidad de color está la imagen ponte sobre ella  y mira la esquina inferior derecha de Paint Shop Pro. Dentro de la barra salen unos números que indican la medida de la imagen en anchura, altura y número de colores.

  • Ahora harás una reducción de color. Abre el archivo imagen2.jpg con Paint Shop Pro. Una vez cargada la imagen, verás que en la esquina inferior derecha pone las medidas de la misma y la profundidad de color. En este caso es de 300 por 448 píxeles y de 16 millones de colores, o lo que es lo mismo, de 24 bits.

     

  • Ahora, para reducir los colores de la imagen, ve a la opción Disminuir el número de colores dentro del menú Colores. Y dentro de ésta elige 256 Colores (8 bit), tal como te muestra la imagen siguiente:

  • Entonces te saldrá una ventana en la cual podrás elegir la manera de hacer esta reducción de color.

    El resultado final puede variar según qué opción hayas escogido. Si puede ser, la mejor es la opción Estándar dentro de la sección Paleta. Un nuevo concepto que aparece es el de Paleta. La paleta de colores es una tabla que hace referencia a los colores que contiene la imagen y que se incluye en el archivo bitmap.

    Tipos de paletas:

    • 1 bit: imágenes en blanco y negro

    • 4 bits: imágenes de 16 colores

    • 8 bits: imágenes de 256 colores

    Cada imagen tiene una sola paleta asociada. Se ha de tener en cuenta que si visualizamos muchas imágenes con paletas diferentes en un sistema que esté configurado a 256 colores, se pueden producir efectos como que se solaricen, o que no se vean de forma adecuada, que se produzca un “dithering”. El “dithering” es una técnica para la representación de una imagen usando menos colores que la original. Se utiliza un subconjunto de los colores definidos por un bitmap, variando la agrupación de píxeles para crear un mejor resultado de los efectos de pérdida de color. Un buen método de “dithering” puede crear la ilusión de tener más colores en una imagen.

  • Puedes hacer más pruebas cambiando la resolución a 16 colores o modificando las opciones que hay en los cuadros de diálogo de los cambios de resolución.

    Como has podido ver a lo largo de toda la práctica, se trabaja habitualmente con una configuración de 16 millones de colores. La limitación del formato GIF se encuentra pues, en trabajar como máximo a 256 colores. De todas formas, la resolución de los monitores permite utilizar estos gráficos en la red de Internet con prestaciones muy buenas.
    Hay que decir, sin embargo, que con los equipos y las tarjetas gráficas actuales no hay ningún problema en usar gráficos JPG, mas si tenemos líneas de conexión a Internet rápidas.

 

Práctica 3: Optimizar archivos JPG

Vamos a ver como optimizar compresión, calidad y tamaño de los archivos en formato JPG.

  • Abre el archivo imagen5.jpg con Paint Shop Pro.

    Esta imagen tiene una calidad muy aceptable. Ahora lo que harás es guardarla con menos calidad. Para hacerlo ve a la opción Guardar como... del menú Archivo.

    Dentro de esta ventana hay una parte que es donde se le dice a Paint Shop Pro con qué formato guardará la imagen.

  • Selecciona la opción de tipos de archivo tal como te muestra el gráfico.

  • Antes de guardar la imagen has de pulsar el botón que dice Opciones...

  • A continuación te mostrará un cuadro de diálogo con las opciones del formato JPEG.

    Para ajustar más o menos compresión has de mover el control. Tal como te muestra, si pones más compresión obtendrás menos calidad y viceversa.

  • Haz diversas pruebas con diferentes compresiones y ve comprobando la calidad con la ayuda de la herramienta Acercar (zoom) y también observa lo que ocupa en tu disco duro

 

UNIDAD ANTERIOR

UNIDAD SIGUIENTE