Jeux de fou !

Des jeux, des prototypes, des revues Web, du fun, de la passion !

A-Frame Web VR Engine

Découvert récemment, A-Frame, un petit moteur 3D Web VR, qui permet de faire de petite application HTML5/JS de façon assez simple, en comparaison avec des bibliothèque de codage pur tel que THREE.js.

Fonctionnement

Grâce aux exemples proposés sur leur site, on peu rapidement se rendre compte de la façon dont on va aborder le codage avec ce moteur. Pas d’UI ici, mais une majorité de codage avec un système de balise type HTML.

C’est assez ingénieux, car en utilisant les propriétés d’un langage à balise (Markup Language) On visualise facilement dans le code la structure de notre univers 3D.

Avec la balise <a-scene>, et ses différents attributs on paramètre donc notre scène 3D, avec son type de rendu et tout un tas d’autres options possibles. Puis on va imbriquer des balises de type :

  • <a-assets> pour déclarer tout un tas de ressources, audio, vidéo, images, etc. en imbriquant successivement les balises <a-asset-item> pour chaque ressource. Via l’attribut SRC on indique le chemin de la ressource et via l’ID on lui donne un identifiant qui servira à l’appeler au besoin. Classique !
  • <a-sky> permet de créer un ciel à partir d’une image 360° ou d’une vidéo 360° par exemple.
  • <a-entity> selon les attributs utilisés, permettra l’intégration et le groupement d’objets 3D, d’objets de contrôle ou d’événement tels que les camera rig, hand controller, mouse controller, etc.

Ainsi en implémentant différents script JS dans votre en-tête, vous pourrez ajouter tout un tas de gestionnaires, pour transformer petit à petit votre premier viewer 3D en un petit 3D à explorer avec des casque tels que l’OCULUS QUEST, le VIVE, le RIFT, etc.

La création de jeux

En poussant un peu l’exploration et l’apprentissage de ce petit moteur, je suis assez convaincu par le fait que l’on puisse proposer de petits jeux VR sympas et des expériences originales.

Il n’y a qu’à voir A-BLAST, un des jeux exemples proposés sur le site de A-FRAME. Bon à ce niveau, faut quand même passer du temps à coder, mais bon déjà on gagne pas mal de temps avec la mise en place de l’univers 3D !

A-Frame moteur 3D Web VR

Découvrez l’univers de A-FRAME, moteur de création 3D Web VR

Au Suivant Poste

© 2022 Jeux de fou !

Thème par Anders Norén Optimisé & personnalisé par Aurélien Foisse