Chapitre 3 : Textures - LaCIMblondin/files/inf5071/hiv2018/textures.pdf · I Aussi, Photoshop et...

Chapitre 3 : Textures

Alexandre Blondin Masse

Departement d’informatiqueUniversite du Quebec a Montreal

23 janvier 2018Infographie

INF5071

A. Blondin Masse (UQAM) 23 janvier 2018 1 / 53

Table des matieres

1. Lumiere

2. Developpement de modeles

3. Couleurs et images

4. Application de texture

5. Surfaces parametrees

6. Changements de coordonnees


Table des matieres

1. Lumiere







Couleur et lumiere

I Un objet ne peut avoir une couleur que si une sourcelumineuse existe quelque part;

I Autrement, il sera completement noir;

I Lorsqu’un rayon de lumiere frappe un objet, celle-ci estreflechie selon differents phenomenes :

I Reflexion diffuse;

I Reflexion speculaire;

I Diffraction, etc.


Reflexions diffuse et speculaire

(source: GianniG46)


https://commons.wikimedia.org/wiki/User:GianniG46

Modele de Lambert

I C’est un des modeles les plus simples et tres utilise eninfographie;

I Soient

I#»

N un vecteur normal unitaire a la surface;

I#»

L un vecteur unitaire de la surface vers la lumiereet

I iL un nombre indiquant l’intensite de la lumiere.

I Alors l’intensite de diffusion est

iD = iL(#»

N · #»

L),

ou · denote le produit scalaire.


Reflexion speculaire

I Une limite du modele de Lambert est qu’il ne tient pascompte de l’observateur;

I Plus precisement, peu importe l’angle, la textureapparaıt de la meme facon;

I Or, la position de l’observateur devrait influencer lerendu;

I Par exemple, si on se trouve face a une surfacereflechissante, on est aveugle par la lumiere, alors que sion est sur le cote, on ne l’est pas;

I Pour tenir compte de cet aspect, on utilise par exemple lemodele de Blinn-Phong.


Table des matieres

1. Lumiere







Mise en contexte

I Une texture est essentiellement une image 2D;

I Le probleme, c’est que nos modeles sont des objets 3D;

I Comment etablir une relation entre les deux ?

I Essentiellement, il s’agit de construire une fonction

unwrap : Modele3D ⊆ R3 → [0, h]× [0, w](x, y, z) → (u(x, y, z), v(x, y, z))

I Autrement dit, on doit associer a chaque point 3D denotre modele un point 2D dans un rectangle.


Developpement ou projection

I Cette relation entre modele et image est appeleeprojection (car le nombre de dimensions de l’espacediminue);

I On appelle ce processus developpement du modele (enanglais, UV-unwrapping);


Developpement d’une sphere

I Le developpement d’un modele n’est pas toujours facilea deduire du modele;

I Par exemple, comment devrait-on developper une sphere ?

I Meme pour le cube de la diapositive precedente, si ondeveloppe, on obtient une projection non utilisable.


Couture (seam)

I La strategie consiste a utiliser des coutures (en anglais, ondit seam);

I Une couture est simplement une arete le long de laquelleon accepte qu’il y ait une discontinuite;

I Il faut donc choisir les coutures avec soin, si on veuts’assurer que la discontinuite n’est pas trop apparente;

I Dans Blender, on identifie une couture en choisissantcertaines aretes et entrant la commande CTRL-E +Mark seam;

I Les coutures apparaissent alors en rouge.


Exemple (1/4)

I Dans l’image ci-bas, il y a une couture le long d’unmeridien;


Exemple (2/4)

I Le developpement est bien different si on ajoute unecouture faisant un tour complet;


Exemple (3/4)

I On peut aussi faire une projection spherique;


Exemple (4/4)

I La projection spherique devient rectangulaire si onremplace les poles par plusieurs sommets;


Choisir les coutures

Pour choisir les coutures, il faut une certaine pratique :

I Il faut minimiser les discontinuites trop apparentes;

I C’est en particulier important pour les texturesperiodiques;

I On separe la ou il y a un changement de materiau;

I Ensuite, on prend une suite d’aretes moins visibles ou lacoupure sera moins apparente (par exemple, derrierel’objet);


Table des matieres

1. Lumiere







Systemes de couleurs

I Lorsqu’on manipule des images, il faut bien comprendre lessystemes de couleurs;

I Les systemes les plus courants sont :

I Noir et blanc;

I RYB;

I RGB;

I CMYK;

I HSV;


Le systeme noir et blanc

I Sans doute le plus simple, base sur deux couleurs : noir etblanc;

I Dans ce systeme, chaque pixel a la valeur 0 ou 1;

I Si on veut obtenir des niveaux de gris, alors la valeur dupixel sera entre 0 et 1 (ou entre 0 et 255);

I Note : Plusieurs images de couleurs sont obtenues encombinant certaines images en noir et blanc.


Le systeme RYB

I Un systeme utilise en peinture :

I R : red;

I Y : yellow;

I B : blue.

I Il ne permet cependant pas de reproduire le spectre descouleurs visibles par l’etre humain;


Combinaisons de couleurs (RYB)


Solution


Le systeme RGB

I Il s’agit du systeme le plus connu en informatique :

I R : red;

I G : green;

I B : blue.

I Il y a des motivations physiques derriere ce choix : l’oeilhumain est plus sensible aux variations de couleursgenerees par ce systeme;

I On peut representer le noir (absence complete) et leblanc (presence complete).


Combinaisons de couleurs (RGB)


Solution


Espace RGB

I Au niveau mathematique, une couleur correspond a unpoint

p ∈ [0, 1]3.

I Autrement dit, c’est un triplet dont les coordonnees sontentre 0 et 1.


Le systeme CMYK

I Contrairement au systeme RGB, qui est additif, lesysteme CMYK est soustractif.

I Ce systeme est surtout utilise pour l’impression.

I En effet, dans la plupart des cas, on imprime sur du papierblanc (plutot que d’afficher sur un ecran noir).

I Autrement dit, on supprime les couleurs qu’on nesouhaite pas reflechir sur le papier.


Combinaisons (CMYK)


Formats d’images

Formats bitmap :

I BMP (souvent non compresse);

I GIF;

I JPEG;

I PNG;

Formats vectoriels :

I PostScript/PS;

I PDF;

I SVG, etc.


La bibliotheque Pillow

I Un bibliotheque Python qui permet de manipuler desimages;

I Site officiel: https://pillow.readthedocs.io/en/latest/;

I C’est un fork du projet PIL qui n’est plus maintenu;

I Utile pour creer des textures de facon procedurale (vu enlaboratoire).


https://pillow.readthedocs.io/en/latest/

http://www.pythonware.com/products/pil/

Table des matieres

1. Lumiere







Texture

I Formellement, une texture est simplement une image 2D;

I Nous allons voir plus tard dans le cours qu’on peut aussicreer des textures 3D;

I Ces dernieres sont simplement une collection d’imagescombinees d’une facon specifique:

I une texture de relief (bump map);

I une texture de speculaire;

I selon les vecteurs normaux, etc.


Logiciels

I Inkscape, pour creer des images vectorielles (on peutevidemment ensuite exporter);

I Gimp et Krita, pour creer des images de type bitmap;

I Aussi, Photoshop et Illustrator.

I Souvent, il y a un aller-retour entre des logiciels demodelisation 3D et les logiciels pour les images 2D;

I De la meme facon, certaines images produites parBlender sont ensuite modifiees a l’aide de logiciels 2D.


Texture manuelle

I Il est aussi possible de creer des textures manuellement;

I Beaucoup d’artistes 3D procedent de cette facon;

I En anglais, on dit model painting;

I On peut combiner les approches manuelle etautomatisee.

I L’avantage de faire une texture manuelle est qu’on a uneretroaction directe sur l’aspect du modele.


Dimensions d’une texture

I Souvent, on choisit les dimensions d’une texture pourqu’elles soient des puissances de 2;

I Cela permet d’avoir une meilleure qualite lors d’unredimensionnement;

I Utilise dans le mipmapping : Strategie qui consiste a stockerdes copies de plus en plus plus petites d’une image.

I Ensuite, on utilise l’interpolation pour representer lesdimensions intermediaires.


Exportation-importation d’un modele

En pratique, un modele devrait etre livre avec

I Sa geometrie, c’est-a-dire le maillage (mesh);

I Son developpement (UV-unwrapped);

I Les textures a lui appliquer (pour le moment, une texturediffuse), dans des images separees.

Eventuellement, nous aurons des modeles animes:

I On peut inclure un systeme articule avec habillage(rigging + skinning);

I Des formes (shape keys ou morphs).


Table des matieres

1. Lumiere







Surfaces

Il existe plusieurs facons de definir une surface :

I A l’aide d’une equation cartesienne. Par exemple

x2 + y2 + z2 = 1.

I A l’aide d’une fonction vectorielle. Par exemple

~s(u, v) = (u, v, u+ v).

I En mots. Par exemple, un cylindre de rayon 3 centre en(2, 1,−4) et dont l’axe principal est dans la direction(1, 2, 3).


Spheres et ellipsoıdes

I Une sphere est entierement determinee par un rayon r etun centre (h, k, `);

I L’equation cartesienne est

(x− h)2 + (y − k)2 + (z − `)2 = r2.

ou(x− h)2

r2+

(y − k)2

r2+

(z − `)2

r2= 1.

I On generalise facilement a une ellipsoıde, en ajoutant lesrayons (a, b, c) (plutot que seulement r), ce qui donne

(x− h)2

a2+

(y − k)2

b2+

(z − `)2

c2= 1.


Cylindres

I Un cylindre est entierement determine par un rayon, uncentre, une hauteur et une direction;

I Il faut utiliser plusieurs contraintes cartesiennes pour ledefinir :

I Une equation decrivant un cylindre infini, parexemple

(x− a)2 + (z − c)2 = r2,

qui est le cylindre aligne avec l’axe des y et de rayon r;

I Une restriction pour que le cylindre soit fini, parexemple −h/2 ≤ y − b ≤ h/2, pour que la hauteur soith et le centre soit (a, b, c).


Cone

I Un cone circulaire est caracterise par un sommet, un“rayon” et une direction;

I Une equation cartesienne possible est

r2(z − c)2 = (x− a)2 + (y − b)2,

ou (a, b, c) represente le sommet du cone, r est le rayon dela tranche qu’on obtient en coupant le cone a une distance1 du sommet.

I Pour que le cone soit fini, on doit ensuite limiter lesvaleurs possibles de z, par exemple 0 ≤ z − c ≤ h, ou h estla hauteur du cone.


Autres surfaces

I Il existe plusieurs autres surfaces classiques :

I Paraboloıdes (circulaires ou non circulaires);

I Hyperboloıdes a une nappe;

I Hyperboloıdes a deux nappes;

I Cones (circulaires ou non circulaires);

I etc.

I Toutes les surfaces que nous avons vues sont desquadriques, c’est-a-dire des surfaces dont l’equationcartesienne est un polynome de degre au plus 2.


Surfaces parametrees

DefinitionSoit S une surface. On dit que la fonction vectorielle

#»s (u, v) = (x(u, v), y(u, v), z(u, v)), (u, v) ∈ D

est une parametrisation de la surface S si

Image( #»s ) = S.

L’ensemble D est appele domaine des parametres u et v;

Remarque

Trouver une parametrisation d’une surface revient a inverserun developpement de cette surface.


Table des matieres

1. Lumiere







Changement de coordonnees

I Un autre type de fonctions tres importantes en infographie:les changements de coordonnees;

I L’idee est qu’il est plus facile de decrire certainessurfaces en utilisant un repere different;

I Les changements les plus courants:

I Les coordonnees cartesiennes;

I Les coordonnees polaires;

I Les coordonnees cylindriques;

I Les coordonnees spheriques;

I Note: On peut imaginer une infinite d’autreschangements.


Les coordonnees cartesiennes/d’ecran

I Cartesienne vers ecran: x′ = x, y′ = h− y

I Ecran vers cartesienne: x = x′, y = h− y′

x

y

(0, 0)

p

cartesienne

x′

y′

(0, 0)

p

ecran


Les coordonnees polaires

I Polaires vers cartesienne: x = r cos θ, y = r sin θ

I Cartesienne vers polaires: r =√x2 + y2, θ = arctan(y/x)

r

θ(0, 0)


Les coordonnees cylindriques (1/2)

x

y

z

r

z′

(x, y, z)

(x, y, 0)

θ


Les coordonnees cylindriques (2/2)

I C’est une generalisation des coordonnees polaires en 3D;

I Cartesiennes: (x, y, z);

I Cylindriques: (r, θ, z′):

I r : distance par rapport a l’axe des z;

I θ : angle entre les vecteurs (1, 0, 0) et (x, y, 0);

I z′ : distance (signee) par rapport au plan xy.

I Equations:

x = r cos θ, y = r sin θ, z = z′.

I Peut etre construit a partir des autres axes aussi.


Les coordonnees spheriques (1/2)

x

y

z

ρ

(x, y, z)

(x, y, 0)

θ

ϕ


Les coordonnees spheriques (2/2)

I Une autre generalisation des coordonnees polaires en 3D;

I Cartesiennes: (x, y, z);

I Spheriques: (ρ, θ, ϕ):

I ρ : distance par rapport a l’origine;

I θ : angle entre les vecteurs (1, 0, 0) et (x, y, 0);

I ϕ : angle entre les vecteurs (0, 0, 1) et (x, y, z).

I Equations:

x = ρ sin θ cosϕ, y = ρ sin θ sinϕ, z = ρ cos θ.


Exercices

I Trouver une parametrisation du plan

2x− y + 3z − 5 = 0.

I Trouver une parametrisation du cylindre

y2 + z2 = 25.

I Trouver une parametrisation de la sphere

x2 + y2 + z2 = r2.


Chapitre 3 : Textures - LaCIMblondin/files/inf5071/hiv2018/textures.pdf · I Aussi, Photoshop et...

Documents

Transcript of Chapitre 3 : Textures - LaCIMblondin/files/inf5071/hiv2018/textures.pdf · I Aussi, Photoshop et...