Michele Antolini
Lezione1
Informatica Grafica
Cos’è la computer grafica
Visualizzazione
Lezione del 10 Marzo 2010
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
Michele Antolini
Dipartimento di Ingegneria Meccanica
Politecnico di Milano
1.1
Tubo a Raggi Catodici
Michele Antolini
Cathode Ray Tube - CRT
Visualizzazione
Il tubo catodico
Breve storia
• 1897 - Karl Ferdinand
Braun inventa il primo
dispositivo di scansione a
raggi catodici
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.2
Tubo a Raggi Catodici
Michele Antolini
Cathode Ray Tube - CRT
Visualizzazione
• 1907 - Boris Rosing,
utilizzando un dispositivo
elettromeccanico, riesce a
disegnare semplici forme
geometriche su uno
schermo CRT
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.3
Tubo a Raggi Catodici
Michele Antolini
Oscilloscopio
• L’oscilloscopio è stata una
delle prime applicazioni
del tubo catodico
• Permette di visualizzare
un segnale ripetitivo
(variazione di voltaggio
fornito al cannone
elettronico, electron gun)
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Fonte: Wikipedia
Cosa bisogna sapere
Prossima lezione
1.4
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
• 1963 - Ivan Sutherland
sviluppa una delle prime
GUI (Graphical User
Interface) utilizzando un
plotter 2D e una penna
luminosa, sviluppando il
concetto innovativo di
oggetti e istanze
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
• È stato la base per i
moderni Computer Aided
Design (CAD), per la
programmazione object
oriented e, in generale, per
le Graphical User
Interfaces (GUI)
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
Fonte: Wikipedia
1.5
Prime applicazioni di computer graphics
Sketchpad
AN INTRODUCTORY EXAMPLE
Michele Antolini
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.6
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
RY EXAMPLE
23
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.7
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.8
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.9
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.10
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.11
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.12
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.13
Prime applicazioni di computer graphics
Michele Antolini
Sketchpad
Visualizzazione
• Sketchpad si può considerare il primo esempio di vector
graphics
• La tesi di Sutherland è disponibile online all’indirizzo:
http://www.cl.cam.ac.uk/techreports/
UCAM-CL-TR-574.pdf
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.14
Grafica 2D
Michele Antolini
Definizione
Si definisce attualmente come generazione basata su
calcolatore di immagini digitali come modelli geometrici (2D),
testo, immagini digitali.
Visualizzazione
Il tubo catodico
Breve storia
Si divide in:
• Pixel art: ogni immagine visualizzata è concepita come
un insieme (ordinato) di punti (detti pixel). Ogni
manipolazione modifica il colore di pixel specifici.
Un’immagine definita come griglia di punti si definisce
raster graphics
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
• Grafica vettoriale: le immagini sono generate a partire da
Cosa bisogna sapere
Prossima lezione
primitive geometriche come punti, linee, curve, poligoni,
basandosi su funzioni matematiche
1.15
Grafica 2D
Michele Antolini
Raster vs Vector
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
Fonte: Wikipedia
1.16
Grafica 3D
Michele Antolini
Visualizzazione
Il tubo catodico
In grafica 3D si usa una rappresentazione tridimensionale di
dati geometrici, memorizzati all’interno di un computer, al fine
di eseguire calcoli e di creare immagini (proiezioni)
bidimensionali, dette rendering
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.17
Glossario
Michele Antolini
Visualizzazione
Il tubo catodico
Pixel
Un pixel è la più piccola unità rappresentabile su uno schermo
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.18
Glossario
Michele Antolini
Visualizzazione
Immagine
Un’immagine è un oggetto bidimensionale formato da un
insieme ordinato di pixel
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.19
Glossario
Michele Antolini
Rasterizzazione
• La rasterizzazione è
un’operazione che
permette di trasformare
grafica vettoriale
(descritta
matematicamente) in
un’immagine,
associando un colore
ad ogni pixel
• Se la grafica vettoriale
descrive un modello
tridimensionale si parla
di rendering
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.20
Glossario
Michele Antolini
Rendering
Processo di generazione di un’immagine a partire da un
modello tridimensionale. Per effettuare l’operazione è
necessario specificare:
• Geometria
• Punto di vista e field of view (FOV)
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
• Texture (letteralmente “tessuto” )
Glossario
• Illuminazione
Grafica 3D
OpenGL vs Direct3D
• Shading (letteralmente “ombreggiatura” )
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.21
Glossario
Michele Antolini
Rendering
A
Proiezione 3D
Definendo geometria, punto
di vista e campo di visione
(Field of View) è possibile
proiettare la scena 3D su un
piano per ottenere la
successiva rasterizzazione
Visualizzazione
Il tubo catodico
Breve storia
A’
B
Prime applicazioni
Sketchpad
Tipi di immagini
B’
2D
3D
Centro di
proiezione
Piano di
proiezione
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.22
Glossario
Michele Antolini
Rendering
Shading
Lo shading è l’operazione che permette, dato il colore di una
superficie o di una faccia di un poligono, di calcolarne
l’ombreggiatura in base alla direzione della luce (partendo
dalla posizione della sorgente luminosa).
• Flat shading: assegnazione di una tonalità di colore per
ogni faccia dei poligoni contenuti nella scena
• Smooth shading: per ogni pixel dell’immagine
rasterizzata, la tonalità di colore dipende
dall’interpolazione dei vettori normali alle facce del
poligono
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.23
Glossario
Michele Antolini
Rendering - Flat vs smooth shading
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.24
Glossario
Michele Antolini
Rendering
Texture mapping
Applicazione di un’immagine bidimensionale (detta texture)
sulla superficie di un oggetto 3D.
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.25
Glossario
Michele Antolini
Rendering
Texture mapping
Applicazione di un’immagine bidimensionale (detta texture)
sulla superficie di un oggetto 3D.
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.26
Glossario
Michele Antolini
Rendering
Bump mapping
• Uno dei modi più interessanti in cui vengono utilizzate le
texture
• in base alla tonalità di grigio presente in ogni pixel della
texture, la superficie su cui viene applicata la texture viene
modificata creando “rugosità” che verranno renderizzate
adeguatamente durante il processo di shading.
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.27
Grafica 3D
Michele Antolini
• I programmi 3D hanno una struttura molto simile
Visualizzazione
• Fasi:
• Definizione geometrie (vertici, vettori, linee, poligoni,
superfici)
• Definizione punto di vista, FOV, proiezione
• Rasterizzazione, shading (+eventuali texture)
Il tubo catodico
• Sono coinvolti vettori, matrici, equazioni matematiche
Glossario
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.28
Software→Hardware
Michele Antolini
• Presenza di algoritmi maturi per le operazioni 3D
• Necessità di applicare ad un grande numero di dati le
medesime operazioni
Visualizzazione
Il tubo catodico
• 1984: la IBM rilascia il primo tentativo di scheda per PC
dedicata all’accelerazione hardware 2D/3D (con un
processore 8088-2, 8MHz)
• Negli anni ’90 l’accelerazione 2D prima e 3D poi
diventano sempre più importanti per le prestazioni dei
computer, così società come S3, ATI, Matrox cominciano
a produrre schede di accelerazione hardware sempre più
performanti.
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.29
Librerie grafiche
Michele Antolini
Visualizzazione
Il tubo catodico
• Nascono le librerie grafiche
• OpenGL vs. Direct3D
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.30
OpenGL vs Direct3D
Michele Antolini
Direct3D
• Interfaccia proprietaria, sviluppata da Microsoft e
implementata solo per sistemi Microsoft
Visualizzazione
Il tubo catodico
Breve storia
• Estremamente legata all’hardware e alle funzionalità
fornite dalle schede grafiche
• Per ogni versione, la backward compatibility è difficilmente
garantita
• Dalla versione 9 in poi le prestazioni sono molto elevate e
l’architettura è diventata matura
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.31
OpenGL vs Direct3D
Michele Antolini
OpenGL
• È una specifica, un insieme di API.
Visualizzazione
• Non è legato all’hardware, ma permette un’astrazione
delle funzionalità
• È uno standard aperto e ne esistono implementazioni per
diversi sistemi operativi (anche di tipo mobile (iPhone,
Android, Symbian)
• L’interfaccia si è evoluta nel tempo, ma la filosofia iniziale
non è mai cambiata (es. principio della macchina a stati,
astrazione dalle funzionalità hardware)
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.32
GPU
Michele Antolini
• Le schede grafiche (GPU) non sono più “semplici”
rasterizer ma gestiscono luci, texture e shading
• Negli anni 2000 i produttori di GPU forniscono gli
strumenti per programmare direttamente sull’hardware gli
algoritmi di shading
• Ogni pixel viene processato da un programma residente
sulla GPU che può includere texture aggiuntive o altri tipi
di input
• Ogni vertice può essere ulteriormente processato
dall’hardware
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.33
GPGPU
Michele Antolini
• Le schede grafiche odierne non si occupano più solo di
grafica
• La programmabilità e la capacità di eseguire calcoli
complessi da applicare ad un gran numero di dati in
contemporanea (alto parallelismo a livello hardware) fa
preferire l’esecuzione di alcuni algoritmi su GPU piuttosto
che su CPU
• Questa tecnica si definisce General Purpose (Computing)
on GPU (GPGPU)
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
• Esistono numerose applicazioni in grado di sfruttare le
GPU, principalmente di tipo scientifico. Esistono anche
diverse implementazioni di encoder/decoder audio/video
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.34
Librerie per GPGPU
Michele Antolini
Le principali librerie che permettono l’esecuzione di codice su
GPU sono:
• OpenCL (standard utilizzato dal sistema operativo Snow
Leopard)
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
• CUDA (sviluppato per le schede NVidia)
• Stream (sviluppato per le schede Ati)
Oltre gli scopi del corso, consiglio di curiosare le potenzialità di
CUDA e OpenCL
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.35
Cosa bisogna sapere per occuparsi di computer grafica (3D)
Michele Antolini
Chi si occupa di computer grafica deve necessariamente avere
una serie di conoscenze di base:
• Geometria ed algebra dei vettori (coordinate omogenee,
rappresentazione dei vettori, operazioni tra vettori –
prodotto scalare, vettoriale, normalizzazione, etc) e delle
matrici (determinante, inversione di matrici, matrici di
trasformazione per rototraslazioni e altre operazioni lineari
• Programmazione: il linguaggio più utilizzato è senza
dubbio il C++, anche se anche Java copre una parte delle
applicazioni
• Modellazione 3D: a partire dalla creazione di modelli, alle
texture, alla programmazione degli shaders
Visualizzazione
Il tubo catodico
Breve storia
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
• Giochi: chi si occupa di giochi (e vuole fare tutto da solo)
deve anche conoscere e saper utilizzare le leggi della
fisica, le tecniche di multithreading, intelligenza artificiale,
multimedialità in genere!
1.36
Venerdi 12 marzo
Michele Antolini
Visualizzazione
Il tubo catodico
Breve storia
La prossima lezione si terrà in aula 18 dalle 11.30 alle 13.30
Prime applicazioni
Sketchpad
Tipi di immagini
2D
3D
Glossario
Grafica 3D
OpenGL vs Direct3D
GPU Computing
Cosa bisogna sapere
Prossima lezione
1.37
