Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre...

27
Introducció al tractament d’imatges

Transcript of Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre...

Page 1: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Introducció al tractament d’imatges

Page 2: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Objectius

• Repassar els conceptes bàsics.

• Conèixer el maquinari de captació, emmagatzematge i reproducció d’imatges.

• Identificar els diferents tipus de fitxers d’imatge.

• Conèixer i utilitzar alguns dels principals programes de reproducció i edició fotogràfica.

Page 3: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Conceptes bàsics

Page 4: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Conceptes bàsics

• Què es un píxel

• Resolució d’imatge

• Resolució de pantalla

• Diferències entre una imatge bitmap i una de vectorial

• Escollir el mode de color

Page 5: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Píxel

• Un píxel es la unitat més petita en la que es pot descompondre una imatge.

• A cada píxel li correspon un color.

• La unió dels diferents píxels de color ens donaran la imatge total.

Quan fem zoom podem veure la imatge cada vegada més “quadriculada". Això es degut a que al acostar-nos cada vegada més, anem veient els píxels des de més a prop.

Page 6: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Resolució d’imatge • Es la qualitat d’una imatge digital. El nombre de píxels per

polzada (ppp o ppi) que s’utilitzaran per representar-la. • Una fotografia de mida petita representada amb molts

píxels (resolució alta) imatge de bona qualitat. A més resolució, més detall per reproduir la imatge. Més

píxels per representar les transicions de color de manera més suau.

1polzada = 2,54cm

Page 7: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

A l’hora d’escollir la resolució d’una imatge, cal tenir en compte la finalitat que aquesta tindrà.

Per exemple, si volem imprimir s’aconsella un valor entre 240 i 300ppp. Si es per fer un logotip d’una web, un valor menor ja ens anirà bé.

No hem de confondre la resolució d’una imatge amb la resolució de pantalla (la quantitat de píxels que veurem en el monitor).

Resolució d’imatge

Page 8: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Relació entre la mida d’un píxel i resolució d’imatge • Un píxel no té una mida fixa en el món real. No utilitzem el píxels per mesurar una taula, un prestatge,

una cadira..

• La mida que tindrà el píxel en el món real dependrà de la resolució.

Per exemple al imprimir una fotografia,

• Recordem que la resolució ens diu quants píxels hi hauran en una polsada (2,54cm). Si observem la següent imatge:

Conclusió: Com més gran sigui la resolució, més píxels hi haurà i

aquests, per tant, seran més petits.

Page 9: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Exemple. Resolució d’imatge

Fotografia de 25 x 12,5cm == 10 x 5 polzades a) Resolució de 800 x 600 Imatge digital de 8000 x

3000píxels

b) Resolució més baixa 400 x 200 Imatge digital de 4000 x 1500 píxels

La imatge b serà més quadriculada (pixelada) ja que estem

utilitzant la meitat de píxels que en el cas a per a la mateixa fotografia i, per tant, aquests seran més grossos i es veuran més.

Les transicions de colors seran més brusques al disposar de

menys píxels per a la representació.

Page 10: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Resolució de pantalla

• Quantitat de píxels que el nostre monitor ens mostrarà.

• Ve determinada per:

La mida del monitor.

Com més polsades tingui el nostre monitor, més píxels d’alt i ample tindrem per representar la imatge.

La targeta gràfica que tinguem instal·lada.

• Les pantalles solen treballar amb resolucions de 72ppp.

Page 11: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Exemple. Resolució pantalla

Tenim una imatge de 800 x 600 píxels. La visualitzem... a) en un monitor de 17 polsades configurat a la mateixa

resolució de la fotografia (800 x 600) la pantalla s’omplirà completament amb la imatge, ja que mesura exactament el mateix que la resolució assignada al monitor.

b) en un monitor de 19" i a la mateixa resolució (800 x 600) s’omplirà completament.

c) en el mateix monitor de 19” a una resolució més alta 1280 x 960 píxels la imatge es veu dins de la pantalla del monitor però ja no l’ocupa sencera.

Conclusió: A major resolució de pantalla més elements es veuran.

Page 12: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Imatges bitmap i vectorials (1/3)

• Són les formes en que un ordinador pot pintar imatges o

gràfics.

• Les imatges bitmap esta formades per píxels i les vectorials a partir de descripcions matemàtiques: cercles, quadrats,segments, etc.

Vectorial Bitmap

Page 13: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Imatges bitmap i vectorials (2/3)

Bitmap • Formades per píxels.

• Cada píxel te una valor d’ubicació i color.

• Permeten representar ombres, colors i degradats.

• Són les més freqüents en digitalització de fotografies. .

Page 14: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Imatges bitmap i vectorials (3/3)

Imatges vectorials

• Formades per descripcions matemàtiques.

• No depenen de la resolució de la imatge.

No perden qualitat al ampliar-les.

S’adapten a qualssevol tipus de perifèric al que s’enviïn com ara la impressora.

S’utilitzen per tipografies, logotips, icones, etc.

• Ocupen poc espai a disc.

Page 15: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

• Es creen mitjançant aplicacions específiques, com ara:

Adobe Ilustrator.

Freehand.

Corel Draw.

• Aquest tipus d’arxius només poden visualitzar-se a través del programa que els va crear, sinò es transformen en imatges bitmap.

Page 16: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Exemple. Imatges vectorials

Imatge vectorial, abans i després d’augmentar-la un 200%.

Observem que la imatge no perd qualitat.

Page 17: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Modes de color (1/2)

Principals modes de color RGB (Red Green Blue).

Model de color additiu. La suma de colors dona blanc. Treballa amb tres canals, cada un de 8 bits/píxel (24 bits en total) Mateix mode que utilitzen les pantalles. Escollirem aquest mode quan treballem en pantalla, per exemple,

quan retoquem una imatge o editem vídeo. (Pantalla negra)

CMYK (Cyan, Magenta, Yellow, Key) Model de color sostractiu. La suma de colors dona negre. Treballa amb quatre canals de 8 bits (32 bits de profunditat de color) Escollirem aquest mode si volem imprimir. (Foli blanc)

Page 18: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

RGB CMYK

Model additiu:

Utilitza la llum que generen els leds

de la pantalla per mostrar el color.

Un focus vermell, un de verd i un de

blau.

Model sostractiu:

Utilitzen la llum reflexada sobre

les tintes per mostrar els colors.

Page 19: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Modes de color (2/2)

Altres modes de color (en desús) Monocromàtic

1bit per representar color. 2 colors: blanc i negre. No permet tons mitjos.

Escala de grisos

Un únic canal, el negre. 8 bits per representar el negre. Escala de grisos, 256 tonalitats.

Indexat

Un únic canal de color Cada píxel disposa de 8 bits per representar color (256colors diferents) Molt pobre, no s’utilitza.

Page 20: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge

Page 21: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (1/6)

• Relació resolució imatge - número de colors - mida fitxer A més resolució d’imatge, més píxels fitxers més grans. Com més gran sigui la paleta de colors, més gran serà cada píxel fitxers més

grans. (Profunditat de color o de píxel)

• Algoritmes de compressió Per tal de disminuir la mida dels fitxers d’imatge Hi ha 2 tipus de compressió:

• Amb pèrdues. Valorem més la mida del fitxer que la qualitat de la imatge.

• Sense pèrdues. Importa la qualitat de la imatge

1 píxel de 8 bits (256 colors) 1byte

1 píxel de 24 bits (16’7 milions de colors) 3bytes

Page 22: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (2/6)

• BMP Format nadiu de Microsoft Paint i que interactua

fàcilment amb Windows. De bona qualitat però que ocupen molt. No hi ha compressió.

• GIF Màxim 256 colors. Són recomanables per imatges amb grans àrees d’un

mateix color o tonalitats continues. Permet definir transparències i animacions (diferents

imatges en l’arxiu). Compressió sense pèrdues per a imatges de color

uniforme però amb pèrdues per la resta. S’utilitzen a Internet perquè ocupen poc.

Page 23: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (3/6)

• PNG Successor/Alternativa al GIF amb més colors però que

no permet animacions. Màxim 16 milions de colors. Compressió sense pèrdua, adient per editar imatges. S’utilitza en pàgines Web i edició d’imatges.

• JPEG

Màxim 16 milions de colors. Algoritmes de compressió més potents amb pèrdues i

sense, segons el grau de compressió que hi apliquem. Format que usen les càmeres digitals. S’utilitza per imprimir fotografia i web.

Page 24: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (4/6)

• TIFF

Format que admet diferents mètodes de compressió, però que no produeix pèrdua de qualitat d’imatge.

Permet guardar capes, canals i màscares.

S’utilitza per obtenir impressions de qualitat.

Page 25: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (5/6)

• PSD

Format propi de Photoshop.

Permet conservar tota la informació dels elements creats a la imatge.

Podem emmagatzemar les imatges amb el mode de color que desitgem (RGB, CMYK, indexat, etc.), amb les capes i canals inclosos.

• XCF

Format propi de GIMP.

Equival al PSD de Photoshop.

Page 26: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Formats d’imatge (6/6)

Segons l'ús que fem de les imatges, les desarem en un format o altre:

Web: Gif, Png, Jpeg

Imprimir: Tiff, Jpeg

Pantalla: Jpeg, Bmp, Pict

Page 27: Introducció al tractament d’imatges€¦ · •Es la qualitat d’una imatge digital. El nomre de píxels per polzada (ppp o ppi) que s’utilitzaran per representar-la. •Una

Exercici

Feu una captura de pantalla i enganxeu-la a Microsoft Paint. Guardeu en bmp i a continuació en jpeg.

Observeu quins canvis s’han produït i expliqueu-ne el motiu.

Feu el mateix en els diferents formats que ofereix.