I built an interactive 3D Periodic Table that runs directly in the browser.
https://hiteshsahu.com/lab/periodic-table/
The goal was simple: make exploring chemical elements more visual and engaging than a static chart.
Each element is placed in a 3D environment. When you select one, you can:
-
View a detailed element texture
-
Explore a simplified atomic structure model
-
See key properties and basic information
-
Navigate smoothly using interactive camera controls
Instead of treating it as a traditional webpage, I approached it like a small interactive product. The focus was on clarity, responsiveness, and making the experience intuitive even in a 3D space.
There arev 2 Camera modes you can toggle between them using DatGui of simply be press of
-
C – Toggle Camera Mode, ESC – Exit Game Mode
-
W / ↑ – Forward
-
S / ↓ – Backward
-
A / ← – Left
-
D / → – Right
-
SPACE – Jump
-
SHIFT – Run
This project explores how interactive visualization can make complex information more accessible and engaging.
Would love to hear feedback, especially from educators, students, or anyone interested in interactive learning experiences.
#InteractiveLearning #Web3D #ProductEngineering #BabylonJS #EdTech #Frontend