Cosmic Playground
  • Predict
  • Play
  • Explain

Instructor notes: Electromagnetic Spectrum: Light Beyond Visible

Public notes (v0.2 policy). Not linked from primary navigation.

Exhibit: /cosmic-playground/exhibits/em-spectrum/

Overview

Navigation

This guide is instructor-facing Student demo: /play/em-spectrum/
Main code: apps/demos/src/demos/em-spectrum/main.ts
Markup/styles: apps/demos/src/demos/em-spectrum/index.html, apps/demos/src/demos/em-spectrum/style.css
Physics helpers: packages/physics/src/photonModel.ts (constants in packages/physics/src/astroConstants.ts)
Data: packages/data-spectra/src/* (emSpectrumTelescopes, emSpectrumObjects, atomicLines, molecularBands)

Where to go next

  • Model + math + assumptions: model.md
  • In-class activities (MW + Friday lab + station version): activities.md
  • Assessment bank (clickers + short answer + exit ticket): assessment.md
  • Future enhancements (planning backlog): backlog.md

Why this demo exists

Why This Matters In astronomy we mostly observe photons, not the objects directly. This demo helps students build a correct mental model of what “different kinds of light” means: same physics, different wavelength $\lambda$, frequency $\nu$, and photon energy $E$. That matters because the Universe looks different in different bands, and because what you can measure depends on the detector you build.

This demo is designed to reinforce the ASTR 101 throughline: observable → model → inference.

  • Observable: the wavelength slider (and band buttons) change what part of the spectrum you are “observing.”
  • Model: the wave + photon relationships connect wavelength to frequency and energy.
  • Inference: different bands reveal different physical conditions (cold dust vs hot plasma, etc.), so multi-wavelength observations give a more complete story.

Learning goals (ASTR 101)

By the end of this demo, students should be able to:

  • State the core relationships qualitatively: longer wavelength ↔ lower frequency ↔ lower photon energy.
  • Recognize that visible light is a tiny slice of the electromagnetic spectrum.
  • Explain why we need different telescopes/detectors for different wavelength bands.
  • Predict which bands are best for “cold dust,” “hot gas,” or “violent events,” at a basic descriptive level.

Learning goals (ASTR 201 stretch)

Students should be able to:

  • Use the model equations to convert between $\lambda$, $\nu$, and $E$ (with units).
  • Compare photon energies across bands (e.g., “how many radio photons equal one X-ray photon?”).
  • Explain why the demo uses CGS internally (cm, erg) while reporting frequency in Hz.

10–15 minute live-teach script (projector)

  1. Start in the visible band. Click Visible and ask: “Is visible the ‘middle’ of what exists, or just what our eyes evolved to detect?” (Prediction before observation.) Then zoom out with the full slider range to make the “tiny slice” point concrete.

  2. Prediction: ordering game. Ask students to rank (no calculations): radio, infrared, visible, X-ray from lowest to highest photon energy. Then use the slider + energy readout to check the ordering.

  3. Connect the relationships (one idea at a time).

    • Move the slider to longer wavelengths and ask: “What must happen to frequency if the speed of light stays the same?”
    • Then ask: “If frequency drops, what happens to photon energy?” Use the live updating readouts to confirm each step.

  4. Detector reality check (measurement constraints). Click bands that are familiar (Radio → Microwave → Visible → X-ray) and ask: “Could you build a detector for this band and use it from the ground?” Use this to motivate atmosphere + instrument design (space telescopes for UV/X-ray/gamma; radio can pass through clouds; infrared often needs cooled detectors).

  5. Astronomy examples (inference). Use the examples/objects mode to show that “different light = different physics.” Ask: “If you want to see through dust to star-forming regions, which band would you choose?” Then “What band reveals extremely hot gas around black holes?”

  6. Wrap with Observable → Model → Inference. Say explicitly: “We measure photons at some wavelength; the physics model tells us what energies/temperatures/processes could produce them; then we infer what’s happening in places we can’t touch.”

Misconceptions + prediction prompts

Use these as quick “wrong-model first” prompts:

  • Misconception: “Radio waves are sound.”
    Prompt: “If radio is ‘sound,’ would it travel through space?” Then emphasize: radio is light (electromagnetic radiation), not pressure waves.

  • Misconception: “Infrared = heat (and only heat).”
    Prompt: “Is visible light ‘not energy’ because it isn’t called heat?” Reinforce: all EM radiation carries energy; IR is often associated with thermal emission because many warm objects emit strongly there.

  • Misconception: “X-rays and gamma rays are fundamentally different kinds of stuff.”
    Prompt: “What changes continuously as you slide from X-ray to gamma?” Emphasize: same physics; categories are teaching conventions based on wavelength/energy ranges.

  • Misconception: “We see ‘most’ of the light.”
    Prompt: “If the spectrum were a piano keyboard, how many keys would your eyes cover?” Then use the full slider range to correct the intuition.

Suggested connections to other demos

  • Blackbody radiation: temperature shifts the peak wavelength; this demo supplies the spectrum vocabulary needed to interpret “hotter → bluer peak.”
  • Telescope resolution: diffraction limit depends on wavelength; this demo helps students accept that “same telescope” behaves differently across bands.

Activities

Navigation

MW Quick (3–5 min)

Type: Demo-driven
Goal: Force “longer wavelength → lower energy” to become a prediction, not a memorized phrase.

  1. Open the student demo: /play/em-spectrum/
  2. Click Visible. Then use the slider to choose:
    • a wavelength near the red end of visible, and
    • a wavelength near the blue/violet end of visible.
  3. Prediction prompt (10–20 s): “Which choice should have higher photon energy?”
  4. Reveal by reading the Energy value for both. Name the relationship out loud: shorter wavelength → higher photon energy.
  5. One-sentence debrief: “Energy per photon is not brightness; it’s ‘how energetic each photon is.’”

MW Short (8–12 min)

Type: Demo-driven (pairs)
Goal: Connect band names to wavelength scale and measurement constraints (detectors/telescopes).

Student task (pairs): Complete the “band map” table (one row per band).

BandOne representative wavelength (with unit)One representative photon energy (with unit)One thing we can see in this bandOne detector/telescope example
Radio
Infrared
Visible
X-ray or Gamma

Instructions:

  1. Use the band labels (Radio/IR/Visible/UV/X-ray/Gamma) to jump around.
  2. Use the unit dropdowns to express:
    • wavelength in a convenient unit (nm, $\mu\mathrm{m}$, mm, m),
    • energy in eV/keV/MeV as appropriate.
  3. Use the Telescopes tab and Objects tab to collect one example per band.

Synthesis prompt (2 minutes): “What changes across the spectrum: the physics, or our measurement tools?”
Expected: physics is continuous; our detectors and atmosphere constraints differ by band.

Friday Lab (20–30+ min)

Type: Demo-driven investigation (small groups)
Goal: Practice Observable → Model → Inference by choosing the right band for a science question and defending it with evidence.

Setup (2–3 min)

  • Each group picks (or is assigned) one science question:
    • Find cold dust in a star-forming region.
    • Detect hot plasma around a black hole / in a galaxy cluster.
    • Map neutral hydrogen gas in a galaxy.
    • See through dust to reveal protostars.

Investigation (15–20 min)

For your question:

  1. Use the demo to identify the best band(s) (you may choose more than one).
  2. Gather evidence from the demo:
    • the band’s wavelength/energy scale (readouts),
    • an example object in that band (Objects tab),
    • an example telescope/detector (Telescopes tab).
  3. Write a claim–evidence–reasoning paragraph:
    • Claim: “We should observe in ____ because …”
    • Evidence: numbers from the demo + object/telescope examples
    • Reasoning: connect the band to the physical conditions you want to probe

Share-out (5 min)

Each group gives a 60-second pitch: band choice + one key piece of evidence + one limitation (e.g., “needs space telescope”).

Station version (6–8 min)

Station card: EM Spectrum (6–8 minutes) Artifact: a completed “spectrum card” for one band.

  1. Choose (or you’re assigned) one band: Radio / IR / Visible / UV / X-ray / Gamma.
  2. Use the demo to record:
    • one representative wavelength (with unit),
    • the corresponding photon energy (with unit),
    • one object example (Objects tab),
    • one telescope/detector example (Telescopes tab).
  3. Write one sentence:
    • “This band is good for observing ____ because ____.”

Word bank + sanity checks Word bank:

  • Wavelength $\lambda$: “size” of the wave; longer $\lambda$ $\to$ lower photon energy.
  • Photon energy: energy per photon (not the same thing as brightness).
  • Band names: labels we give to wavelength ranges (radio → gamma).

Key relationship (photon energy scaling):

$$E \propto \frac{1}{\lambda}$$

Sanity checks:

  • Ordering: Radio (lowest energy) → … → Gamma (highest energy).
  • Shorter wavelength should correspond to larger energy readouts.
  • Use convenient units: nm/$\mu\mathrm{m}$/mm/m for $\lambda$; eV/keV/MeV for energy.

Assessment

Navigation

Clicker questions (with distractors + explanation)

Clicker 1 — What changes when wavelength increases?

Demo setup: open /play/em-spectrum/, start in Visible.

Question: If you move the slider to a longer wavelength, what happens to frequency and photon energy?

A. Frequency increases; photon energy increases
B. Frequency increases; photon energy decreases
C. Frequency decreases; photon energy decreases
D. Frequency stays the same; photon energy stays the same

Correct: C
Why: The demo encodes $c=\lambda\nu$ (so longer $\lambda$ means smaller $\nu$) and $E=h\nu$ (so smaller $\nu$ means smaller $E$).
Misconception targeted: “Energy depends on wavelength in the opposite way.”

Clicker 2 — Red vs blue photon

Demo setup: stay in Visible; compare a red-end wavelength vs a blue/violet-end wavelength.

Question: Which choice corresponds to higher photon energy?

A. Red end of visible
B. Blue/violet end of visible
C. They are equal energy
D. It depends on brightness, not wavelength

Correct: B
Why: Shorter wavelength ↔ higher frequency ↔ higher photon energy.
Misconception targeted: “Red is more energetic because it ‘feels hotter’ in everyday contexts.”

Clicker 3 — Same physics across categories

Demo setup: click Radio, then click X-ray.

Question: Which statement is most accurate?

A. Radio and X-rays are fundamentally different phenomena (not both “light”).
B. They are the same physics; they differ mainly in wavelength/frequency/energy.
C. Radio is sound waves; X-rays are light waves.
D. X-rays travel faster than radio waves.

Correct: B
Why: They are both electromagnetic radiation; $c$ is the same in vacuum. Categories are teaching conventions.
Misconception targeted: “Radio is sound / different kind of wave.”

Clicker 4 — Where is the CMB?

Demo setup: open the Objects tab and click the object labeled CMB (if visible). Alternatively, click Microwave and note the wavelength scale.

Question: The Cosmic Microwave Background is primarily observed in which band?

A. Visible
B. Ultraviolet
C. Microwave
D. Gamma-ray

Correct: C
Why: The CMB’s peak today is in the microwave band (the demo’s object card and wavelength range support this).
Misconception targeted: “Most important astronomy is in visible light.”

Clicker 5 — Choosing a telescope for a wavelength

Demo setup: pick a wavelength around $10,\mu\mathrm{m}$ (Mid-IR scale) and then open the Telescopes tab.

Question: Which telescope is designed for infrared observations?

A. Chandra
B. JWST
C. Fermi
D. (Trick) Any telescope works equally well

Correct: B
Why: Different detectors are built for different bands; the demo’s telescope cards list their wavelength ranges.
Misconception targeted: “A telescope is a telescope; wavelength doesn’t matter.”

Clicker 6 — Photon energy vs “brightness”

Demo setup: compare Radio vs Gamma.

Question: Which statement is correct?

A. Radio sources are always dim because radio photons are low-energy.
B. Gamma-ray sources are always bright because gamma photons are high-energy.
C. Photon energy and brightness are different; a source can be bright in radio with many low-energy photons.
D. Brightness depends only on wavelength.

Correct: C
Why: Photon energy is per photon ($E=h\nu$). Brightness also depends on how many photons arrive and how they are distributed in time/space.
Misconception targeted: “High-energy photons automatically mean brighter sources.”

Short-answer prompts

  1. In one paragraph: explain why we need space telescopes for UV/X-ray/gamma astronomy but can do much of radio astronomy from the ground.
  2. Describe the difference between “higher-energy photons” and “brighter light” using an example from the demo.
  3. The visible band is narrow. What does that imply about what our eyes can and cannot tell us about the Universe?
  4. Choose one object from the demo’s Objects tab and explain why it is best observed in the band(s) listed.

Exit ticket (3 questions)

  1. If wavelength increases, what happens to frequency? (One sentence.)
  2. Which has higher photon energy: infrared or ultraviolet? (One sentence.)
  3. Name one reason astronomers build different telescopes for different wavelength bands.

Model notes (deeper)

Navigation

Links Student demo: /play/em-spectrum/
Model code: demos/_assets/em-spectrum-model.js
UI/visualization code: demos/em-spectrum/em-spectrum.js

What the demo is modeling (big picture)

This demo is not a “simulation” in the same sense as the orbit demos. It is a unit-aware calculator + lookup scaffold that helps students connect three ways of describing the same electromagnetic radiation:

  • Wavelength $\lambda$ (how long the wave is),
  • Frequency $\nu$ (how many cycles per second),
  • Photon energy $E$ (how much energy one photon carries).

The interactive piece (slider + band buttons + unit toggles) is there to make scaling relationships feel real: changing one representation forces consistent changes in the others.

Units + conventions used in the code

The shared model utilities in demos/_assets/em-spectrum-model.js use:

  • Wavelength in centimeters (cm) internally.
  • Frequency in Hertz (Hz = 1/s).
  • Photon energy in erg (CGS energy unit) internally, with display conversion to eV/keV/MeV or Joules.

The demo uses CGS constants:

  • $c = 2.99792458\times10^{10}\ \text{cm/s}$
  • $h = 6.62607015\times10^{-27}\ \text{erg s}$
  • $1\ \text{eV} = 1.602176634\times10^{-12}\ \text{erg}$

Band boundaries are teaching conventions (approximate wavelength ranges) implemented as fixed cutoffs in cm.

Key relationships to foreground (with meaning + units)

Wave relationship: $c = \lambda \nu$

$$c = \lambda \nu$$

Let’s unpack each piece:

  • $c$ is the speed of light in vacuum (cm/s).
  • $\lambda$ is wavelength (cm).
  • $\nu$ is frequency (1/s = Hz).

What this equation is really saying: for light, wavelength and frequency trade off. If you increase $\lambda$, $\nu$ must decrease so their product stays $c$.

Sanity checks

  • Units: (cm)·(1/s) = cm/s ✓
  • Scaling: if $\lambda$ doubles, $\nu$ halves.

Photon relationship: $E = h\nu = hc/\lambda$

$$E = h\nu = \frac{hc}{\lambda}$$

Let’s unpack each piece:

  • $E$ is energy per photon (erg).
  • $h$ is Planck’s constant (erg·s).
  • $\nu$ is frequency (1/s).
  • $c$ is the speed of light (cm/s).
  • $\lambda$ is wavelength (cm).

What this equation is really saying: shorter wavelengths correspond to higher-energy photons, even if the total brightness (number of photons) is a separate question.

Sanity checks

  • Units: (erg·s)·(1/s) = erg ✓
  • Scaling: if $\lambda$ gets $10\times$ smaller, $E$ gets $10\times$ larger.

Assumptions, limitations, and sanity checks

  • These relationships assume propagation in vacuum (good approximation for most astronomy contexts).
  • The “radio / IR / visible / UV / X-ray / gamma” boundaries are approximate conventions; the demo uses fixed cutoffs for teaching.
  • The demo is about photon energy, not intensity. A radio source can be extremely bright (many low-energy photons).

Backlog

Navigation

P0 (blocking / correctness / teachability)

  • Docs correctness: verify the student-facing demos/em-spectrum/README.md matches the current UI (Objects/Telescopes panels, unit dropdowns) and update any mismatches.
  • Classroom reliability: add a short “if the tab grids don’t load” troubleshooting note (likely data load order) to the instructor guide.
  • Assessment alignment: convert the 6 clickers into a one-page “rapid clicker sequence” (setup → ask → reveal) for live use.

P1 (important)

  • Atmosphere constraint story: add an optional mini-section explaining why some bands need space-based observatories (tie to the telescope cards).
  • Band boundary clarity: add a small “boundaries are conventions” callout in the student demo (or README) so students don’t treat categories as different physics.
  • More object/telescope exemplars: consider expanding demos/em-spectrum/object-data.js and demos/em-spectrum/telescope-data.js (if needed) to better cover course-relevant examples.

P2 (nice to have)

  • Visualization upgrades (from README ideas): wavelength/frequency wave animation; log vs linear scale toggle; atmospheric transmission overlay.
  • Learning mode: “quiz mode” for band identification and unit-conversion practice.