Song explorer présente INSIDE THE MUSIC, une expérience 3D de code 3D Three.js.

L’importante campagne “Détruire la nature, c’est détruire la vie”.
mars 26, 2019
Les tendances Internet, du 28 février au 28 mars 2019.
mars 29, 2019
Show all

Dans cette expérience multimédia développée avec l’extension du code de script Java Three.js, l’utilisateur, avec un simple navigateur, pourra interagir avec la musique dans un environnement virtuel et interagir avec les pistes musicales afin de découvrir comment il a été produit.

Pour interagir avec le projet, cliquez ici!

Three.js est une bibliothèque JavaScript inter-navigateurs et une API (Application Programming Interface) utilisée pour créer et afficher des graphiques 3D animés dans un navigateur Web. Three.js utilise WebGL. Le code source est hébergé dans un référentiel sur GitHub.

Three.js permet la création d’animations 3D accélérées par GPU (Graphical Processing Unit) en utilisant le langage JavaScript dans le cadre d’un site web sans faire appel à des plugins propriétaires. C’est possible grâce à l’avènement de WebGL.

Les bibliothèques de haut niveau telles que Three.js ou GLGE, SceneJS, PhiloGL ou plusieurs autres bibliothèques permettent d’écrire des animations 3D complexes qui s’affichent dans le navigateur sans l’effort requis pour une application autonome traditionnelle ou un plugin.

Three.js a d’abord été publié par Ricardo Cabello à GitHub en avril 2010. Les origines de la bibliothèque remontent à son implication dans la démoscène au début des années 2000. Le code a d’abord été développé en ActionScript, puis en 2009 porté sur JavaScript. Dans l’esprit de Cabello, les deux points forts du transfert vers JavaScript n’étaient pas de compiler le code avant chaque indépendance d’exécution et de plate-forme. Avec l’avènement de WebGL, Paul Brunt a pu ajouter le rendu assez facilement car Three.js a été conçu avec le code de rendu en tant que module plutôt que dans le noyau lui-même. Les contributions de Cabello incluent la conception de l’API, CanvasRenderer, SVGRenderer et la responsabilité de fusionner les validations par les différents contributeurs dans le projet.

Le deuxième contributeur en termes de commits, Branislav Ulicny a commencé avec Three.js en 2010 après avoir posté un certain nombre de démos WebGL sur son propre site. Il voulait que les capacités de rendu WebGL dans Three.js dépassent celles de CanvasRenderer ou SVGRenderer. Ses contributions majeures concernent généralement les matériaux, les shaders et le post-traitement.

Peu de temps après l’introduction de WebGL 1.0 sur Firefox 4 en mars 2011, Joshua Koo est arrivé. Il a construit sa première démo Three.js pour le texte 3D en septembre 2011. Ses contributions concernent fréquemment la génération de géométrie.

Il y a plus de 900 contributeurs au total.

Three.js incluent les fonctionnalités suivantes:

  • Effets: Barrière d’anaglyphe, de louche et de parallaxe.
  • Scènes: ajouter et supprimer des objets au moment de l’exécution; brouillard
  • Caméras: perspective et orthographique; contrôleurs: trackball, FPS, chemin et plus
  • Animation: armatures, cinématique vers l’avant, cinématique inverse, morph et keyframe
  • Lumières: ambiantes, directionnelles, ponctuelles et ponctuelles; ombres: lancer et recevoir
  • Matériaux: Lambert, Phong, ombrage lisse, textures et plus
  • Shaders: accès à toutes les fonctionnalités GLSL (OpenGL Shading Language): flare d’objectif, passe de profondeur et bibliothèque complète de post-traitement
  • Objets: mailles, particules, sprites, lignes, rubans, os et plus – tous avec niveau de détail
  • Géométrie: plan, cube, sphère, tore, texte 3D et plus; modificateurs: tour, extrusion et tube
  • Chargeurs de données: binaire, image, JSON et scène
  • Utilitaires: ensemble complet de fonctions temporelles et mathématiques 3D, y compris le tronc, la matrice, le quaternion, les UV et plus
  • Exportation et importation: utilitaires pour créer des fichiers JSON compatibles Three.js depuis: Blender, openCTM, FBX, Max et OBJ
  • Support: la documentation de l’API est en construction, forum public et wiki en pleine opération
  • Exemples: Plus de 150 fichiers d’exemples de codage plus polices, modèles, textures, sons et autres fichiers de support
  • Débogage: Stats.js, WebGL Inspector, Three.js Inspector
  • Réalité virtuelle: accéder à WebVR
  • Three.js s’exécute dans tous les navigateurs pris en charge par WebGL 1.0.

Three.js est disponible sous la licence MIT.

Facebook
Twitter
Linkedin0
Google+0
GMail0
SMS0
Whatsapp0
Positive SSL