Le terme 3d a été si souvent détourné que l’on oublie qu’il s’agit bien de la troisième dimension. Cependant cette définition n’est pas suffisante.
Commercialement, la 3d signifie le plus souvent stéréovision, c’est à dire une technique permettant d’envoyer une image différente et légèrement décalée à chaque oeil pour simuler un effet de 3D.
Mais la réelle 3D consiste à considérer un objet virtuel dans sa forme en 3 dimensions. La stéréovision vient ensuite ajouter du réalisme à la représentation dudit objet.
En Mars 2012 nous avions développé un jeu d’échecs en 3D avec vue webcam de l’adversaire, utilisant les technologies webgl pour la 3D, getUserMedia API pour la récupération de l’image webcam et webRTC pour la transmettre n P2P entre les joueurs.
Cette application avait été développée en partenariat avec la Mozilla Fundation, et présentée lors du 83° meeting de l’IETF à Paris afin de promouvoir la technologie webRTC.
L’intégration de la technologie webRTC a été particulièrement rapide sur Chrome. Les versions stables actuelles l’intègrent parfaitement. Nous avons modifié l’application afin de la mettre en ligne. Voici les fonctionnalités rajoutées :
Légères améliorations du design (sol bleu, éclairage, correction de bugs),
Intégration d’ICE pour la traversée des NAT
Remplacement du serveur utilisé pour la mise en relation entre les joueurs et l’envoi des données de jeu (avant c’était un programme spécifique, indéployable sur notre serveur, et maintenant c’est un script PHP utilisant AJAX et un protocole ACK à fenêtre coulissante).
L’application ayant été développée très rapidement (moins d’une semaine), il est possible qu’elle ne soit pas entièrement déboguée.
En ces temps où le contrôle de la liberté d’expression est plus que jamais un sujet à la mode, notamment grâce aux révolutions arabes et aux dernières révélations de wikileaks sur les entreprises occidentales ayant vendu des technologies de surveillance électronique à des dictatures ( http://wikileaks.org/the-spyfiles.html ), nous dévoilons notre nouvelle démo webgl consistant en un espace dédié à la liberté d’expression.
Avant d’aborder les aspects techniques de cette démonstration, je vais me permettre une rapide digression par rapport au sujet principal de ce blog, sur les évènements historiques l’ayant inspiré.
A partir du 15 Septembre 1989, un important mouvement populaire se forme sur la place Tiananmen, à Pékin. Ce mouvement est mené essentiellement par des étudiants, des intellectuels et des ouvriers. Ces deniers demandent des réformes politiques et démocratiques. Bien que ce mouvement soit totalement pacifique, le gouvernement communiste chinois met en place la loi martiale le 20 mai. A partir du 4 Juin, l’armée populaire ouvre le feu sur la foule. Le nombre de morts n’a pas été évalué avec certitude, et oscille entre plusieurs centaines et quelque milliers.
En Juin 1989, un manifestant se place sur le chemin d’une colonne de chars, sur l’avenue Chang’An, qui borde la place Tiananmen au nord. Si l’identité de cet homme n’est pas connue, cette image est mondialement célèbre de par son puissant symbolisme.
Actuellement, même si la Chine n’est plus celle de Mao, elle reste une dictature communiste où la liberté d’expression est contrôlée et où les médias sont censurés. Leur outil de censure de l’Internet, le GFW (pour the Greate FireWall ) ne cesse de se perfectionner : il filtre le contenu des paquets lisibles, bloque les proxies, effectue du DNS poisoning, relentit les connexions HTTPS et de nombreux VPN, ….
Notre démonstration fige cet instant historique, et transforme ce symbole de la répression en un lieu de liberté d’expression. Tout internaute peut peindre et coller des images sur les chars, sur le sol ou sur le monument à la gloire des héros du communisme. Les modifications peuvent être sauvegardées sur le serveur de sorte à les partager.
Au niveau technique, les maillages ont été exportés de Blender. Les intersections se font via un octree créé à l’exportation de Blender, et non plus au chargement en javascript comme dans notre précédente démo Cadillac Ranch . Le serveur recréé le processus de création effectué côté client avec GD, la librairie de gestion d’images de PHP.
Le webgl peut avoir des applications mathématiques intéressantes, notamment dans le cas de la représentation d’objets 3D telles les surfaces.
Nous avons développé un traceur de surfaces en 3D de type z=f(x,y) , qui prend en compte les différentes fonctions mathématiques fournies par le javascript.
Le traceur est disponible ici : spacegoo.com/demo_plots.php
Si vous n’êtes pas compatible webgl, vous pouvez toujours admirer cette vidéo capture d’écran :
Nous avons programmé une nouvelle démo présentant l’effet d’occlusion ambiante.
C’est un effet classique qui permet d’ajouter du réalisme à une scène 3D sans coûter un centime à l’exécution. Les reliefs sont augmentés et les ombres adoucies, grâce à précalcul ne dépendant que de la géométrie du maillage.
Pour chaque vertex de l’objet, on lance des rayons (92 ici) dans toutes les directions autour de la normale à ce point. On compte alors les rayons qui intersectent l’objet. Ce nombre divisé par le nombre de rayons lancés nous donne une approximation de l’angle solide de « visibilité », qui caractérise la facilité qu’a la lumière pour y accéder.
En multipliant l’éclairement en ce point par le facteur obtenu, on obtient l’effet voulu, et les reliefs sont réhaussés.
Ce blog a pour objet principal d’informer au sujet des technologies 3D intégrées au navigateur Web, notamment sur le WebGL, qui est la technologie utilisée par SPACEGOO.
Il s’étendra sur les possibilités du WebGL, ainsi que son interfaçage avec d’autres technologies, par exemple la stéréovision ou la réalité augmentée.
