Science (Naturfag)

Interactive 3D pages I made for 8th-grade natural science (naturfag), set along the Helgeland coast in northern Norway. Each one is a single self-contained HTML file: open it in the browser, click around, and do the missions.

All pages are bilingual: use the NO / EN button in the top right corner. They need no server, login or internet connection once loaded, so they also run offline. Best on a laptop or tablet; the files are 1.6–5.3 MB.

Screenshot of the Cells page Live

Cells

Fly into a 3D plant cell and animal cell and find out what each part does.

  • → Plant cell and animal cell in 3D
  • → Compare, processes, guided tour and quiz

Norwegian: Cellene · 5.3 MB

Cells three.js

Cells

Live

A 3D “cell HUD”: explore a plant cell and an animal cell, zoom in on the nucleus, chloroplasts and mitochondria, compare the two cell types, follow photosynthesis and cellular respiration, and finish with a quiz. (Norwegian title: Cellene. File size 5.3 MB.)

Features

  • → Plant cell and animal cell in 3D
  • → Compare, processes, guided tour and quiz

Tech Stack

Cells three.js
Screenshot of the Toxin Elevator page Live

Toxin Elevator

Ride the food chain from plankton to the white-tailed eagle and watch a toxin build up.

  • → Biomagnification and bioaccumulation
  • → Sliders for emissions, time and a ban

Norwegian: Miljøgift-heisen · 2.6 MB

Ecology Toxins three.js

Toxin Elevator

Live

Biomagnification as an elevator: each floor of the marine food chain concentrates the toxin (PCB or mercury) further. Adjust emissions and time, ban the substance, and see bioaccumulation inside a single cod. The numbers come from a simplified model. (Norwegian title: Miljøgift-heisen. File size 2.6 MB.)

Features

  • → Biomagnification and bioaccumulation
  • → Sliders for emissions, time and a ban

Tech Stack

Ecology Toxins three.js
Screenshot of the Red List page Live

Red List

27 real species from the Norwegian Red List 2021, from the open sea to the mountains.

  • → 27 species with photos and threat categories
  • → Explore, impacts and missions

Norwegian: Rødlista · 5.2 MB

Biodiversity three.js

Red List

Live

A stylised 3D landscape of the Helgeland coast from sea to mountains with 27 species from the Norwegian Red List for Species 2021. Find out how threatened they are, why, and what helps. (Norwegian title: Rødlista. File size 5.2 MB.)

Features

  • → 27 species with photos and threat categories
  • → Explore, impacts and missions

Tech Stack

Biodiversity three.js
Screenshot of the Food Web page Live

Food Web

Who eats whom along the coast, and what happens when one species disappears?

  • → Habitats and trophic levels
  • → Simulate removing a species

Norwegian: Næringsnettet · 4.2 MB

Ecology three.js

Food Web

Live

A coastal food web in 3D: seaweed and kelp, snails and sea urchins, herring, cod, seabirds and seals. Explore who eats whom, watch energy move through the web and simulate what happens when one species is removed. (Norwegian title: Næringsnettet. File size 4.2 MB.)

Features

  • → Habitats and trophic levels
  • → Simulate removing a species

Tech Stack

Ecology three.js
Screenshot of the Energy Chain page Live

Energy Chain

Follow the energy from the sun through the food chain and see where most of it goes.

  • → Energy flow and the 10 % rule
  • → Inside the cell: photosynthesis and respiration

Norwegian: Energikjeden · 4.3 MB

Energy Ecology three.js

Energy Chain

Live

All energy in the sea starts with the sun. Follow it from phytoplankton up the chain, see how most of it is lost as heat or goes to decomposers at each step, and look inside the cell at photosynthesis and respiration. (Norwegian title: Energikjeden. File size 4.3 MB.)

Features

  • → Energy flow and the 10 % rule
  • → Inside the cell: photosynthesis and respiration

Tech Stack

Energy Ecology three.js
Screenshot of the Wind Power page Live

Wind Power

Take a wind turbine apart, then decide where a wind farm should go.

  • → Turbine parts and the energy chain
  • → Wind and power, build a wind farm

Norwegian: Vindkraft · 3.4 MB

Energy Sustainability three.js

Wind Power

Live

From wind to electricity: explore the parts of a wind turbine, play with wind speed and power, then build a wind farm and weigh energy against reindeer grazing, eagles and people living nearby. (Norwegian title: Vindkraft. File size 3.4 MB.)

Features

  • → Turbine parts and the energy chain
  • → Wind and power, build a wind farm

Tech Stack

Energy Sustainability three.js
Screenshot of the Atom Builder page Live

Atom Builder

Build all 118 elements from protons, neutrons and electrons and watch the element change.

  • → Build atoms, isotopes and ions in 3D
  • → Periodic table, atomic models and missions

Norwegian: Atombyggeren · 1.6 MB

Atoms Chemistry three.js

Atom Builder

Live

A 3D atom lab: add protons, neutrons and electrons and see the element, isotope and ion change as you go. Explore the periodic table, switch between the shell model and the electron cloud, and follow the history of atomic models. (Norwegian title: Atombyggeren. File size 1.6 MB.)

Features

  • → Build atoms, isotopes and ions in 3D
  • → Periodic table, atomic models and missions

Tech Stack

Atoms Chemistry three.js

Credits

The 3D scenes use three.js and GSAP. Their MIT licence notices are kept inside each page. Species facts and threat categories in the Red List page come from Norsk rødliste for arter 2021 (Artsdatabanken); each page lists its own sources under the Sources button.

Red List photo credits (27 photos, via Wikimedia Commons)