La imagen digital, características de imágenes vectoriales y mapas de bits. el pixel, la resolución, profundidad del color, modelos de color y formatos de archivos de imagen.

1. La Imagen Digital
Institución Educativa
Nuestra Señora del Rosario

2. Introducción
 En la fotografía tradicional de toda la vida al
revelarse la película obtenemos una imagen
impresa sobre papel fotográfico. En cambio con la
imagen digital tenemos un archivo informático.

3. ¿Qué es una Imagen Digital?
 La imagen digital está formada por una serie de
matrices numéricas de ceros y unos que se
almacenan en una memoria informática y que
definen las características de una fotografía.

4. Imágenes Procesadas
 Una vez esta imagen es interpretada (leída), los ordenadores
la transforman en una imagen visible a través de la pantalla e
imprimible también, a través de cualquier dispositivo de salida.
 La gran ventaja del archivo digital es que puede duplicarse y
copiarse tantas veces como se quiera.

5. Formación de la Imagen digital
El proceso de formación de una imagen digital
obtenida a través de una cámara es el siguiente:
1. La luz que detecta el objetivo de la cámara pasa
por el objetivo, atraviesa algunos filtros (depende
del modelo de cámara)
2. Llega hasta el sensor de imagen, denominado
CCD, que formado por multitud de receptores
fotosensibles, llamados "fotodiodos".
3. La luz incidente genera una pequeña señal eléctrica
en cada receptor. A continuación, esta señal es
transformada en datos digitales por el conversor
ADC, una serie de cadenas de ceros y unos,
denominados dígitos binarios.

6. Formación de la Imagen digital

7. Sistema Binario
 La información que procede del sensor de nuestra
cámara digital son datos analógicos. Para que
estos datos se puedan almacenar en la tarjeta de
memoria y que el ordenador pueda interpretarlos
se deben convertir a formato binario "bytes".

8. Imagen Análoga
 Si comparamos con la
fotografía tradicional y
analógica de toda la vida,
observamos que una
película fotográfica está
formada por pequeños
granitos formados por
haluros de plata sensibles a
la luz, éstos al encontrarse
muy juntos forman la imagen
que vemos.

9. Puntos de Colores: Pixeles
 La imagen que
obtenemos ya sea a
través de una
pantalla, un escáner,
o una cámara digital,
es un enorme
mosaico lleno de
millones de píxeles.
Cada píxel (cuadrito)
contiene la
información del color
de esa pequeña
porción.

10. Una Sensación Visual
 Al visualizar todos los píxeles juntos, uno al lado de
otro, dan la impresión de continuidad respecto a la
tonalidad del color, formando así la imagen.

11. Resolución de la Imagen
 La resolución de una imagen es la cantidad de píxeles.
 La resolución de una imagen digital se calcula
multiplicando su anchura por la altura en pantalla. Por
ejemplo la imagen de 1200 x 1200 píxeles = 1.440.000
píxeles, expresado en Mp megapíxel es igual a 1,4 Mp.

12. Resolución de impresión
 La resolución, expresada en puntos por pulgada
(ppp) o píxeles por pulgada (ppi), son los píxeles
por unidad de longitud, es decir, los píxeles por
pulgada. La pulgada mide 2,54 cm.
 La resolución define la cantidad de píxeles que
contiene una imagen y la dimensión de estos
píxeles expresan de qué forma se reparten en el
espacio. La resolución es la relación entre las
dimensiones digitales (los píxeles) y las físicas, las
que tendrá una vez impresa sobre papel.

13. Calcular Tamaño de Impresión
 Para calcular del tamaño en píxeles a tamaño en
centímetros para la impresión podemos aplicar la
siguiente fórmula:
* Tamaño de impresión = Número de píxeles /
Resolución (PPI, píxeles por pulgada).

14. Recomendaciones
 Existen diferentes resoluciones depende para el
trabajo o destino que queramos hacer de la
imagen utilizaremos una resolución o otra. Se
recomiendan las siguientes:
* En imágenes para visualizar en la pantalla del
ordenador o poner en Internet: 72 o 75 ppp.
* Las imágenes para impresión deben tener 150
ppp como mínimo, pero los resultados óptimos se
obtienen a partir de los 300 ppp.

15. Granulación Vs Pixelación
 En la fotografía tradicional se producía el famoso
efecto de granulación al realizar una ampliación
en la fotografía, en cambio en la imagen digital
este efecto es substituido por el de pixelación.

16. Ejemplos de Granulación y Pixelación
 Si reproducimos una imagen con baja resolución
quiere decir que el píxel ocupa más espacio y
deforma la imagen con el efecto de pixelación,
(píxeles de gran tamaño) aportando poca definición
a la imagen.

17. Profundidad del Color
 Profundidad de color es el número de bits
utilizados para describir el color de cada pixel de la
imagen.
 Cuanto mayor sea la profundidad de color de una
imagen, más colores tendrá la paleta disponible y,
por tanto, la representación de la realidad podrá
hacerse con más matices, con colores más sutiles.

18. Profundidad de un Bit

19. Profundidad de 8 Bits (escala de
grises, 256)

20. Profundidad de 8 Bits (color
indexado, 256)

21. Profundidad de +16 bits (Color por
Capas, 65536)

22. En resumen
Profundidad Representación en bits Colores
1 bit 1 2
2 bit 10 4
4 bit 1100 16
8 bit 11110000 256
16 bit 1111000011110000 65536
32 bit 1111000011110000
1111000011110000
4294967296

23. Modo del Color
 Llamamos modo de color al sistema
de coordenadas que nos permiten
describir el color de cada píxel
utilizando valores numéricos.

24. Modo Monocromático
 Se corresponde
con una
profundidad de
color de 1 bit. La
imagen está
formada por
píxeles blancos o
píxeles negros
puros.

25. Modo Escala de Grises
 Maneja el canal
negro y permite
256 tonos de gris
entre el blanco y
negro puros.

26. Modo Color Indexado
 Utiliza un canal de
color indexado de
8 bits pudiendo
obtener con ello
hasta un máximo
de 256 colores (28)

27. Modo RGB
 Cada color se forma por
combinación de tres
canales. Cada canal se
corresponde con un
color primario: Red
(rojo), Green (verde), y
Blue (azul). Asigna un
valor de intensidad a
cada color que oscila
entre 0 y 255. De la
combinación surgen
hasta 16,7 millones de
colores. Ejemplo: El
valor R:255, G:0, B:0
representa al color rojo
puro.

28. Modo HSB
 Cada color surge de los
valores de estos tres
parámetros: Hue (Tono)
que es el valor del color:
rojo, azul, verde, etc. En
GIMP se expresa en
grados y oscila entre 0 y
360. Saturation
(Saturación) que se
refiere a la pureza del
color y va del 0% al
100%. Brightness (Brillo)
referencia la intensidad
de luz del color, es decir,
la cantidad de negro o
blanco que contiene
estando su valor entre 0
(negro) y 100 (blanco).

29. Tamaño de Archivo
 El tamaño del archivo es una cifra, en bits o en bytes, que describe
la cantidad de memoria necesaria para almacenar la información
de la imagen en un soporte (disco duro, CD, tarjeta de memoria,
etc).
 el tamaño del archivo dependerá de varios factores y,
especialmente, de la resolución (R), las dimensiones de la imagen
(Largo x Ancho) y la profundidad de color (P). Puedes calcular el
tamaño de un archivo con la siguiente fórmula:
Tamaño = R²*L*A*P

Por ejemplo, una imagen de 10 x 15 cm (3,94 x 5,91 pulgadas),
con una resolución de 96 ppi (38 pcm) y una profundidad de color
de 32 bits, tendrá un tamaño bruto de:
9216 x 3,94 x 5,91 x 32 = 6.857.144 bits
es decir: 858.393 Bytes
o, lo que es lo mismo: 838 KBytes

30. Compresión de archivos
 Todos los archivos gráficos suelen tener
tamaños muy grandes. Este gran
consumo de espacio en disco hizo
necesario el desarrollo de tecnologías
capaces de comprimir archivos gráficos.
 Cada sistema de compresión utiliza un
algoritmo matemático propio para reducir
la cantidad de bits necesarios para
describir la imagen, y marca el archivo
resultante con una extensión
característica: BMP, PSD, JPG, GIF,
PNG, etcétera.

31. Formato JPG – grupo de expertos
fotográficos unidos
 Es un formato de compresión con
pérdidas, pero que desecha en primer
lugar la información no visible, por lo
que las pérdidas apenas se notan.
 El algoritmo jpg está basado en el
hecho de que el ojo humano percibe
peor los cambios de color que las
variaciones de luminosidad. jpg divide
la información de la imagen en dos
partes: color y luminosidad y las
comprime por separado.

32. … jpg
 A diferencia del formato GIF, admite una paleta de hasta 16 millones
de colores.
 Es el formato más común junto con el GIF para publicar imágenes
en la web.
 La compresión JPEG puede suponer cierta pérdida de calidad en la
imagen. En la mayoría de los casos esta pérdida se puede asumir
porque permite reducir el tamaño del archivo y su visualización es
aceptable. Es recomendable utilizar una calidad del 60-90 % del
original.
 Cada vez que se modifica y guarda un archivo JPEG, se puede
perder algo de su calidad si se define cierto factor de compresión.
 Las cámaras digitales suelen almacenar directamente las imágenes
en formato JPEG con máxima calidad y sin compresión.
 Ventaja: Es ideal para publicar fotografías en la web siempre y
cuando se configuren adecuadamente dimensiones y compresión.
 Inconveniente: Si se define un factor de compresión se pierde
calidad. Por este motivo no es recomendable para archivar
originales.

33. Formato GIF – formato de
intercambio de gráficos
 Es un formato que devuelve imágenes
de tamaño muy reducido. Esa reducción
se consigue indexando los colores, es
decir, asimilándolos a uno de los 256
colores de su tabla. Su profundidad de
color máxima, por tanto, es de 8 bits.
 El formato gif permite hacer algunas
cosas curiosas: puede hacerse
transparente uno de los colores
indexados en la tabla, lo que permite
suprimir fondos. También permite
enlazar varias imágenes gif en una
secuencia, lo que se conoce con el
nombre gif animado.

34. … gif
 Ha sido diseñado específicamente para
comprimir imágenes digitales.
 Reduce la paleta de colores a 256 colores
como máximo (profundidad de color de 8
bits).
 Admite gamas de menor número de colores y
esto permite optimizar el tamaño del archivo
que contiene la imagen.
 Ventaja: Es un formato idóneo para publicar
dibujos en la web.
 Inconveniente: No es recomendable para
fotografías de cierta calidad ni originales ya
que el color real o verdadero utiliza una
paleta de más de 256 colores.

35. Formato PNG – grafico portable
para la red
 Es el formato de más rápido crecimiento en la
web, porque reúne lo mejor de JPG y GIF.
 Se trata de un formato de compresión sin
pérdidas, con una profundidad de color de 24
bits. Soporta hasta 256 niveles de
transparencia, lo que permite fundir la imagen
perfectamente con el fondo.
 Entre sus inconvenientes hay que citar que no
soporta animaciones y que el tamaño de los
archivos PNG, debido a la capa de
transparencia, siempre es mayor que el de los
archivos JPG.

36. … png
 Es un formato de reciente difusión
alternativo al GIF.
 Tiene una tasa de compresión
superior al formato GIF (+10%)
 Admite la posibilidad de emplear un
número de colores superior a los 256
que impone el GIF.
 Debido a su reciente aparición sólo es
soportado en navegadores modernos
como IE 4 o superior.

37. Formato BMP – BITMAP
Mapa de bits
 Es un formato de compresión sin
pérdidas. Admite cualquier tipo de
resolución y una profundidad de color
máxima de 24 bits.
 Es el formato nativo de Microsoft y se
usa en todas sus aplicaciones
(Windows, Office, etc.). Por esta razón
es muy frecuente encontrar archivos
bmp, pero su tasa de compresión es
ridículamente baja. Entre los
navegadores, sólo es soportado por
Internet Explorer.

38. … bmp
 Ha sido muy utilizado porque fue
desarrollado para aplicaciones Windows.
 La imagen se forma mediante una
parrilla de píxeles.
 El formato BMP no sufre pérdidas de
calidad y por tanto resulta adecuado
para guardar imágenes que se desean
manipular posteriormente.
 Ventaja: Guarda gran cantidad de
información de la imagen.
 Inconveniente: El archivo tiene un
tamaño muy grande.

39. TIFF – formato de archivo de
imagen etiquetada
 Almacena imágenes de una calidad
excelente.
 Utiliza cualquier profundidad de color
de 1 a 32 bits.
 Es el formato ideal para editar o
imprimir una imagen.
 Ventaja: Es ideal para archivar
archivos originales.
 Inconveniente: Produce archivos muy
grandes.

40. En resumen…

41. TALLER
Presentar un trabajo escrito (a mano) con Normas ICONTEC en
el cual respondas:
1. Diseña un cuadro comparativo entre imagen matricial y
grafico vectorial.
2. Cuales son las diferencias entre dimensión de la imagen y
su resolución?
3. Explica el proceso para capturar una imagen mediante una
cámara digital (mediante un grafico)
4. Diseña un cuadro comparativo entre los distintos formatos
de imagen: bmp, gif, jpg y png. Incluyendo características,
ventajas y desventajas, entre otras…
5. Que es profundidad de color, y cuales son las mas
utilizadas?
6. Explique las diferencias entre los modelos del color RGB y
CMYK.
Nota: el trabajo incluye: PORTADA, INTRODUCCION, TABLA
DE CONTENIDO, DESARROLLO, CONCLUSION,
BIBLIOGRAFÍA, WEBGRAFIA

42. GRACIAS POR SU
ATENCIÓN