Compte rendu Windows App : spécial 3D

Alexandre Laurent

L'école d'art numérique ISART DIGITAL a accueilli quatre présentations ayant pour principal thème la création d'applications pour Windows. Cet événement était centré autour du thème des applications 3D.

Commentez

- Titre : Compte rendu Windows App : spécial 3D

- Auteur : Alexandre Laurent

- Parution : 2 décembre 2013

- Licence : Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright ® 2013 Alexandre Laurent. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.

Sommaire

- I. Introduction

- II. Comment créer des applications 3D performantes avec WebGL & Babylon.js

- II-A. Pourquoi construire un moteur 3D ?

- II-A-1. WebGL ?

- II-B. Babylon.js

- II-B-1. Licence

- II-B-2. Fonctionnalités

- II-B-3. Performances

- II-B-4. Expérimentations

- II-B-4-a. Windows Store

- II-B-4-b. Oculus Rift

- II-B-5. Ce qu'il reste à faire

- II-C. Support de présentation

- III. Unity 3D & Oculus Rift

- III-A. GraphicStream

- III-B. Serious Game

- III-C. Oculus Rift

- III-D. IM Build

- III-E. Support de présentation

- IV. Build 3D Web and Desktop applications with C++11

- IV-A. Introduction

- IV-B. Fonctionnalités

- IV-C. Multiplateforme

- IV-C-1. C++11

- IV-C-2. Intégration page Internet

- IV-C-3. Intégration Windows Store

- IV-D. Retours sur le développement

- IV-D-1. Les bons points

- IV-D-2. Les mauvais points

- IV-E. Support de présentation

- V. Project Anarchy

- V-A. Support de présentation

- VI. Remerciements

I - Introduction

L'ISART DIGITAL, l'école d'art numérique a invité David Rousset et David Catuhe, Valentin Billote, Jean-Marc Le Roux et Alexandre Laurent pour donner quatre présentations autour de la création d'applications Windows et plus précisément, d'applications 3D.

II - Comment créer des applications 3D performantes avec WebGL & Babylon.js

Par David Catuhe et David Rousset(Microsoft)

David Catuhe et David Rousset sont tous les deux employés chez Microsoft. Le soir, après le travail, ils développent un moteur 3D pour WebGL.

II-A - Pourquoi construire un moteur 3D ?

David Catuhe et David Rousset ont voulu faire un moteur 3D pour le Web, pour s'amuser, mais aussi pour faciliter le développement d'applications WebGL. En effet, une application WebGL ne produisant qu'un triangle multicolore nécessite déjà une trentaine de lignes et cela, uniquement pour avoir un triangle plat.

Avec Babylon.js, les développeurs voulaient s'abstraire de cette complexité pour proposer une solution simple à mettre en place et beaucoup plus facile à prendre en main.

II-A-1 - WebGL ?

WebGL est une spécification dérivée d'OpenGL ES afin de proposer une bibliothèque 3D, accélérée par le GPU, pour les pages Web. En effet, l'utilisation de canvas2d, ne tire pas avantage des puces graphiques et pour quelques milliers de triangles fera souffrir votre CPU. De plus, avec le support de WebGL dans Internet explorer 11, cela en fait une solution réellement portable.

II-B - Babylon.js

Babylon.js est donc la solution proposée par David Catuhe et David Rousset. Une bibliothèque 3D pour le Web, orientée pour les performances. Certes, Three.js existait déjà, mais cette dernière se concentrait sur la géométrie à afficher.

II-B-1 - Licence

Le projet est open source (code source sur GitHub) et est publié sous licence Apache 2.

II-B-2 - Fonctionnalités

Babylons.js propose un module d'exportation de scène pour Blender. Celui-ci permet d'exporter une scène Blender pouvant directement être chargée dans Babylon.js.

De plus, la bibliothèque embarque un moteur physique, un support du mode hors ligne et propose des optimisations du réseau pour charger les scènes au fur et à mesure du besoin.

La gestion du toucher est aussi intégrée grâce à hand.js.

II-B-3 - Performances

Le moteur peut gérer facilement une scène de 900 000 triangles. Cela est rendu possible grâce à de multiples optimisations, notamment sur les shaders, par l'implémentation d'un système d'octree, de sous mesh et d'un frustrum culling. Afin d'éviter les problématiques liées au ramasse-miettes, Babylon.js ne fait aucune instanciation durant la boucle de rendu.

II-B-4 - Expérimentations

II-B-4-a - Windows Store

Pour le support de Windows Store, il suffit de créer un projet « Javascript » > « Windows Store » dans Visual Studio 2013.

II-B-4-b - Oculus Rift

Oculus Rift est aussi géré grâce à un double rendu de la scène.

II-B-5 - Ce qu'il reste à faire

Les deux développeurs souhaitent maintenant implémenter :

- la simulation des effets de lentilles ;

- la vue multiple ;

- un éditeur simple ;

- le glisser/déposer ;

- un mode « sandbox » ;

- le support de la physique ;

- la gestion des collisions à l'aide des webworkers pour paralléliser le traitement ;

- un format de fichier binaire (actuellement du JSON).

II-C - Support de présentation

Animation en format "slideshare" non supportée.
Contenu uniquement consultable en ligne à cette adresse :
https://www.slideshare.net/slideshow/embed_code/28556418

III - Unity 3D & Oculus Rift

Par Valentin Billotte (GraphicStream)

III-A - GraphicStream

GraphicStream est une société française de « Business To Business » (B2B) spécialisée dans le développement Unity.

Le premier projet fut Arcane Tower defense (Windows phone), mais il n'a pas eu le succès escompté. GraphicStream s'est donc reconvertie dans le jeu vidéo pour les entreprises.

III-B - Serious Game

Un « jeu sérieux » (« sérious game ») mélange le sérieux de l'entreprise avec l'esprit ludique des jeux vidéo. Le but peut être :

- pédagogique ;

- informatif ;

- communicationnel ;

- marketing ;

- idéologique.

Cela permet de mieux maintenir l'attention du public, d'améliorer les conditions de travail et la sécurité au travail ou même de faciliter l'immersion dans celui-ci.

Dans l'exemple présenté, on voit la gare Montparnasse en 3D dans laquelle on peut sélectionner un point à atteindre. Le chemin menant à ce point sera parcouru en 3D.

III-C - Oculus Rift

L'Oculus Rift est un périphérique de réalité virtuelle financé par la foule à l'aide de KickStarter. Le célèbre créateur de Doom, John Carmack a toujours été enthousiasmé par cette technologie dans laquelle il s'est investi, notamment en améliorant l'algorithme de suivi des mouvements de la tête.

L'Oculus Rift est actuellement vendu 220 € plus 50 € pour les frais de port. Les envois sont faits chaque mois et il peut donc y avoir une attente.

Animation en format "youtube" non supportée.
Contenu uniquement consultable en ligne à cette adresse :
https://www.youtube.com/watch?v=RjNLvgqZgUI

III-D - IM Build

IM Build est un projet de jeu sérieux. Le développement a duré sept jours et a nécessité deux développeurs. Les outils utilisés sont Visual Studio 2013, Unity et Ocular Rift.

L'équipe a utilisé Unity et a profité de la possibilité d'acheter de nombreux modules trouvables sur le market place pour construire l'application.

III-E - Support de présentation

Animation en format "slideshare" non supportée.
Contenu uniquement consultable en ligne à cette adresse :
https://www.slideshare.net/slideshow/embed_code/28704848

IV - Build 3D Web and Desktop applications with C++11

Par Jean-Marc Le Roux (Aerys)

IV-A - Introduction

Jean-Marc Le Roux nous a présenté le framework en développement depuis quatre ans chez Aerys : Minko. Minko est un logiciel open source permettant le développement d'applications Internet et bureau 3D, en C++11.

Pour cela, quinze personnes travaillent sur ce projet permettant la création d'applications portables. Les plateformes visées sont : Linux, Windows, Mac OS X, Flash, Android, iOS, mais aussi les navigateurs Internet.

Minko propose tous les outils pour créer des applications facilement à travers d'éditeurs graphiques. Le framework est proposé en plusieurs versions, notamment une version « Studio » gratuite, open source disponible sous licence MIT.

De plus, Electronic Arts a déjà eu recours à ce moteur, pour le jeu « IronForce » et BigPoint songe utiliser Minko pour ses prochains développements.

IV-B - Fonctionnalités

Voici la liste des fonctionnalités de Minko :

- indépendant de la plateforme ;

- éditeur WYSIWYG ;

- bibliothèque de graphe de scène 3D ;

- composants et système de scripts ;

- physique (Bullet) ;

- moteur de rendu orienté données ;

- plus de 80 formats de fichiers 2D/3D supportés ;

- uber shaders (si besoin) ;

- chargement dynamique des ressources ;

- compression, simplification et streaming ;

- moteur de particules ;

- système de modules.

IV-C - Multiplateforme

Minko intègre son propre format de fichier d'effets, regroupant des shaders et des informations sur les variables à donner aux shaders. Ces fichiers d'effets peuvent dépendre de la plateforme exécutant le code et ainsi, être configurés de différentes façons pour chaque cible.

IV-C-1 - C++11

Minko repose sur du C++11. En effet, ce langage de programmation est un langage disponible sur de nombreuses plateformes. De plus, il est plus expressif et permet des optimisations spécifiques. Voici quelques-unes de ses caractéristiques :

- typage statique ;

- templates ;

- inlining ;

- gestion de la mémoire bas niveau (pas de ramasse-miettes, pouvant ralentir aléatoirement le programme).

La nouvelle version de 2011 a permis au C++ de rattraper son retard et même d'apporter des fonctionnalités appréciées des développeurs JavaScript :

- les lambdas (closures) :

// gère les signaux de la souris
auto mouseWheel = canvas->mouse()->wheel()->connect([&](input::Mouse::Ptr m, int h, int v)
{
distance += (float)v / 10.f;
});
// le callback est supprimé lorsque mouseWheel est défini à nullptr

- l'inférence de types ;

- les pointeurs intelligents (remplaçant le « garbage collector » tout en laissant le contrôle complet au développeur)

// met à jour la taille de notre texture cible de rendu lorsque le canvas est redimensionné
auto resized = canvas->resized()->connect({&](Canvas::Ptr canvas, unsigned int width, unsigned int height)
{
camera->component<PerspectiveCamera>()->aspectRatio((float)width / (float)height);

auto oldTarget = ppTarget;

// l'assignation de ppTarger détruira l'ancienne valeur car il n'y a plus aucune référence vers celui-ci :
// aucune fuite mémoire possible !
// le destructeur de Texture libèrera la mémoire GPU automatique
ppTarget = render::Texture::create(assets->context(), clp2(width), clp2(height), false, true);
ppTarget->upload();
ppData->set("backbuffer", ppTarget);
});

IV-C-2 - Intégration page Internet

Pour intégrer le code C++ dans la page Internet, Minko utilise emscripten transformant le code C++ en code JavaScript. De plus, il permet de transformer les appels OpenGL en appels WebGL. emscripten fournit un système de fichiers virtuel pour servir les ressources au client.

Le code produit par emscripten est optimisé (les closures sont compilées, par exemple) et peut même utiliser asm.js. Firefox obtient ainsi les meilleures performances.

Finalement, la compression de la scène permet de passer de 300 Mo de données à uniquement 8 Mo faisant que cela est raisonnable pour une application Internet.

IV-C-3 - Intégration Windows Store

Pour l'intégration Windows Store, il est nécessaire de transformer tous les appels à la bibliothèque OpenGL en appels DirectX 11, sans quoi l'application n'est pas acceptée. Pour cela, Minko utilise ANGLE (un projet utilisé par Chrome et Firefox pour le support de WebGL sur Windows). Ce projet permet de réimplémenter tous les appels OpenGL en appels DirectX 11, ainsi que de transformer le code GLSL en code HLSL. De plus, il apporte des gains de performances pour l'application sous Windows. Finalement, il permettra un support de Windows Phone 8.

IV-D - Retours sur le développement

IV-D-1 - Les bons points

Le C++11 est incroyable. Il est plus complexe que l'AS3 ou le JavaScript, mais aussi plus puissant. Les conteneurs standards (STL) sont dignes de confiance. Les pointeurs intelligents rendent la gestion de la mémoire aussi facile qu'avec un langage managé. Les développeurs n'ont toujours pas rencontré de fuite de mémoire jusqu'à présent.

Visual Studio et XCode sont de très bons EDI.

L'implémentation de Minko 3 sera beaucoup plus légère et tout aussi performante.

Les outils vagrant et premake fournissent un efficace système de compilation multiplateforme.

L'application fonctionne sur Windows, Mac, Linux, iOS, Android et WebGL sans aucune modification. Le support de iOS et Android n'a pas été testé mais devrait fonctionner directement.

Sur Firefox et grâce à asm.js, l'application Internet ne fonctionne que deux fois moins rapidement que les sur les autres plateformes.

IV-D-2 - Les mauvais points

Les applications compilées par emscripten sont très coûteuses en mémoire vive.

Minko n'est pas encore compatible avec le « Windows Phone 8 App Store » car Microsoft interdit l'utilisation de compilateur HLSL à la volée pour les applications mobiles.

IV-E - Support de présentation

Animation en format "slideshare" non supportée.
Contenu uniquement consultable en ligne à cette adresse :
https://www.slideshare.net/slideshow/embed_code/28672834

V - Project Anarchy

Par Alexandre Laurent

La présentation était une introduction aux outils de Havok : Project Anarchy. La présentation reprenait le tour d'horizon présent ici.

V-A - Support de présentation

Animation en format "slideshare" non supportée.
Contenu uniquement consultable en ligne à cette adresse :
https://www.slideshare.net/slideshow/embed_code/28746856

VI - Remerciements

Je remercie chaleureusement les organisateurs de cet événement ainsi que les invités qui nous ont présentés ces intéressantes solutions pour la création d'applications 3D.

Merci à f-leb pour sa relecture orthographique.