SpotiVis

Objective

SpotiVis is a real-time, audio-reactive music visualizer and player. A glowing, Mitsuha-style waveform pulses to the actual audio frame by frame while time-synced lyrics scroll alongside — all wrapped in a clean now-playing UI (centred album art, scrubber, queue controls, save-to-Spotify). It pairs Spotify for metadata and your library with YouTube-sourced audio, so it can analyse sound the streaming APIs won't expose — rendered on a canvas via the Web Audio API.

Acquirements

• Real-time audio-reactive waveform — Web Audio AnalyserNode driving a spring-physics canvas render
• Bridged Spotify metadata/library with YouTube audio (yt-dlp proxy) to analyse otherwise-DRM'd sound
• Time-synced, scrollable, click-to-seek lyrics (LRCLIB)
• Fluid container-query layout: phone, desktop, fullscreen, and in-car (Tesla) browser
• Background playback + OS lock-screen controls via the Media Session API
• PKCE OAuth with Spotify; settings, volume, and last session persisted

Tech Stack