Andreas Siess

Objective & Framework: This project is being developed in co-creation with StR Martin Blank as an extension of a school experiment that uses a self-built spectrometer to identify the elements present in spectral lamps.
The experiment is currently being piloted in upper-level secondary physics classes in Bavaria, and initial feedback from teachers has been very promising.

At present, the Max Planck Society provides a guide for constructing a simple spectrometer using mostly everyday materials and a smartphone:
https://www.ipp.mpg.de/handyspektrometer.
(The only component not typically found in every household is a transmission diffraction grating with 1000 lines/mm, which can be obtained online.)

Building on this guide, my friend Martin developed a complete didactic concept for a teaching unit in upper-level secondary education (’Gymnasiale Oberstufe in Bayern‘). He approached me with the idea of creating an application that would allow students to extract brightness values from photographs of their spectra.

While the Max Planck Society provides a lot of guidelines in terms of hardware, an actual tool to measure the recorded images is missing. Therefore an idea was born: We create one ourselves!
After some discussion and brainstorming, we expanded this idea into a more comprehensive concept for an app that not only extracts intensity values from the images but also automatically generates a visual histogram.

In practice, students are provided with two spectral lamps for testing. The elemental composition of Lamp 1 is known (e.g., helium), while that of Lamp 2 is unknown to them.
They begin by recording the spectrum of Lamp 1, resulting in a histogram in which the x-axis initially represents pixel values. This axis must then be shifted and scaled to correspond to actual wavelengths.
To facilitate this calibration process, the application allows the user to define a remap function (“calibration function”) that maps pixel positions to wavelength values.

This function takes the shape of

λ(x) = m • x + t

where m is the stretching factor and t is the shift of the x-axis.
Once the setup is calibrated, students can measure the spectrum of the unknown Lamp 2, input their calculated remap values and read the resulting wavelength peaks. By comparing these values with standard reference tables, they can determine which element is present in the second spectral lamp.

Application Features

Pedagogically guided assistance (disabled buttons, when a function cannot be used, some guidance how to use the remap-function, etc.) We are still in the learning process here, so we might add/tweak some features in the future.

Image upload and rotation with live preview and grid overlay (most smartphone photos need at least some degrees of rotation, since the placement of the device is rarely ideal)

Manual intensity measurements (brightness values) including coordinate display (this function allows to initially assess the image and to explain the important spikes when teaching/presenting)

Automatic generation of an interactive intensity histogram, featuring:

A remap function (“calibration function”) for scaling and shifting the x-axis, enabling students to infer unknown elements from known spectra

The ability to place markers on the graph for precise value reading

Data export as CSV and image files

Technical Concept

The didactic design follows a hands-on approach, giving students the opportunity to explore and experiment independently.
From a technical perspective, this means the application must function both in a classroom setting – projected by the instructor from a laptop, tablet, or beamer – and on students’ personal devices (such as smartphones, tablets, iPads, etc.).

Requiring teachers or students to install dedicated software (e.g., an app or executable) would be impractical, especially given that most school IT systems restrict external installations. Therefore, as in my previous project Data Plotter, I opted to develop a dedicated web application that runs on a small server.

In keeping with the principle of data minimization, the application is optimized to load as little data from the server as possible – an important factor when school Wi-Fi or mobile data connectivity is weak. In total, only about 325 kB of data is transferred; all image processing, measurements, and visualizations are executed directly on the user’s device.

Given that most students are minors and deserve particular protection, I deliberately avoided any use of tracking, cookies, or externally loaded resources (such as fonts or third-party libraries).

For data visualization, the application uses the d3.js library, which is served directly from the local server rather than via a CDN.

---

Hands on

The project is currently in active development and testing – therefore there are still some minor bugs and some spaghetti code to sort out but the key functionalities should work just fine. I release the app as Open Educational Resource free of charge under the Creative Commons license CC-BY-SA 4.0.

If you are curious, you can try the app on your own:

---

Update (23-11-2025)

Since the tool can also employed for physics education in 9th grade, I built an updated version to accomodate the needs of this target group. Changes:

translated the whole interface to German

small handdrawn SVG icons for better guidance (still highly (!) work in progress)

an integrated calculator to convert energy (eV) into wavelength (nm) and vice versa

improved snapping when placing markers on the generated graph (the marker snaps automatically to the highest value in a radius of 8px around the cursor)

Improved hints when rotating the image (also: more degrees of freedom to rotate 360° if needed)

---

Standalone app (Electron)

Currently I am working on creating a standalone app (Mac OS X and Windows) to make the tool independent from any server infrastructure (in regard to the constant decay of the internet, this might actually be necessary). At the moment I am experimenting with Electron to build the tool, which works quite nicely but leads to a significant (!) increase of the tool’s file size: The 350 Kilobyte that the HTML, CSS and JS needed on the server is increased to 270 Megabyte when exported as a Mac OS X app.

Although the OS X version of the tool works quite well, this subproject is currently an experiment of mine, I do not know if it will yield any meaningful results.

The app is developed as open source software. The public GitHub repository can be accessed here. An alpha version of the OS X version of the app can also be downloaded here.