Détails du projet
Point de départ
Les Three.js Journey Challenges sont des défis mensuels de la communauté Three.js Journey, chaque participant explorant un thème imposé en 3D temps réel - ici le vingtième, "Cozy place". La direction s'est resserrée autour d'un lieu précis, cadré comme une photo avant même la première ligne de code : un salon années 70 avec une fosse de conversation, construit ensuite prop par prop autour de ce cadre fixé.
La problématique
Au-delà de l'exercice de style, ce challenge est l'occasion d'aller plus loin que d'habitude sur trois fronts : un vrai pipeline Blender vers WebGL, l'éclairage d'une scène complète (practicals émissifs, bake vs. temps réel), et surtout l'analyse audio en direct - faire réagir un rendu 3D à de la musique de façon qui semble juste, pas juste "qui clignote fort".
Conception
La fosse en velours vert est le sujet du cadre, pensée pour deux usages - moments à plusieurs autour de la platine, ou repli solo sur les coussins. Un détail signature : une figurine de chat sculptée par l'artiste WENNA, modélisée à partir de photos de la pièce réelle avec son autorisation, créditée dans le projet. La platine n'est pas un décor : cliquée, elle joue vraiment un morceau, et la pièce entière - rendue en nuage de points plutôt qu'en surfaces pleines - se révèle au passage de la souris comme balayée par une lampe torche, avant de se mettre à réagir à la musique elle-même.
Mise en œuvre
React Three Fiber et Three.js (drei, postprocessing pour bloom/vignette/grain, n8ao pour l'occlusion ambiante), Vite pour le build. Les assets sont modélisés/kitbashés sous Blender puis exportés en glb optimisé. La réactivité audio s'appuie sur la Web Audio API native (pas de librairie externe) : détection de hauteur par classe de note (12 notes chromatiques), avec la part relative de chaque note dans l'énergie totale plutôt qu'un seuil absolu - calé en écoutant le morceau en direct sur plusieurs passes pour que la réaction suive vraiment la musique au lieu de juste s'allumer sur le volume.
Un projet comme celui-ci ?
contact@valentingassend.comEssayez-moi 3 jours au forfait sur un composant ou un prototype de pitch : non facturé si le résultat ne convient pas. Réponse sous 72 h.
Voir les offres et les tarifs