Le modèle du cube de Rubik a été créé avec le logiciel Blender, mais Three.js a été utilisé pour afficher le modèle GLB sur le web.

Animation 3D

Amener la 3D sur le Web

Le projet 3D sur lequel je travaille actuellement s’intitule Diplomacy. Son histoire fait référence aux événements tragiques qui se produisent à travers le monde – ces nouvelles dramatiques qui, à force de se répéter quotidiennement, perdent leur valeur journalistique. Pourtant, dans les régions où ces problèmes surviennent, les souffrances persistent au quotidien, et les blessures restent ouvertes. Vous avez peut-être déjà aperçu un court extrait de cette animation dans le diaporama sur la page d’accueil de ce site. Cependant, ces extraits sont en cours de finalisation et seront progressivement affichés sur cette page, aux côtés de mes autres œuvres d’animation 3D.

Mais mon intérêt pour l’univers de l’animation 3D ne s’arrête pas là. En réalité, tout cela a commencé comme un Rubik’s Cube que l’on tient entre les mains au début d’un jeu apparemment simple. Un cube au centre de l’univers, où les plus grands projets 3D prennent naissance à partir de cette scène initiale. Quelques instants plus tard, toutes ces idées prennent vie dans ce monde en apparence simple. Pour mon projet de thèse de fin d’études, j’ai utilisé le logiciel Blender. Bien sûr, j’ai également eu recours à divers autres outils, tels qu’Adobe Premiere, Adobe Photoshop, Davinci Resolve, Adobe After Effects, et même Adobe Illustrator pour le compléter. Cependant, je ne veux pas m’arrêter là. J’ai encore le sentiment qu’il reste tant à accomplir et, honnêtement, je me sens seulement au début de mon parcours. C’est une voie que je souhaite réellement continuer à explorer.

De l’animation au Web : La puissance de la 3D

La 3D peut-elle transformer l’expérience du Web ? Je suis profondément passionné par ce domaine. À mon avis, les éléments 3D apportent quelque chose d’unique aux sites web, en leur conférant plus d’impact – de la profondeur. Avec les sites web en 3D, on peut observer un objet sous tous ses angles, naviguer dans un espace tridimensionnel ou même concevoir un objet qui apparaît dans une scène à partir d’un environnement. Ce sens de l’ambiguïté et du suspense rend l’espace plus mystérieux et, par conséquent, plus captivant. Les énigmes résolues, peu importe leur complexité, ne sont pas si intéressantes. Pour moi, l’aspect le plus important dans tout projet est de créer et de raconter une histoire. Que ce soit un conteneur dans Elementor WordPress, un diaporama, une animation ou un site web, chacun de ces éléments doit raconter une histoire.

En haut de cette page, vous pouvez voir un cube émerger d’un espace galactique. Ce cube a été conçu dans le logiciel Blender, puis importé sur cette page au format glb. Bien sûr, le cher JavaScript a également été utilisé pour compléter cette scène. Mais quelle est l’histoire de ce cube lumineux ? L’idée initiale était d’attribuer des effets d’émission à certaines parties du cube. Je voulais intégrer cet effet directement dans le fichier glb utilisé sur le site web. Ce processus s’est avéré très long et complexe. Finalement, j’ai opté pour une version entièrement basée sur JavaScript, que vous voyez ici. Tant le cube en haut que celui conçu avec JavaScript sont interactifs, et vous pouvez les manipuler avec votre souris – une interaction très simple et enfantine, n’est-ce pas ?

Cette page sera progressivement enrichie de nouveaux travaux dans mon portfolio. À mesure que le projet Diplomacy avance, j’ajouterai progressivement de nouvelles sections de celui-ci sur cette page.

Ici, Three.js et quelques autres bibliothèques JavaScript ont été utilisés pour implémenter complètement le cube de Rubik avec un effet de bloom.