E-SPEC

A digital spectrograph app for Android that turns your phone camera into a wavelength measurement tool. Built for PHSX 316 (Physics III Laboratory - Instrumentation Project).

What it does

Point your phone at a diffraction grating spectrum, calibrate against known spectral lines, then measure unknown wavelengths in real time.

Workflow:

1. Start a new experiment
2. Calibrate — match 2+ known spectral lines (Mercury, Helium, or Neon) to cursor positions. The app fits a linear regression to map pixel position to wavelength.
3. Record — slide the cursor to any spectral line and record its wavelength. Name your measurements, enter wavelengths manually, or delete/clear as needed.
4. Save — captures a photo of the spectrum and locks the session for later review.

Features

• Live camera feed with tap-to-focus lock
• Animated cursor with real-time wavelength readout
• Linear regression calibration with R² and uncertainty display
• Named measurement sliders with manual wavelength input
• Photo capture on save for reference
• Read-only mode for reviewing saved experiments
• Light/dark mode (follows system setting)

Tech Stack

• React Native + Expo SDK 54
• react-native-vision-camera v5 (tap-to-focus, photo capture)
• react-native-reanimated + gesture-handler (60fps cursor)
• AsyncStorage (session data) + expo-file-system (photos)
• Geist + Geist Pixel fonts
• lucide-react-native icons

Getting Started

# Install dependencies
npm install

# Start dev server (connect phone over WiFi)
npx expo start

# Build dev client (required for camera)
npx expo run:android

Note: The camera requires a dev client build — it won't work in Expo Go. After building once with npx expo run:android, you can use npx expo start for subsequent development.

Project Structure

src/
├── screens/          HomeScreen, ExperimentScreen, ReadOnlyScreen
├── components/       CameraView, CursorLine, CursorSlider, CalibrationPanel, RecordPanel, etc.
├── hooks/            useCalibration, useMeasurements, useStorage
├── utils/            regression, spectralLines, wavelength, uuid
├── constants/        colors, theme
├── types/            TypeScript interfaces
└── navigation/       React Navigation stack

Target Device

Redmi Note 14 Pro 5G (Android, portrait-only)