Skip to main content
← Back to projects
Actual Liquid Glass studio with optical controls and PNG export 05 / POOYA LABS
PROJECT / 05Glass & audio lab

LuminaGlass

Public demo

A browser-native lab for tuning Liquid Glass surfaces and optical effects, exporting PNGs, and processing audio with the Web Audio API. Preferences and presets are stored locally in the browser.

SVGCanvasWeb Audio APITypeScript
Open demo ↗ View source ↗
UI /Interface captures
LuminaGlass studio on mobile
LuminaGlass studio on mobile
01 /The challenge

Creating layered glass surfaces with convincing depth and tuning audio processing both benefit from quick, direct browser experiments. LuminaGlass brings these explorations into one interactive lab.

02 /Approach

SVG controls tune optical effects and Canvas renders PNG exports. The audio lab uses the Web Audio API with a chain of Biquad filters.

03 /Role & attribution

The README identifies Pooya as the author.

04 /Technical architecture

A static lab built with Next.js 16, React 19, TypeScript, and Tailwind; SVG renders optical previews, Canvas exports PNGs, Web Audio API runs local audio filters, and localStorage stores preferences and the task board.

Two labs in one browser
Optical effects and audio processing are local; presets and settings stay in this browser
05 /Implementation details
  • 01Tune iridescence, fluidity, and crystal layers live.
  • 02Canvas PNG export.
  • 03Five Biquad filters for oscillator, local audio file, or microphone.
  • 04Flat/Warm/Clarity/Cinematic presets and manual band controls.
  • 05Three-stage local task board.
  • 06Release oscillator, microphone tracks, AudioContext, and object URLs on stop/source change.
06 /Engineering decisions
  • 01Presets, EQ, and tasks stay in this browser's localStorage; there is no cloud sync.
  • 02Audio never resumes automatically after reload; AudioContext resumes from user action.
  • 03Microphone requires HTTPS/localhost and browser permission; audio is not sent to a server.
07 /Verification & evidence
  • 01Pages deployment for commit 06fa934 succeeded on November 1, 2026.
  • 02The README does not provide a consolidated recent browser/accessibility test report.
09 /Capabilities & highlights
  • 01Tune iridescence, fluidity, and crystal-layer complexity
  • 02Export the current studio state as PNG
  • 03Five Biquad filters for oscillator, audio file, or microphone sources
  • 04Browser-local presets and task board
  • 05Release audio resources, microphone tracks, and temporary URLs
10 /Scope & boundaries

Presets and the task board are stored in the current browser's localStorage. Audio processing is local and does not use a cloud service, AI, or backend.