La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

Formati grafici Presentazione 1.6 Architettura dell'informazione | Prof. Luca A. Ludovico.

Presentazioni simili


Presentazione sul tema: "Formati grafici Presentazione 1.6 Architettura dell'informazione | Prof. Luca A. Ludovico."— Transcript della presentazione:

1 Formati grafici Presentazione 1.6 Architettura dell'informazione | Prof. Luca A. Ludovico

2 Scaletta della lezione Distinzione tra immagini vettoriali e bitmap Processi di digitalizzazione delle immagini Concetto di antialiasing Definizione dei principali parametri: –Risoluzione –Profondità di colore Esempi Architettura dell'informazione Prof. Luca A. Ludovico

3 Campagne di digitalizzazione Documento originale Scansione Oggetto digitale (o produzione diretta) Editing/restauro dell’oggetto digitale Argomento della lezione Architettura dell'informazione Prof. Luca A. Ludovico

4 Tipologie di immagini digitali Esistono due famiglie di immagini digitali: –immagini bitmap o raster rappresentate sul supporto digitale come una matrice di punti –immagini vettoriali rappresentate come funzioni vettoriali che descrivono curve e poligoni Nella lezione corrente, si darà una definizione intuitiva. Nella prossima lezione, si presenteranno proprietà ed esempi di formato Architettura dell'informazione Prof. Luca A. Ludovico

5 Immagini vettoriali Nel caso di figure geometriche relativamente semplici, invece di descrivere l’immagine punto per punto, conviene specificare: tipo, forma, colore, dimensione e posizione delle figure geometriche (cerchi, rettangoli, linee, frecce e così via) che le compongono. Esempio del quadrilatero: descrizione tramite quattro vertici, colore del contorno, spessore del contorno, colore di riempimento. Esempi: le immagini ClipArt di Microsoft Word (WMF), i font TrueType, … Architettura dell'informazione Prof. Luca A. Ludovico  ABCD 

6 Tra i vantaggi della descrizione vettoriale ricordiamo i seguenti: hanno un’occupazione ridotta di spazio su disco (invece della descrizione di tutti i punti basta specificare solo la posizione di pochi punti chiave e le equazioni per collegarli) si possono facilmente ridimensionare, rimpicciolendo ma anche ingrandendo, senza perdita di qualità è possibile modificare in modo indipendente ogni singolo elemento geometrico che compone l’immagine (vedi slide successiva) Immagini vettoriali Architettura dell'informazione Prof. Luca A. Ludovico

7 Variazione di colore, spostamento, ingrandimento, rotazione di singoli elementi grafici anche in un software non dedicato all’editing di immagini quale Microsoft Word Editing di immagini vettoriali Architettura dell'informazione Prof. Luca A. Ludovico

8 Immagini bitmap (o raster) Un’immagine digitale bitmap (o raster) è costituita da una matrice di punti detti pixel (contrazione di picture element), simili ai punti della retinatura nelle immagini a stampa Architettura dell'informazione Prof. Luca A. Ludovico

9 Digitalizzare = passare dal dominio analogico (mondo reale) a quello digitale (mondo elettronico/informatico) attraverso opportuni processi I processi di digitalizzazione non hanno luogo solo nel campo delle immagini statiche: si pensi ad esempio ai suoni e ai video Come si costruisce la matrice di pixel che definisce un’immagine bitmap a partire da un’immagine reale? Il processo di digitalizzazione Architettura dell'informazione Prof. Luca A. Ludovico

10 Un esempio di digitalizzazione (1) Architettura dell'informazione Prof. Luca A. Ludovico Consideriamo il semplice caso di un disegno in bianco e nero. Per estrarre la sequenza di bit che rappresenti tale disegno: Per prima cosa si divide il disegno in quadrati molto piccoli, chiamati pixel, sovrapponendo idealmente una griglia Ad ogni quadratino della griglia si attribuisce il colore nero se il contenuto di nero al suo interno supera quello del bianco, e viceversa il colore bianco se il contenuto del bianco al suo interno supera quello del nero (a destra un esempio molto grossolano)

11 La figura mostrata rappresenta la nuova immagine che si ottiene dopo aver portato a termine la precedente operazione A questo punto, a ogni quadratino o pixel della griglia si associa 0 se il suo contenuto è il bianco e 1 in caso contrario. In tal modo si ottiene una matrice di 0 e 1 che codifica l’immagine della lampadina in formato digitale Un esempio di digitalizzazione (2) Architettura dell'informazione Prof. Luca A. Ludovico

12 L’immagine di partenza, dopo questa operazione, si è dunque trasformata in una sorta di mappa composta di 0 e 1, ed infatti il nome tecnico che si usa per descrivere questa sequenza di bit è proprio bitmap Ovviamente, più fitta è la griglia che si sovrappone all’immagine e più la rappresentazione digitale risulterà fedele all’originale, inseguendone la forma con maggiore raffinatezza. Analogo discorso per i colori (nell’esempio ci siamo limitati al B/N). D’altra parte, una griglia più fitta implica un maggior numero di pixel, e una codifica più ricca dei colori un maggiore numero di bit per pixel. Di conseguenza l’occupazione su disco cresce in proporzione. Un esempio di digitalizzazione (3) Architettura dell'informazione Prof. Luca A. Ludovico

13 Avendo un’immagine di partenza a colori, anziché utilizzare solo un bit per pixel, è possibile utilizzare una combinazione di 0 e 1 in base a una tabella di codifica dei colori. La successiva tabella è ad esempio composta di 64 colori, e quindi ad ogni pixel si può assegnare un numero da 0 a 63 in binario che individuerà univocamente un colore della tabella stessa Per esprimere in binario numeri da 0 a 63 sono necessari sei bit, quindi a ogni pixel dell’immagine corrisponderà una combinazione di 6 bit che ne rappresenta il colore In generale, detto n il numero di bit da utilizzare e c il numero di colori rappresentabili usando n bit per pixel, si ha c = 2 n Un esempio di digitalizzazione (4) Architettura dell'informazione Prof. Luca A. Ludovico

14 Da 16 milioni di colori a B/N Architettura dell'informazione Prof. Luca A. Ludovico

15 L’antialiasing è un metodo per rappresentare immagini vettoriali continue su dispositivi di visualizzazione discreti, di modo che assomiglino il più possibile all’originale. Anche per immagini vettoriali, il monitor è comunque una matrice discontinua di punti! Antialiasing Architettura dell'informazione Prof. Luca A. Ludovico X10

16 Architettura dell'informazione Prof. Luca A. Ludovico Effetto dell’antialiasing su immagini e testi

17 Architettura dell'informazione Prof. Luca A. Ludovico Effetto dell’antialiasing nei videogame

18 Immagini bitmap: caratteristiche Ciascun punto rappresenta una porzione di immagine in un particolare colore (o tono di grigio) e viene codificato mediante uno o più bit Il numero di punti in una data area determina la risoluzione dell’immagine Il numero di colori (o di toni di grigio) che ciascun punto può assumere individua la profondità di colore Architettura dell'informazione Prof. Luca A. Ludovico

19 La risoluzione (e dunque la qualità del dettaglio) di un’immagine è tanto maggiore quanti più punti «coprono» una data area Si esprime in ragione del numero di pixel per unità di lunghezza verticale e orizzontale (tipicamente l’area è quadrata): –72 punti per pollice (DPI)> risoluzione standard per i monitor –300 punti per pollice (DPI)> risoluzione standard per la stampa –600 punti per pollice (DPI)> risoluzione alta per la stampa DPI = dot per inch PPI = pixel per inch 1 inch (pollice) = 2,54 cm La risoluzione Architettura dell'informazione Prof. Luca A. Ludovico

20 Esempio Architettura dell'informazione Prof. Luca A. Ludovico risoluzione 2k risoluzione k

21 Stampante (300 dpi) Monitor (72 dpi) 1200 / 72 = 16,67 16,67 volte maggiore della dimensione originale Scanner (1200 dpi) 1200 / 300 = 4 4 volte la dimensione originale oppure si ricampiona mantenendo dimensioni fisiche (perdita info) Architettura dell'informazione Prof. Luca A. Ludovico Esempio: cosa succede ai DPI?

22 La profondità di colore è determinata dal numero di bit utilizzato per rappresentare ciascun pixel –Un’immagine in bianco e nero associa a ciascun punto un solo bit –Un’immagine con 256 toni di colore o di grigio associa a ciascun pixel 8 bit (un byte) –Un’immagine a colori associa a ciascun pixel 16 bit –Un’immagine a 16 milioni di colori associa a ciascun pixel 24 o 32 bit E’ possibile fare un calcolo esatto dell’occupazione di spazio su disco date le dimensioni fisiche dell’immagine, la risoluzione e la profondità di colore? La profondità di colore Architettura dell'informazione Prof. Luca A. Ludovico

23 Le immagini digitali bitmap occupano tanto più spazio in memoria quanto più aumenta la loro qualità. Esempi: –un’immagine di un pollice quadrato a 72 dpi e 256 toni di grigio occupa 72x72x8 = 40 Kbit = 5 KByte (circa) –un’immagine di un pollice quadrato a 300 dpi e 16 mil. di colori occupa 300x300x24 = 2 Mbit = 270 KByte (circa) Attenzione: questo calcolo non è del tutto esatto 1.Una volta salvata in un formato grafico, è probabile che questo presenti qualche byte di intestazione (a meno che non si tratti di un formato RAW) 2.Molti formati prevedono compressione, con o senza perdita Occupazione di spazio in memoria Architettura dell'informazione Prof. Luca A. Ludovico

24 Alcuni formati prevedono forme di compressione, cioè di diminuzione dei bit/byte richiesti per la memorizzazione dell’immagine in memoria Gli algoritmi di compressione si dividono in due categorie (e non solo per le immagini) –Compressione senza perdita: la codifica avviene riducendo le aree di colore uguale in modo tale da poter ricostruire esattamente l’immagine originale; ha un rapporto medio di compressione di 2:1 –Compressione con perdita: la codifica avviene eliminando definitivamente alcune informazioni statisticamente meno rilevanti per la ricostruzione dell’immagine; permette rapporti di compressione fino a 100:1 La compressione delle immagini Architettura dell'informazione Prof. Luca A. Ludovico

25 La compressione delle immagini Originale in formato TIFF compresso senza perdita (circa 4 MB) Architettura dell'informazione Prof. Luca A. Ludovico

26 JPEG (media qualità) 345 KB JPEG (bassa qualità) 97 KB Architettura dell'informazione Prof. Luca A. Ludovico La compressione delle immagini

27 Originale in formato TIFF compresso senza perdita – circa 8 MB Architettura dell'informazione Prof. Luca A. Ludovico

28 La compressione delle immagini JPEG (alta qualità) – 2,7 MB Architettura dell'informazione Prof. Luca A. Ludovico

29 La compressione delle immagini JPEG (bassa qualità) – 407 KB

30 «Dimensioni» è un termine ambiguo, che si può riferire a: –Dimensioni dell’oggetto fisico (es.: in cm) –Dimensioni dell’oggetto digitale/digitalizzato (es.: in pixel) –Occupazione di memoria (es.: in KB) Quali sono le relazioni tra le diverse dimensioni? Le «dimensioni» delle immagini Architettura dell'informazione Prof. Luca A. Ludovico


Scaricare ppt "Formati grafici Presentazione 1.6 Architettura dell'informazione | Prof. Luca A. Ludovico."

Presentazioni simili


Annunci Google