Codifica di immagini, suoni, video

(1)

Viviana Patti Informatica di base - 11/11/04

La rappresentazione dell’informazione

Sui testi di approfondimento: leggere dal Cap. 2 del testo C (Console, Ribaudo): 2.3, 2.4

Parte II

La codifica dei dati multimediali

I caratteri alfanumerici non costituiscono le uniche informazioni utilizzate dagli elaboratori

Le applicazioni multimediali -> WEB utilizzano ed elaborano informazioni contenenti immagini,

suoni, filmati

(2)

Sommario

Rappresentazione delle immagini Rappresentazione dei suoni

Rappresentazione dei video

La codifica delle immagini

Esistono diverse tecniche usate per la

memorizzazione e l’elaborazione di

un’immagine

(3)

La codifica delle immagini

Cominciamo col considerare un’immagine in bianco e nero, senza alcuna ombreggiatura o livello di chiaroscuro

Suddividiamo l’immagine tramite una griglia formata da righe orizzontali e verticali a distanza costante -> tecnica dei disegnatori per riprodurre figure rispettandone le

proporzioni: rappresento ogni singolo quadratino separatamente, poi visualizzo il risultato d’insieme

La codifica delle immagini

-> si trae spunto da questa tecnica per la rappresentazione digitale di un’immagine; idea: memorizzare l’informazione relativa all’immagine quadratino per quadratino

Ogni quadratino prende il nome di PIXEL(picture element):

immagine = griglia di pixel.

ad ogni pixel viene fatto corrispondere un valore binario secondo una certa convenzione

Nella figura di esempio, dove dobbiamo rappresentare solamente due colori, la codifica avviene nel seguente modo:

– 0 viene utilizzato per per la codifica di un pixel

corrispondente a un quadratino in cui il bianco è il colore predominante

– 1 viene utilizzato per la codifica di un pixel corrispondente a un quadratino in cui il nero è il colore predominante

(4)

La codifica delle immagini

Per convenzione la griglia di pixel viene ordinata dal basso verso l’alto e da sx verso dx

Con questa convenzione otteniamo una

rappresentazione della figura di esempio di questo tipo:

…il che significa che l’immagine di partenza viene rappresentata dalla stringa binaria

La codifica delle immagini

Cosa succede se riconvertiamo la stringa

in un’immagine

sostituendo a ogni 1 un pixel nero e a ogni 0 un pixel bianco?

Quella che si ottiene nella codifica è un’approssimazione

(5)

La codifica delle immagini

DiGITALIZZAZIONE -> PERDITA di QUALITA’

Come si può migliorare la qualità? Esistono tecniche per

“ingannare l’occhio” e limitare l’effetto scalini della visualizzazione a pixel

La rappresentazione sarà più fedele aumentando il numero di pixel

Aumentando la granularità dell’immagine -> Aumento la qualità

10 x 9 29 x 28

La codifica delle immagini

Un’immagine digitale può essere caratterizzata mediante due dimensioni:

– Risoluzione:il numero di pixel che la costituiscono espressi in termini di larghezza per altezza

– Profondità: il numero di bit che vengono usati per rappresentare un singolo pixel dell’immagine

-> legata al numero di colori rappresentabili

Risoluzione: 10 x 9

1 bit per pixel Profondità = 1

2

¹

possibili combinazioni ->

2

¹

possibili diversi colori nell’immagine:

bianco e nero

(6)

Risoluzione

Lo stesso cerchio con risoluzioni diverse:

10×9 29×28

58 × 56

116 × 108

Gradazioni di grigio

Immagini a più colori: la logica è la stessa, per codificare diversi livelli di grigio con una rappresentazione binaria devo far corrispondere a ogni livello di grigio una certa sequenza di bit

Esempio:

– utilizzando 4 bit posso rappresentare 2⁴=16 livelli di grigio,

– con 8 bit ne posso distinguere 2⁸= 256

16 gradazioni di grigio

(7)

Colori

Lo stesso vale per quanto riguarda il colore

Individuareun certo numero di sfumature di colore differenti

Codificareogni sfumatura di colore mediante un’opportuna sequenza di bit

Come individuare le sfumature di colore? Esiste un modello di rappresentazione dei colori noto come RGB (Red, Green, Blu) secondo cui qualsiasi colore può essere rappresentato componendo Rosso Verde e Blu (colori primari)

Invece che di partire da tanti colori e di rappresentarne diverse sfumature, possiamo rappresentare molte

sfumature a partire dai 3 colori primari -> tutti i possibili colori ottenuti dalla loro combinazione

Colori

Questa l’idea alla base della cosiddetta codifica RGB A ogni pixel associo una certa combinazione dei 3 gradazioni dei colori primari

La gradazione per ogni colore primario è rappresentata mediante un certo numero di bit

Esempio:

– con 8 bit per colore primario ottengo 256 possibili gradazioni per colore primario ->

256 ×256 ×256 = 16.777.216 colori diversi (tutte le possibili combinazioni di tutte le possibili gradazioni di R, G e B)

– La codifica di 1 pixel richiede 3 byte! ->

Si parla di profondità (dell’immagine) a 24 bit

(8)

Colori

Esempio: la sfumatura di azzurro è determinata da una certa combinazione di R G B. Le sequenze di bit relative a ogni sfumatura di colore primario sono espresse in base decimale: 139 (R), 210 (G),216 (B). I tre numeri sono ovviamente compresi

fra 0 e 255.

Ogni sfumatura di colore primario è rappresentabile da 1 byte

139₁₀ => 10001011₂ 210₁₀ => 11010010₂ 216₁₀ => 10100111₂

Colori

Spesso la codifica è espressa in base esadecimale

Perché? La rappresentazione è più concisa, esprimo tutto con due caratteri alfanumerici per colore primario

139₁₀ = 8B₁₆ 210₁₀ = D2₁₆ 216₁₀ = D8₁₆

Codifica del colore:

8B D2 D8

(9)

Colori

Spesso la codifica è espressa in base esadecimale Esempio: quando si vuole specificare il colore di una pagina Web, lo si specifica in codice esadecimale

Alcune combinazioni da ricordare:

– 000000 = nero – FFFF FF= bianco – FF00 00 = rosso puro – 00 FF 00= verde puro – 00 00 FF = blu puro – FF FF 00 = giallo – FF00 FF = viola

Colori

(10)

La rappresentazione di un immagine tramite la codifica dei pixel, viene chiamata codifica bitmapo raster:

La dimensione di un’immagine bitmapsi calcola in base alla risoluzione e alla profondità:

Ricordiamo:

– Risoluzione:il numero di pixel che la costituiscono espressi in termini di larghezza per altezza -> mi dà la misura della granularitàdell'immagine

– Profondità: il numero di bit che vengono usati per rappresentare un singolo pixel dell’immagine -> mi dà la misura del numero di colori

Codifica bitmap

Numero di bit per immagine = risoluzione(numero di pixel che compongono l’immagine) × profondità(quanti bit per pixel)

Esempio RGB:

– per distinguere 16.777.216 colori sono necessari 24 bit per la codifica di ciascun pixel

– Prendiamo un’immagine formata da 640 × 480 pixel Quanti bit richiede?

Dimensione di un’immagine

24 × (640 × 480) = 7.372.800 bit (921.600 byte)

(11)

La codifica bitmap è estremamente costosa in termini di occupazione di spazio di memoria. Maggiore è la qualità (qualità fotografica), maggiore è lo spazio occupato

Web e tempi di trasmissione: è un problema in generale trasferire file di grandi dimensione -> non tutti si collegano a Internet attraverso linee ad alta velocità.

– Esempio: una bitmap con risoluzione 400 ×400 e

profondità 24 ha dimensione di circa 480 KB. Ci metterebbe circa 70 secondi a essere visualizzata per intero in una pagina web, data una connessione a Internet via modem telefonico, che consente una velocità massima di

scaricamento dei dati di 56kb per secondo Soluzione: tecniche di ottimizzazione

Ottimizzare= ridurre le immagini alle dimensioni più piccole possibili mantenendo la qualità dell’immagine a livelli

accettabili

Ottimizzazione

Formati di compressione

Esistono delle tecniche di compressione delle

informazioniche consentono di ridurre drasticamente lo spazio occupato da immagini e di ridurre il tempo di trasmissione

Compressione dei dati digitali in generale: vengono eliminati gli elementi ripetitividi un file

Le più famose tecniche di compressione di immagini:

– GIF: CompuServe Graphic Interface – JPEG: Joint Photographic Experts Group

– I file di immagine che usano queste codifiche riportano rispettivamente le estensioni .gif e .jpg (si parla di formatogif o jpg)

(12)

Formati di compressione

Codec (compression/decompression):

programmi che utilizzano una certa tecnica per – comprimere l’informazione prima di

memorizzarla e per

– decomprimerla prima di visualizzarla

GIF e JPEG sono due tecniche di compressione con filosofie diverse -> si può scegliere se usare l’una o l’altra a seconda delle

caratteristiche dell’immagine che si ha in partenza

Formati di compressione: gif

Il formato GIF riduce l’occupazione su disco di un’immagine limitando il numero di colori che compaiono in essa ->

vengono scelti quelli più frequenti, alcune sfumature vengono perse e sostituite dalle sfumature più vicine fra quelle mantenute

Naturalmente più si limita il numero di colori più l’immagine sarà piccola; il numero può andare da un minimo di 2 ad un massimo di 256.

L’insieme dei colori utilizzati viene salvato insieme all’immagine come palette di colori.

il formato GIF è adatto ad immagini geometriche, possibilmente con un numero di colori non elevato

(13)

Formati di compressione: jpg

• Il formato JPEG riduce l’occupazione su disco di un’immagine diminuendo la qualità di visualizzazione -> consente di usare tutta la gamma RGB.

• Mentre il formato GIF è adatto ad immagini geometriche, possibilmente con un numero di colori non elevato, il formato JPEG è adatto ad immagini di tipo fotografico, dove la perdita di qualità si nota di meno, o in generale ad immagini dove un limite sul numero di colori produrrebbe differenze troppo significative

Formati di compressione: jpg

• Se la compressione JPEG è alta si perde molto in termini di qualità dell'immagine, ma si riesce a diminuire di molto la dimensione del file.

• Se la compressione è bassa, le dimensioni aumentano.

• Spetta all’utente trovare il giusto compromesso tra qualità e dimensione, utilizzando programmi di fotoritocco o visualizzazione come p.e.

Photoshop o Fireworks

(14)

Formati di compressione e perdita di informazione

• In generale si possono classificare i formati di compressione di dati (immagini grafiche, suoni, video) usando come parametro la loro reversibilità.

• Lossless: una tecnica di compressione che permette di ricostruire esattamente i dati originari, ovvero per cui esiste un algoritmo di decompressione che mi consente di riottenere l’informazione di partenza (es.

un’immagine esattamente uguale – pixel per pixel – all'originale com'era prima che venisse compresso), viene normalmente definita lossless: senza perdita di informazione-> es. GIF

• Lossy: una tecnica di compressione che non può assicurare una reversibilità assoluta, viene definito lossy, con perdita di informazione-> es. JPEG

Palette: tavolozze dei colori

In molti casi non abbiamo bisogno di 16 milioni di colori contemporaneamente -> se però uso la codifica RGB normale l’immagine occupa lo stesso un sacco di spazio Idea: si può usare un sottoinsieme di colori (tavolozza) Si considera solo la tavolozza di colori (codificati in RGB) per la codifica dell’immagine

(15)

Palette: tavolozze dei colori

Ad esempio sono comuni palette a 256 colori, ossia con profondità di immagine a 8 bit (nella figura vedete la palette dei cosiddetti colori web safe)

La palette viene memorizzata insieme al resto dei dati relativi all’immagine

palette dei colori web safe

Codifica di immagine con Palette:

esempio

Dati:

– palette a 256 colori, ossia con profondità di immagine a 8 bit

– Immagine di prima con risoluzione 640 × 480 La codifica richiede:

– 2457600 bit (307200 byte) = 8 × (640 × 480) per l’immagine +

768 byte= 256 × 3 per la palette Totale: 307.968 byte

Usando la codifica RGB senza palette avevamo calcolato che avrei

24 × (640 × 480) = 7.372.800 bit (921.600 byte)

(16)

Esempio

Supponiamo di avere un immagine a 4 colori ->

profondità 2;

rappresentiamo l'immagine usando una codifica RGB con palette a 4 colori

3 ×2

indice del colore nella palette

Esempio

10 11 11 00 01 01

Dimensione: 6 × 2 (dimensione × profondità)+ (24 × 4) (palette: codifica RGB per i 4 colori)= 108 BIT

3 ×2

indice del colore

nella palette

(17)

Grafica vettoriale

Un oggetto grafico bitmapè memorizzato

semplicemente come una griglia di pixel a ciascuno dei quali è associato un colore. Una volta disegnata una linea, essa non è più una “linea” ma solo un insieme di pixel sullo schermo, pertanto non è più possibile modificarne le coordinate. Le manipolazioni che si possono fare su un oggetto bitmap si basano sul concetto di pixel -> colorare differentemente i pixel Photoshop è un programma specializzato nella manipolazione di bitmap

Esiste un altro tipo di approccio alla rappresentazione delle immagini -> grafica vettoriale

Grafica vettoriale

Un oggetto vettorialeè costituito da una sequenza di segmenti, che vengono memorizzati registrando le coordinate delle estremità di ciascun segmento.

Tali segmenti possono essere dritti o curvi, e possono essere uniti a formare una linea spezzata, aperta o chiusa.

Un oggetto vettoriale ha inoltre degli attributi, come ad esempio il colore e lo spessore della linea, il

riempimento se si tratta di una figura chiusa (ad es. un rettangolo), etc. Gli attributi sono memorizzati separatamente dalle coordinate, per cui una volta creato l’oggetto è possibile modificare le coordinate La grafica vettoriale è molto usata dai grafici professionisti, e esistono molti altri prodotti che la

(18)

Grafica vettoriale

Un programma che gestisce grafica

vettoriale dovrà prima leggere le coordinate e le informazioni sugli attributi, poi

riprodurre pixel per pixel le curve Meno occupazione di memoria Zoom senza perdita di qualità

ma

Più elaborazione per la riproduzione

(19)

Sommario

Rappresentazione delle immagini Rappresentazione dei suoni

Rappresentazione dei video

Codifica dei suoni

Anche i suoni possono essere rappresentati in forma digitale

Dal punto di vista fisico un suono è

un'alterazione della pressione dell'aria che, quando rilevata dall'orecchio umano, viene trasformata in un particolare stimolo al cervello

La durata, l'intensità e la variazione nel

tempo della pressione dell'aria sono le

quantità fisiche che rendono un suono

diverso da ogni altro

(20)

Codifica dei suoni

Un suono può essere rappresentato mediante un’onda che descrive la variazione della pressione dell'aria nel tempo -> onda sonora Sull'asse delle ascisseviene rappresentato il tempo e sull'asse delle ordinate viene rappresentata la pressionecorrispondente al suono stesso.

Codifica dei suoni

Come nel caso delle immagini avevo bisogno di una tecnica di discretizzazione, analogamente nel caso dei suoni ho bisogno di una tecnica che mi permetta di passare dalla rappresentazione fisica continua dell’onda sonora a una rappresentazione digitale discreta

Intuitivamente: sarebbe difficile e inefficiente memorizzare l’informazione completa sull’onda -> come nel caso delle immagini devo perdere in qualità dell’informazioneper

(21)

Codifica dei suoni

La conversione di un segnale continuo in una successione di numeri viene eseguita con due successive operazioni elementari:

1. Campionamenti sull’onda: si preleva una successione di campioni a intervalli costanti di tempo (in altre parole: si misura il valore dell’onda a intervalli di tempo costante) 2. Quantizzazione e codifica: ogni campione viene

quantizzato ossia convertito in un numero; la sequenza dei valori numerici ottenuta dai campioni può essere facilmente codificata in forma digitale-> associo una configurazione di bit a ogni campione

Codifica dei suoni

Quanto più frequentementeil valore di intensità dell'onda viene campionato, tanto più precisa sarà la rappresentazione dell'onda

Teoria dei segnali: il segnale può essere riprodotto perfettamente sulla base dei valori campione a certe

condizioni sulla frequenza di campionamento = n. di campioni al secondo, misurabile in Herz; (intuitivamente:

campionamento abbastanza frequente)

Osservazione:Un errore viene comunque introdotto quando si converte il valore analogico di un campionein un numero con un numero limitato di cifre -> la codifica digitale introduce

(22)

Codifica dei suoni

Esempio di un CD musicale: si mescolano due registrazioni (stereofonia= 2 sorgenti di audio);

44.100 campioni al secondo per ogni registrazione;

16 bit per memorizzare l’informazione su ogni campione.

Quindi servono:

44.100 campioni × 16 bit × 2 = 1.411.200 bit

per ogni secondo di registrazione.

Osservazione

Per calcolare lo spazio occupato da un file di testo, da un’immagine, da un file audio, la tecnica è sempre la stessa

– Si trova lo spazio (bit) occupato da ogni unità elementare costituente il file (un carattere per il testo, un pixel per l’immagine, un campione per il file audio)

– Si trova il numero di unità elementari che

costituiscono il file (il numero di caratteri per il testo, il numero di pixel per l’immagine -sfruttando la risoluzione, il numero di campioni per il file audio - sfruttando la frequenza di campionamento)

– Si moltiplicano queste due quantità

(23)

Formati audio

formato non compresso WAVE -> .wav

MPEG3 (mp3): il formato compresso con perdita di informazioni -> .mp3

– formato specializzato per la compressione e la trasmissione di file audio digitali.

– garantisce una fedeltà molto alta(praticamente indistinguibile dal suono non compresso)

– Efficienza e grande diffusione: la dimensione del file ottenuto è molto inferiore di quella originale (anche un un decimo o meno), permette di trasmettere file audio anche con connessioni via modem telefonico di 56 kb per secondo

MP3 streaming

MP3 streaming:

– compressione dell’audio da parte della sorgente audio (per esempio una radio su web)

– Il dato audio compresso viene trasmesso a un destinatario (per es. il mio PC)

– Il mio PC possiede il programma codec per la decodifica del dato e io sento il suono real time (man mano che viene trasmesso alla radio) Requisiti: macchina potente, connessioni veloci

(24)

Sommario

Rappresentazione delle immagini Rappresentazione dei suoni

Rappresentazione dei video

Codifica di filmati video

Filmato= sequenza di immagini statiche(detti fotogrammi o frame) che, in sequenza veloce, danno la sensazione del movimento.

La velocità di riproduzione dei fotogrammi è detta frame rate= velocità per fotogramma. Per rendere la sensazione del movimento, occorrono almeno 24 fotogrammi per ogni secondo -> 24 fps.

Fotogrammi:

istantanee successive

di una scena. Sequenza veloce di fotogrammi che dà la sensazione del

(25)

Codifica di filmati video

Cosa codifico in digitale: dati audio + dati video (sincronizzazione)

Sarebbe altamente inefficiente codificare completamente ogni frame

– Codifica differenziale (compressione):

• Alcuni frame chiave vengono codificati interamente, altri solo nelle parti che differiscono da quelle adiacenti

• Esempio del presentatore di un telegiornale

• Standard di compressione differenziale più importante: MPEG

Codifica di filmati video: MPEG

MPEG (Movie Picture Experts Group)

Estensioni che indicano questo tipo di file: .mpg Opera una compressione sia spaziale (all’interno del singolo fotogramma) sia temporale (sfrutta

componenti comuni fra fotogrammi successivi per effettuare compressioni su un’intera scena)

Esistono 3 diversi standard appartenenti a questo gruppo:

– MPEG-1, MPEG-2, M-PEG4

Esempio: i DVD usano una variazione dello standard MPEG-2 per comprimere dati audio-video

(26)

Codifica di filmati video: altri formati

Quicktime (Apple) Avi (Microsoft)

Real Video: molto usato in applicazioni di streaming video per la fruizione in tempo reale di un video-> i pacchetti audio-video che rappresentano un filmato vengono

trasmessi continuamente l’uno dopo l’altro e vengono visualizzati man mano che arrivano nell’ordine; poi vengono buttati via

streaming video versus classico download, dove è necessario attendere lo scaricamento completo di un file prima di poter vedere il video

Cosa posso memorizzare in 1MB?

8 milioni di bit (~1MB)

(27)

Informazione e codifica

codifica

010010011…

informazione

decodifica

Indipendentemente dall’informazione di partenza si ottiene sempre una sequenza di bit!