E.R

Tema 2 Manejo de imágenes

ObjetivosConocer los tipos y formatos de imágenes digitales.Ser capaz de digitalizar imágenes y crear imágenes digitales.Ser capaz de manipular imágenes digitales utilizando software especializado.

Sistema de conocimientos1.Tipos de imagen(a)Imágenes de mapa de bits.(b)Imágenes vectoriales(c)Principales formatos.2.Digitalización de imágenes 3.Manejo de imágenes con Adobe Photoshop.(1)Creación de fondos(2)Manejo de texto(3)Capas(4)Botones(5)Mejora y redimensionamiento de fotografías(6)Combinación de fotografías.

E.R

Tipos de imágenesImágenes de mapas de bits:imágenes de mapa de bits  (también denominadas  imágenes raster): son imágenes pixeladas, es decir que están formadas por un conjunto de puntos (píxeles) contenidos en una tabla. Cada uno de estos puntos tiene un valor o más que describe su color.

extensión .bmp

Es una estructura o fichero de datos que representa una rejilla rectangular de píxeles o puntos de color, denominada matriz, que se puede visualizar en un monitor, papel u otro dispositivo de representación

Windows Bitmap

E.R

Tipos de imágenesImágenes de mapas de bits

En una imagen en mapa de bits no se pueden cambiar sus dimensiones sin que la pérdida de calidad sea notoria. Esta desventaja contrasta con las posibilidades que ofrecen los gráficos vectoriales, que pueden adaptar su resolución fácilmente a la de cualquier dispositivo de visualización.

E.R

Tipos de imágenesImágenes vectoriales : las imágenes vectoriales son representaciones de entidades geométricas tales como círculos, rectángulos o segmentos. Están representadas por fórmulas matemáticas (un rectángulo está definido por dos puntos; un círculo, por un centro y un radio; una curva, por varios puntos y una ecuación). El procesador "traducirá" estas formas en información que la tarjeta gráfica pueda interpretar.

E.R

Tipos de imágenes

Imagen Original y su correspondiente imagen vectorizada

Comparación de las imágenes vectoriales con las de mapas de bits

E.R

Vectorizar imagenes● Segmentos de trazado, componentes y puntos

Un trazado se compone de uno o varios segmentos rectos o curvos. Los puntos de ancla marcan los puntos finales de los segmentos del trazado. En los segmentos curvos, cada punto de ancla seleccionado muestra una o dos líneas de dirección, que terminan en puntos de dirección. Las posiciones de las líneas y los puntos de dirección determinan el tamaño y la forma de un segmento curvo. Al mover estos elementos se cambia la forma de las curvas de un trazado.

E.R

Principales formatos de imágenes

Principales Formatos

.jpg

.gif

.bmp

.png

.ico

.art

.mng

.pdf

.ppm

E.R

Digitalización de imágenes

E.R

Digitalización de imágenes

Una IMAGEN DIGITAL es una foto electrónica tomada de una escena o escaneada de un documento: fotografías, manuscritos, textos impresos e ilustraciones. Se obtiene mediante la confección de un mapa de la imagen en forma de cuadricula de puntos, llamados pixeles,que definen los elementos de la figura. A cada píxel se le asigna un valor tonal (negro, blanco, matices de gris o color), el cual está representado en un código binario (ceros y unos). Este valor tonal para cada píxel esta definido por "bits", los cuales son almacenados por una computadora en una secuencia, y con frecuencia se los reduce a una representación matemática (comprimida). Luego la computadora interpreta y lee los bits para producir una versión analógica para su visualización o impresión.

E.R

Digitalización de imágenes

La resolucion: de una imagen digital es la capacidad de distribuir los detalles espaciales finos de una imagen digital,expresados por el dpi:dots-per-inch(puntos por pulgadas) o por pixel-per-inch(píxeles por pulgadas)

Tipo de resolucion deLa imagen.Mayor cantidad de píxelesMayor resolución

E.R

Digitalización de imágenesLas  DIMENSIONES  DE  PIXEL  son  las  medidas  horizontales  y  verticales de una imagen, expresadas en píxeles. Se pueden determinar multiplicando tanto el ancho como la altura por el dpi. Una cámara digital tendrá dimensiones de pixel,expresadas como la cantidad de píxeles en forma horizontal y vertical

Es muy sencillo conocer estas dimensiones sabiendo el tamaño de la imagen original y la resolución de escaneado, bastará multiplicarlas para obtener este valor. Por ejemplo, una imagen de 9x12 pulgadas escaneada a 300 ppi tendía unas dimensiones de pixel de 2.700x3.600, mientras que si se escanea a 100 ppi sus dimensiones serán 900x1.200.

Píxeles por pulgada (PPP), en inglés pixels per inch (PPI),

E.R

Herramienta para digitalizar imágenes● Lápiz Ópticos● Scaner● Cámaras digitales● Software de edición de imágenes● Tabletas digitales.

Digitalización de imágenes

E.R

Manejo de imágenes con Adobe Photoshop

E.R

Manejo de imágenes con Adobe PhotoshopCreación de fondos

Depende a que este destinado el fondo

Fondos web.Fondos de pantalla.Fondo de una imagen.

Cada fondo se debe trabajar dependiendo del tamaño en pixeles

E.R

Manejo de imágenes con Adobe Photoshop

Manejo de texto

En Adobe Photoshop, el texto se compone de contornos de texto basados en vectores: formas definidas matemáticamente que describen las letras, los números y los símbolos de un tipo de letra. Muchos tipos de letra están disponibles en varios formatos, siendo los más comunes Type 1 (llamado también fuentes PostScript), TrueType,OpenType, New CID y CID no protegido (sólo japonés).

E.R

Manejo de imágenes con Adobe Photoshop

Capas:

Las capas de Photoshop semejan hojas apiladas de acetato. Puede ver las capas que se encuentran debajo a través de las áreas transparentes de una capa. Si mueve una capa a fin de colocar el contenido en ella, es como si deslizara una hoja de acetato dentro de una pila. Además, si lo desea, tiene la posibilidad de cambiar la opacidad de alguna capa de manera que su contenido sea parcialmente transparente

E.R

Manejo de imágenes con Adobe Photoshop

Botones: 1.Cree un archivo nuevo con el fondo de color blanco

2.Sobre el dibujaremos la forma de nuestro botón, en este caso un botón alargado de forma horizontal para un menú web.

3.Seleccione la herramienta Rectángulo redondeado.

4.Introduzca el radio de calado que desee para las esquinas, en este caso 10 px y rellenelo del color que desee.

5.Nota: Si desea realizar el mismo del ejemplo, el color es: #A2C6A2

6.Seleccione la forma creada y cree una nueva capa (layer)

7.Sobre esta capa y con la forma seleccionada aplique un degradado de ángulo tomando colores de la gama del verde en distintas tonalidad para producir el efecto deseado.

E.R

Manejo de imágenes con Adobe Photoshop

Botones:

7.Para darle un efecto más vistoso, jugaremos con los efectos de la herramienta: situado en la capa donde tiene la forma, haga clic sobre los efectos de capa y juegue con ellos haciendo pruebas hasta conseguir el efecto que desee.

En el caso del ejemplo, le hemos aplicado:

8.Para añadir el texto del botón: seleccione la herramienta texto y haga clic sobre el botón. Introduzca el texto que irá en el botón y seleccione la tipográfica más adecuada.

Este es el resultado final del botón. Recuerde que puede variar formas y colores hasta conseguir modelos de gran originalidad.

E.R

Manejo de imágenes con Adobe Photoshop

Mejora y redimensionamiento de fotografías

La escala según el contenido redimensiona una imagen sin cambiar el contenido visual importante como personas,edificios, animales, etc. Al redimensionar una imagen, la escala a normal afecta a todos los píxeles por igual, mientras que la escala según el contenido afecta principalmente a los píxeles situados en las zonas con menor importancia visual. La escala según contenido permite aumentar o reducir la escala de una imagen para mejorar una composición, encajar un diseño o cambiar la orientación. Si desea utilizar algo de escala normal durante la redimensión de la imagen, existe una opción que permite especificar una relación entre la escala según el contenido y la escala normal.

E.R

Manejo de imágenes con Adobe Photoshop

Combinar de fotografías

Fusión de capas .Mascara de capas.