Visual Learner

Interactive 3D explainers for science and engineering. Pick a subject, play with the idea, then read the explanation.

Live site: https://turnscience.com/

Every topic is a single self-contained web page: a full-screen 3D scene you can orbit, a small control dock, live readouts, and an "Explain this step" panel for the full story.

Subjects

Subject	Topics
Biology	Exome Lab: Find the Variant, Inside a Cell: The Parts and Their Jobs
Math	Fourier Series: Waves from Circles, Binary Numbers: Counting with Two Digits
Physics	Wave Interference: Two Ripples, Boiling Point: Why Altitude Lowers It
Electronics	The RC Circuit: Charging a Capacitor, Binary Numbers: Counting with Two Digits, The CPU: What Is Inside the Chip
Aerospace	Orbits: The Hohmann Transfer
Chemistry	Molecular Shapes: Why Molecules Bend, Boiling Point: Why Altitude Lowers It, States of Matter: Solid, Liquid, Gas
Astronomy	Moon Phases: Why the Moon Changes Shape, Seasons: Why Summer Is Warm
Earth & Environment	Boiling Point: Why Altitude Lowers It, Seasons: Why Summer Is Warm, The Water Cycle: Sea, Sky and Back, Plate Boundaries: Ridges, Mountains and Faults
Engineering	Levers and Pulleys: Trading Distance for Force, Trusses: Why Bridges Use Triangles
Materials	States of Matter: Solid, Liquid, Gas
Computer Science	Binary Numbers: Counting with Two Digits, The CPU: What Is Inside the Chip
Statistics & Data	coming soon
Health & Medicine	Exome Lab: Find the Variant
Neuroscience	coming soon

The landing page builds itself from topics.json.

Every subject has one fixed 3D environment shared by all its topics (Biology is a wet lab). The environment, camera, effects and sound live in shared/, so improving them upgrades every topic of that subject at once. See docs/ENVIRONMENTS.md.

Run it locally

No build step. Any static file server works.

npm run serve        # http://localhost:8844
npm run validate     # checks topics.json and every topic page

If you do not use npm: node scripts/serve.mjs 8844, or any static file server on the repository folder.

Opening index.html straight from disk shows the topic pages but not the landing page, because browsers block fetch on file://.

Repository layout

.
├── index.html            landing page, renders topics.json
├── topics.json           manifest: categories and topics
├── 404.html
├── <category>/<topic>/   one self-contained index.html per topic
├── templates/topic/      starter page for a new topic
├── shared/               environments.js (one fixed environment per subject), stage.js, sound.js
├── docs/                 topic guide and content policy
└── scripts/validate.mjs  manifest and page checks (also run in CI)

Contributing

New topics and fixes are welcome. Start with CONTRIBUTING.md, then the topic guide and the content policy.

Hosting

GitHub Pages, served from the main branch root. The .nojekyll file turns off Jekyll processing.

License

Code is MIT, see LICENSE. Explanatory text and diagrams are CC BY 4.0, see docs/CONTENT_POLICY.md.

Educational and schematic. Nothing here is medical, engineering or safety advice.