• Save
Lezione Grafica
Upcoming SlideShare
Loading in...5
×
 

Lezione Grafica

on

  • 4,170 views

 

Statistics

Views

Total Views
4,170
Views on SlideShare
4,141
Embed Views
29

Actions

Likes
3
Downloads
0
Comments
0

3 Embeds 29

http://math.unipa.it 15
http://www.math.unipa.it 7
http://www.slideshare.net 7

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Lezione Grafica Lezione Grafica Presentation Transcript

  • Sappiamo rappresentare in formato digitale testi scritti e numeri. Ma come la mettiamo con le immagini e i suoni?
  • In questo caso la situazione sembra del tutto diversa. Il testo scritto è costruito combinando tra loro unità discrete (i singoli caratteri) scelte all’interno di un alfabeto limitato. Ma immagini e suoni sono fenomeni che sembrano analogici, nei quali, cioè abbiamo a che fare con sfumature continue (di colori, di tonalità, di frequenze, …)
  • Se si ha a che fare con un numero finito, prefissato e non troppo grande di entità discrete, la codifica numerica è facile: basta contare le diverse entità discrete che possono presentarsi, e attribuire a ciascuna un numero che la rappresenti nella codifica. Ma come la mettiamo con le innumerevoli differenze e sfumature di un’immagine o un suono?
  • Le immagini
  • Immagini Cifre binarie Impulsi elettrici OK ?
  • Caratteristiche e rappresentazione delle immagini Le immagini sono gli elementi grafici presi direttamente dal mondo esterno mediante la macchina fotografica digitale e lo scanner . Esse, rispetto ai disegni creati per mezzo di software specifici, presentano la caratteristica di avere un numero di colori e di tonalità nettamente superiore.
  • La digit alizzazione è il meccanismo di trasformazione delle immagini in forma numerica o digit ale. La digitalizzazione Ogni immagine viene ripresa dallo scanner e dalla macchina fotografica digitale mediante un procedimento chiamato cam- pionamento. Esso consiste nella 1) scomposizione dell’immagine in tanti piccoli punti, 2) lettura e memorizzazione del colore di ognuno di essi. Più questi punti sono numerosi e migliore è la qualità dell’im- magine ottenuta.
  • Un’immagine digitale è una funzione definita su un sottospazio finito R, detto retina digitale, dello spazio discreto binario Z 2 . Quando R è un reticolo rettangolare, le immagini possono essere viste come matrici a 2 dimensioni i cui elementi sono detti pixel ( pict ure el ements). Nell’immagine vista alla sua grandezza normale, i pixel appaiono fusi in toni continui, ma, ingrandendo una piccola parte dell’immagine, si possono distinguere chiaramente i pixel che la costituiscono. Questo tipo di rappresentazione è molto simile a quello che si ha nei mosaici.
  •  
  • La rappresentazione delle immagini
    • Per scomporre un’immagine in pixel, possiamo pensare di sovrapporre all’immagine una griglia con quadrati tutti della stessa dimensione ( retina digitale ).
    • Possiamo quindi colorare ogni quadratino della griglia con il colore maggiormente diffuso al suo interno.
    • Diminuendo la dimensione dei pixel aumenta la definizione dell’immagine.
    • Se ad ogni pixel associamo un numero corrispondente al colore, otteniamo una tabella, detta matrice di rappresentazione dell’immagine .
    • Ogni pixel della retina digitale corrisponde ad un elemento (entrata) della matrice.
    • La matrice avrà la stessa dimensione, in righe e colonne, dell’immagine che rappresenta.
    • Si chiama dimensione dell’immagine il numero di colonne dell’immagine moltiplicato per il numero delle righe. Quindi un’immagine di dimensione nxm ha n colonne ed m righe.
  • La rappresentazione delle immagini in bianco e nero
    • Se consideriamo l’immagine digitalizzata di dimensione 10x15, associando il valore 0 al colore bianco e il valore 1 al colore nero, otteniamo la seguente matrice di rappresentazione di dimensione 10x15.
    • Per rappresentare 0 o 1 è necessario un bit.
    • Un’immagine in bianco e nero di dimensione nxm occupa nxm bit. Ossia ( nxm/8) byte di memoria.
    • Si chiama profondità di colore di un’immagine il numero di bit necessari per memorizzare il colore di un pixel, ossia la lunghezza del numero binario che rappresenta ogni colore dell’immagine.
    • Quindi la profondità di colore di un’immagine in bianco e nero è di un bit.
  • E per immagini a più livelli di grigio?
  • Per la rappresentazione in forma digitale di immagini con varie tonalità di grigio, bisogna associare un numero ad ognuna delle tonalità presenti. Così, per esempio, in una scala con 256 diverse gradazioni di grigio, al bianco si può far corrispondere il numero 0, ad un grigio molto chiaro il numero 1, ad un grigio leggermente più scuro il numero 2 e così via fino al 255, cui si può far corrispondere il nero.
  • 2 colori 256 colori
    • Il colore associato ad ogni cella della retina (pixel) è la tonalità media di grigio presente nella cella.
    • Per rappresentare le 256 gradazioni di grigio sono necessari 8 bit (infatti 2 8 =256) ossia un byte.
    • Quindi la profondità di colore delle immagini a scala di grigi è di 8 bit.
    • Inoltre un’immagine a scala di grigi di dimensione nxm occupa nxm byte di memoria.
    • Un’immagine a scala di grigi è più definita di un’immagine in bianco e nero, tuttavia, come sempre, aumentando la qualità aumenta anche lo spazio occupato in memoria.
  • Le immagini a colori Un’immagine a colori richiede più informazioni di una in bianco e nero o a livelli di grigio. L’informazione sarà tanto maggiore quanto maggiore è il numero di colori (sfumature) possibili.
    • Se dobbiamo rappresentare un’immagine a colori bisogna associare ad ogni pixel un colore.
    • Possiamo ripetere quanto detto per la rappresentazione a scala di grigio e associare ad ogni colore un numero distinto partendo dallo 0 (bianco) fino a 255 (nero). L’insieme dei colori così codificati si chiama palette .
    • Quindi ad ogni punto dell’immagine sarà associato un numero intero compreso tra 0 e 255.
    • Anche in questo caso per rappresentare i 256 colori sono necessari 8 bit (infatti 2 8 =256), ossia un byte.
    • Pertanto un’immagine a 256 colori di dimensione nxm occupa nxm byte di memoria e la profondità di colore delle immagini a 256 colori è di 8 bit.
    • Tuttavia l’occhio umano riesce a distinguere molto più di 256 colori distinti, quindi un’immagine rappresentata con soli 256 colori non è molto fedele alla realtà.
    • Per aumentare il numero dei colori rappresentabili possiamo operare in maniera diversa.
    • Sappiamo che qualsiasi colore è la sintesi (additiva) di tre colori additivi fondamentali: rosso, verde e blu ( Red, Green, Blu - RGB ), quindi per determinare il colore di un pixel possiamo codificare l’intensità di ognuno di questi colori fondamentali presenti nel singolo pixel.
  • La sintesi additiva dei colori è quella usata dall'oc- chio umano e da molti dispositivi che imitano l'oc- chio umano, come le fotocamere digitali, le tele- camere e i monitor, che sintetizzano i colori affian- cando punti colorati diversamente. In pratica una immagine è scomposta in pixel alternativamente rossi, verdi, blu. Si ha sintesi additiva anche quan- do si sovrappongono le luci pro- venienti da diversi fari, come av- viene a teatro. Dithering
  • Perché Rosso, Verde, Blu? L'occhio umano è in grado di distinguere i colori grazie ai coni che sono di tre tipi: il primo sensibile soprattutto alla luce rossa, il secondo alla luce verde, il terzo alla luce blu.
    • Abbiamo detto che ogni punto dell’immagine deve essere composto da tre pixel (uno rosso, uno verde e uno blu), e ognuno di questi pixel avrà una propria intensità di colore.
    • Il colore reale del punto dell’immagine sarà dato dalla somma delle tre intensità.
    • Quindi ad ogni punto dell’immagine si deve associare una terna di numeri interi che vanno da 0 a 255, di cui il primo rappresenta l’intensità del rosso, il secondo rappresenta l’intensità del verde e il terzo quella del blu.
    • In alternativa possiamo rappresentare l’immagine utilizzando tre matrici distinte.
    • La prima matrice conterrà le intensità del rosso, la seconda conterrà le intensità del verde e la terza quelle del blu.
    • In ogni caso lo spazio necessario per memorizzare l’immagine triplica rispetto alla stessa immagine rappresentata con 256 colori.
    • Ancora una volta la qualità è direttamente proporzionale allo spazio occupato in memoria.
    • Poiché per codificare ogni colore primario (R-G-B) è necessario un byte, per codificare un qualsiasi colore sono necessari 3 byte, ossia 24 bit ( true color ).
    • Pertanto la profondità di colore di un’immagine RGB è di 24 bit.
    • Con la rappresentazione RGB riusciamo a riprodurre 2 24 =16.777.216 diverse sfumature di colore che sono molte di più di quanto l’occhio umano riesce a distinguere.
  • Ritornando alla palette…
  • Numero colori Bit per pixel Un'immagine 800x600 richiede bytes 16 4 240.000 256 8 480.000 65.536 16 960.000 16.777.216 24 1.440.000 Esempi True Color
  • La qualità delle immagini Ogni immagine digitalizzata ha caratteristiche che la possono rendere più o meno fedele all’originale da cui è stata presa. Queste qualità dipendono principalmente da due fattori: la risoluzione e il numero dei colori che può assumere un singolo pixel dell’immagine. La risoluzione indica la nitidezza dell’immagine e quindi la possibilità di distinguere i suoi particolari più piccoli. La grandezza che misura la risoluzione è detta dpi o ppi ( d ots p er i nch o p ixels p er i nch, 1 inch = 2,54 cm.). Un campionamento fatto con un numero elevato di dpi consente di ottenere immagini ad alta risoluzione, molto nitide. La risoluzione è determinata dalle dimensioni dei pixel o il numero di pixel lungo l’immagine.
  •  
  •  
  •  
  •  
  • L’altro elemento che influenza la qualità dell’immagine è il numero dei colori che può assumere ogni singolo pixel: più è alto il loro numero e più fedele sarà la riproduzione dell’immagine. Infatti ci si rende facilmente conto che, se si hanno pochi colori, c’è più difficoltà a rappresentare tutte le innumerevoli sfumature e tonalità presenti in ogni immagine presa dal mondo reale.
  • 16,8 milioni di colori  24 bit = 3byte 688 KB 24 bit = 8 bit per ognuno dei 3 colori fondamentali
  • 256 colori  8 bit 123 KB
  • La quantità di memoria necessaria
    • La quantità di memoria occupata dalle immagini è determinata da vari elementi.
    • Innanzitutto le dimensioni dell’immagine . È chiaro che più queste sono grandi e più alto sarà il numero di punti necessari per la rappresentazione in forma digitale. Di conseguenza crescerà la quantità di memoria da utilizzare per contenere le informazioni relative al colore di ogni suo punto.
  • La quantità di memoria necessaria
    • Un altro importante elemento è la risoluzione . Quanto più questa è alta, tanto maggiore sarà il numero dei punti letti dallo scanner o dalla macchina fotografica digitale.
    • Le informazioni relative a questi punti dovranno poi essere memorizzate. Così, a parità di dimensioni, un’immagine con una risoluzione più alta occuperà più memoria.
    • Infine l’ultimo elemento da prendere in considerazione è il numero dei colori disponibili per la rappresentazione di un’immagine o un disegno: più questo numero è alto e maggiore sarà la quantità di memoria occupata.
  • 2 colori  11·10 bit = 110 bit 256 colori  11·10 ·8 bit = 880 bit
  • Dimensione del file Risoluzione Profondità del colore Dimensione dell’immagine
  • Come ridurre la quantità di memoria?
    • Ridurre il numero di colori,
    • diminuire la risoluzione,
    • diminuire la dimensione,
    • comprimere il file ...
  • I disegni bitmap vettoriale Un’immagine è una matrice di pixel di vari colori Le immagini vengono memorizzate me-diante un insieme di oggetti grafici, co-me linee, rettangoli, ellissi, archi e curve, chiamati primitive . Questi elementi ven-gono memorizzati come coordinate nu-meriche o formule matematiche specifi-cando la loro forma e posizione nell’immagine.
  • I disegni bitmap I disegni vengono memorizzati mediante successioni di cifre binarie alle quali corrisponde il colore di ognuno dei punti che formano il disegno ( Bit map ping). In questo caso, i singoli elementi che compongono il disegno, man mano che vengono costruiti e messi nella posizione voluta, diventano un tutt’uno con gli altri già presenti. Per questo motivo è difficile fare modifiche su singoli elementi senza alterare gli altri che sono a contatto con essi .
  • La grafica vettoriale
    • I disegni vengono riprodotti a schermo o sulla carta con un procedimento simile a quello dei disegni bitmap.
    • La loro rappresentazione in memoria e la loro creazione seguono però criteri del tutto diversi. In questo caso, infatti, non vengono memorizzate le informazioni relative al colore di tutti i punti presenti, ma alcune informazioni in base alle quali il programma riesce a effettuare la ricostruzione di ognuno degli elementi che compongono il disegno.
  • bitmap vettoriale Il programma deve memorizzare, uno a uno, i colori di tutti i punti che formano il disegno, compre- si quelli dello sfondo. Sono sufficienti: 1) le coordinate cartesiane del punto iniziale del segmento, 2) quelle del punto finale, 3) lo spessore della linea, 4) il colore della linea.
  • bitmap vettoriale Segmento (1,5) (5,1), spessore 1, colore 1
  • bitmap vettoriale La quantità di memoria occupa- ta dipende solo dalle dimensio - ni , dalla risoluzione e dal nume - ro di colori . La quantità di memoria occupata è indipendente dalla complessità del disegno. La quantità di memoria occupa- ta dipende dal numero di elementi che compongono il disegno. Meno il disegno è complesso  meno memoria occupa. I singoli elementi che compon-gono il disegno si fondono e formano un’unica struttura. Risulta difficile modificare solo alcuni elementi. I singoli elementi che compon-gono il disegno, anche se messi a contatto non si fondono. Se si vogliono fare delle modifiche è possibile selezionare e modificare gli elementi che interessano.
  • bitmap vettoriale
  •  
  • Quindi...
    • I programmi di grafica vettoriale permettono:
      • un controllo più accurato delle linee e dei colori;
      • la possibilità di ruotare gli oggetti per vederli da diverse angolature e prospettive;
      • la possibilità di ridurre o ingrandire un oggetto secondo le esigenze;
      • la possibilità di stampare sempre le immagini alla migliore risoluzione, indipendentemente dalle loro dimensioni;
      • la possibilità di modificare facilmente le combinazioni di colori e le sfumature di colore.
    • La Grafica Bitmap , però, si presta meglio alla visualizzazione su video in quanto lo stesso monitor è formato da una griglia, mentre la Grafica Vettoriale per essere visualizzata o stampata deve passare necessariamente attraverso un processo di Rasterizzazione
  • I dispositivi di input e di output delle immagini
  • I dispositivi di input delle immagini
    • I principali dispositivi di input delle immagini sono:
      • Lo scanner
      • La fotocamera digitale
      • La videocamera digitale
    • La risoluzione ottica dei dispositivi di input è il numero di punti con cui viene acquisita un’immagine e coincide con il numero di sensori ottici del dispositivo.
  • La risoluzione dei dispositivi di input
    • La risoluzione di uno scanner si misura in dpi ( dot per inch ) e coincide con il numero massimo di pixel con cui lo scanner può acquisire l’unità di superficie dell’immagine.
    • La risoluzione di una fotocamera o di una videocamera si misura in megapixel ( milioni di pixel ) e coincide con il numero massimo di pixel con cui la fotocamera può acquisire un’immagine.
    • L’ interpolazione è un procedimento software col quale il computer inserisce opportuni pixel nell’immagine per conferirle una risoluzione maggiore di quella reale, al fine di aumentarne la definizione.
  • I dispositivi di output delle immagini
    • I principali dispositivi di output delle immagini sono:
      • Il monitor
      • La stampante
    • La risoluzione ottica dei dispositivi di output è il numero di punti con cui viene visualizzata un’immagine.
    • La profondità di colore dei dispositivi di output è il numero di colori riproducibili dal dispositivo.
  • Il monitor
    • Il monitor si basa sulla sintesi additiva dei colori.
    • Il monitor è formato da tanti punti colorati dei tre colori fondamentali (RGB) che si illuminano opportunamente per generare il colore desiderato.
    • Ogni pixel dell’immagine è formato da tre punti di tre colori diversi (rosso, verde e blu) che possono essere illuminati con varie intensità.
    pixel
    • La risoluzione ottica del monitor è di 72 dpi (ossia visualizza 72 pixel in un pollice quadrato).
    • La dimensione dell’immagine visualizzata dipende dalla risoluzione del monitor e dalla dimensione dei punti del monitor.
    • La dimensione dei punti del monitor si chiama dot pitch e rappresenta la distanza tra i centri di due pixel successivi. Il dot pitch medio dei monitor è di 0,26 mm.
    dot pitch
    • I principali standard di risoluzione sono:
      • VGA (Video Graphics Array): 640x480
      • SVGA (Super VGA): 800x600
      • XGA (Extended Graphics Array): 1024x768
      • WXGA (Wide XGA): 1280x800
      • SXGA (Super XGA): 1280x1024
      • UXGA (Ultra XGA): 1600x1200
    • Aumentando la risoluzione diminuisce la dimensione dei pixel, quindi si deve aumentare la dimensione del monitor per evitare l’eccessivo rimpicciolimento delle immagini.
  • La stampante
    • La stampante si basa sulla sintesi sottrattiva dei colori.
    • I tre colori sottrattivi fondamentali sono: il ciano , il magenta e il giallo (Cyan, Magenta, Yellow – CMY ). Ad essi si aggiunge il Blac K , da cui la sigla CMYK.
    • Qualsiasi colore si può ottenere sovrapponendo punti di due o più colori sottrattivi fondamentali.
    • Le varie tonalità di colore si ottengono variando la dimensione o l’intensità dei punti dei colori fondamentali.
  • La sintesi sottrattiva dei colori
    • La sintesi sottrattiva dei colori si ha ogni volta che si ottengono colori per sovrapposizione di colori solidi .
    • Il bianco si ottiene dal colore della carta lasciando i punti non colorati.
    • Le varie tonalità di uno stesso colore si ottengono lasciando dei punti bianchi (non stampati) attraverso tecniche di diffusione dei punti chiamate dithering .
    • La risoluzione di una stampante si misura in dpi e indica il numero di punti che riesce a stampare in un pollice quadrato (2,54 cm 2 )
  • Alcuni formati di file bitmap
    • BMP : è un formato standard non compresso per i sistemi operativi Windows di Microsoft e OS/2 dell’IBM. Può visualizzare fino a 16.8 milioni di colori diversi (24 bit per pixel). Ciò che gli ha dato successo è stato il suo modo di associare il colore ad ogni pixel. Infatti ogni file bitmap contiene una palette di colori indicizzati e così il colore di ogni singolo pixel può essere definito memorizzando il suo numero-indice nella palette. Estensione: .bmp
    • PCX : è un formato largamente utilizzato con i programmi di tipo paint e di editoria elettronica. Anche questo può avere fino a 16.8 milioni di colori. Estensione: .pcx
    • TIFF (T agged I mage F ile F ormat ) : offre le immagini di qualità più alta e può visualizzare 16.8 milioni di colori. L’unico svantaggio è che le dimensioni dei file sono molto grandi. Estensione: .tif, .tiff
    • GIF (G raphic I nterchange F ormat ) : può visualizzare fino a 256 colori diversi (8 bit per pixel). È molto diffuso nel WEB perché essendo un formato compresso consente di trasferire i file più velocemente di altri formati. Supporta animazioni. Il successo di questo formato è dovuto alla combinazione vincente dell’indicizzazione della palette e della compressione lossless LZW. Con i file GIF, il dizionario LZW può essere automaticamente inizializzato con 256 simboli. Le GIF possono essere compresse fino al 40% e oltre.
    • Oltre alle dimensioni minime dei file, questo formato permette di visualizzare le immagini in un effetto veneziana, il che consente di interpretare l’intera immagine anche solo dopo che il 50% di essa sia stato scaricato.
    • Ma nel Dicembre 1994 intervennero dei problemi di licenza per l’uso di LZW e nacque un formato del tutto simile a GIF, il PNG (portable Network Graphics). Estensione: .gif
    • Per approfondimenti sul formato gif guardare la
    • presentazione LZW e GIF
    • JPEG (J oint P icture E xperts G roup ) : può avere fino a 16.8 milioni di colori. Ciò che rende JPEG totalmente diverso è l’uso di un algoritmo di compressione lossy. Il trucco è di rendere la perdita dovuta alla compressione il più impercettibile possibile. Ciò avviene in 5 fasi di cui le più importanti sono:
    • 1) l’immagine viene suddivisa in frammenti 8x8 che sono trasformati mediante un Discrete Cosine Transformation (DCT) in un’equazione matematica che rappresenta i valori essenziali di luminosità e colore;
    • 2) i coefficienti ottenuti mediante le trasformazioni effettuate sull’immagine vengono compressi tramite la codifica lossless di Huffman.
    • Il risultato finale è un tasso di compressione fino a 25:1 con una perdita impercettibile di qualità. Estensione: .jpg, .jpeg
    • JPEG 2000 : è un nuovo standard di compressione, per immagini true color. La sua capacità è quella di ridurre ulteriormente la dimensione dei file compressi rispetto a quanto farebbe JPEG. Utilizza per la compressione una tecnica matematica chiamata wavelets. Estensione: .j2k o .jp2
  • Alcuni formati di grafica vettoriale
    • Postscript : PostScript è un linguaggio di programmazione specializzato per la computer grafica vettoriale (ma può trattare anche grafica bitmap). Essendo PostScript un linguaggio, un file PostScript è un file di testo che contiene un programma (dati e istruzioni) che viene eseguito su un processore collegato con (o incorporato in) una stampante. Estensione: .ps
    • Encapsulated Postscript : è un programma PostScript formattato in modo particolare. Può contenere una singola immagine in una singola pagina (mentre un normale programma PostScript può contenere numerose immagini in numerose pagine) e di questa immagine viene dato il posizionamento nella pagina in un commento. EPS è uno standard pensato per l’esportazione e l’importazione di file PostScript in qualunque ambiente. Può contenere ogni combinazione di testo, grafica vettoriale e grafica bitmap, il tutto descritto in PostScript. Estensione: .eps
    • Portable Document Format : è un formato grafico derivato dal PostScript con il quale condivide il modo di descrivere gli oggetti grafici: le pagine, i colori, le coordinate, il testo, i bitmap. Non è un programma come un file PostScript, ma un elenco di oggetti grafici ottenuti interpretando (eseguendo) un file PostScript. Un file PDF ha il concetto della propria struttura e agisce come un database. Estensione: .pdf