Afficher de la 3D, juste une histoire d’espaces

Afficher de la 3D sur un écran, c’est juste une histoire de translation et de projection dans un espace tri-dimensionnel. Cet article se propose de décrire les différents processus mis en jeu pour afficher un objet en 3D sur un écran qui, au final, n’est qu’une dalle plate de pixels, c’est à dire en 2D.

 

Les mathématiques au service de la 3D

 

Avant de décrire les 3 étapes de l’affichage d’un objet 3D, il est nécessaire de définir les différents espaces (spaces) que nous rencontrerons. Ils sont au nombre de 4:

– L’espace objet (ou Object Space): c’est l’espace local à notre objet. Le centre de cet espace se situe au centre de l’objet. Cet espace va servir à définir à quelle position nous placerons les différents éléments qui composent notre objet, relatif à son centre. Dans l’image ci-dessous, nous voyons clairement le repère de l’objet: bleu pour l’axe Z, vert pour l’axe Y et rouge pour l’axe X. Les positions des 8 sommets du cube sont définies par rapport au centre de ce repère, là où les 3 axes se rencontrent. Le centre du repère est le centre de l’objet.

 

image

– L’espace du monde (ou World Space): c’est l’espace dans lequel nous placerons nos objets (la position de leur centre). C’est le plus facile à visualiser mentalement, étant donné que c’est celui qui nous entoure directement quotidiennement. Dans l’image ci-dessous, nous avons 2 repères. Celui de gauche est le repère du monde, c’est par rapport à celui-ci que nous plaçons nos objets. Ici nous avons placé le cube à la position (3; 2; –5) par rapport au repère du monde (celui-ci étant à (0;0;0)). En fait, c’est le centre du cube qui est à la position (3; 2; –5). Nous pouvons également remarquer que le cube est orienté. C’est en fait le repère du cube qui est orienté. Etant donné que les sommets du cube sont définis par rapport à ce même repère, les sommets s’orientent de la même manière. On retiendra donc que faire bouger et/ou tourner un objet dans l’espace revient en fait à appliquer une transformation sur son repère.

image

– L’espace de vue (ou View Space): c’est l’espace dans lequel la caméra constitue le centre du repère. En 3D, tout se dessine à travers une caméra. C’est pourquoi il est nécessaire de savoir comment les objets se situent par rapport à la caméra. Dans le world space, nos objets sont positionnés vis à vis du centre du monde. Pour connaître leur position relative à la caméra, nous allons leur appliquer une transformation. Dans l’image ci-dessous, nous pouvons apercevoir une sorte de boite orange. Cette boite représente la champ de vision de la caméra, c’est à dire que tout ce que vous voyez à l’écran est contenu dans cette boite. On remarque, tout à droite, un repère incliné de la même manière que la boite orange. C’est le repère local de la caméra, qui, ici, est à la position (0; 0; 5) dans le World Space. Je viens juste de dire que le View Space est l’espace dans lequel la caméra est le centre du repère. Donc ici, le centre du View Space est donc le repère local de la caméra, et l’ensemble du View Space se trouve à l’intérieur de la boite orange.

image

– L’espace de projection (ou Projection Space): c’est l’espace de notre écran ! Bien que celui-ci soit en deux dimensions, le Projection Space est en fait une boite qui a la forme de votre écran (16/9, 16/10, 4/3, etc…) et qui a une profondeur de 0 jusqu’à 1. Et tout ce qu’il y aura dans cette boite sera uniquement tout ce qu’on vous verrez à l’écran. Dans l’image ci-dessous, la partie en bleu représente la surface de votre écran, c’est donc par ici que vous voyez au final votre monde en 3D. Tout l’espace qu’il y a derrière la partie bleue correspond à ce qu’il vous sera possible de voir à l’écran.

image

Pour afficher votre objet 3D à l’écran, le but est en fait de passer de l’Object Space au Projection Space. Pour cela, nous utilisons des objets mathématiques appelés des matrices. Retenez bien ce nom car vous n’y échapperez pas en 3D. Les matrices sont des sortes de tableaux à 2 dimensions qui permettent de décrire, dans un même objet mathématique, la façon dont les objets sont orientés dans l’espace. En 3D, on utilise des matrices de dimension 4 (c’est à dire 4 colonnes et 4 lignes) qui stockeront les informations de translation, de rotation et d’homothétie (échelle) de nos objets.

 

Les matrices pour changer d’espace

 

Ces matrices vont en fait nous permettre de passer d’un espace à un autre, simplement en les multipliant. Commençons par le départ.

Nous avons donc notre objet, décrit à l’aide d’une matrice dans son Object Space. Sauf que nous voulons, par exemple, que celui-ci soit aux coordonnées (10; 45; 90) dans notre monde, tourné de 45 degrés sur la droite et 2 fois plus grand. Nous allons donc, premièrement, calculer la matrice qui correspond à cette transformation de l’objet (XNA nous fournit tout ce qu’il faut pour ça) et deuxièmement, multiplier cette nouvelle matrice à la matrice de notre objet en Object Space. Et Tadaaaa! Nous avons notre objet transformé dans le World Space !

Maintenant, il faut passer de ce World Space au View Space, qui est je le rappelle, l’espace 3D dans lequel la caméra est au centre de l’espace. Pour cela, il nous faut calculer une matrice de vue (encore une fois le XNA nous fournit ce qu’il faut pour le faire) correspondant aux caractéristiques de notre caméra: position, direction de regard et roulis. Une fois ceci effectué, on multiplie cette matrice de vue à la matrice en World Space, et voilà que notre objet est transformé dans le View Space ! Nous ne sommes plus très loin d’avoir l’objet transformé correctement pour être affiché à l’écran, donc faisons-le sans plus attendre.

Dernière étape, il faut passer du View Space au Projection Space. Vous l’aurez deviné, il faut encore une matrice, que l’on appelle matrice de projection. Cette matrice est construite à partir de l’angle de vue de la caméra, le ratio de votre écran (16/9ème, 16/10ème, …) et du plan proche et lointain de la caméra (nous ne détaillerons pas ici de que ce sont ces plans). Une fois la matrice calculée, il nous suffit de la multiplier à la matrice de l’objet en View Space, et voilà que notre objet est transformé dans le Projection Space et prêt à être affiché à l’écran !

Voici un petit schéma qui résume tout ce que nous venons de faire:

image

 

 

Réflexion sur les performances

 

En tout dernier point, j’aimerai vous faire remarquer que si vous affichez par exemple 500 objets 3D à l’écran, ça fait pas mal de calculs au niveau du processeur. Celui-ci étant conçu pour faire n’importe quel type de calcul, il ne sera pas assez efficace pour tout calculer pour 500 objets, et ce 60 fois par seconde si vous visez un jeu fluide. Jugez plutôt : 500objets * 60Hz * 3 calculs matriciels = 90000 calculs matriciels = presque un million de multiplications simples (a * b), Ce qui est colossale quand on pense que le processeur doit aussi d’occuper de la physique, de l’IA, du gameplay, de l’animation, etc… Sauf que ce que je n’ai pas dit, c’est qu’il y a certaines étapes (World => View et View => Projection) qui sont calculées à l’aide de la carte graphique, spécialisée dans le calcul matriciel et vectoriel. Avec les cartes graphiques modernes, des centaines de petites unités massivement parallèles sont dédiées à ces types de calcul, ce qui nous permet de booster ces calculs et d’afficher des graphismes de haut niveau. Toute cette discussion pourrait faire l’objet d’un futur post.

 

Conclusion

 

Voilà pour ce petit article théorique et rébarbatif, mais néanmoins indispensable si vous souhaitez vous plonger dans la programmation de jeux-vidéos ou d’applications 3D !

Publicité

Publié le 13 décembre 2010, dans 3D, XNA 4.0. Bookmarquez ce permalien. Poster un commentaire.

Votre commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l’aide de votre compte WordPress.com. Déconnexion /  Changer )

Image Twitter

Vous commentez à l’aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l’aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s

%d blogueurs aiment cette page :