Eramet — at Brig.ht · 2024
Eramet Lithium Plant
A virtual visit of a lithium extraction plant, explorable in real-time 3D in the browser.
- Role
- Interactive front-end developer
- Stack
- WebGL, Three.js, GLSL, Vue.js
Eramet opened a lithium extraction plant and wanted the public to understand how it works without travelling to it. With the team at Brig.ht, we built a virtual visit of the site: a real-time 3D scene where each step of the extraction process can be explored.
What I did
- Implement UI interactive effects: 3D pins, panel animations, pulses
- Fullscreen view
- Interactive filters
- mini games
- Draco/Meshopt/KTX tooling
Challenges
The scene involves a collection of complex 3D meshes. We had to recreate partly the plant to get a simple, lightweight mesh that can run on the Web. Some scenes show the inside of the plant, thus needing separate scenes and transitions. Some custom shaders were added to depict the routing of the chemicals in the pipes and processing units. We also had to add a layer handling the mini-games and the global progress of the visitor as they play through them.