Case study — 08

Lyrics Overlay

Context
Personal project
Year
2026
Role
Design & development
Deliverables
Electron desktop app (macOS)

Lyrics Overlay is a discreet desktop overlay that shows the synchronised lyrics of whatever is playing on Spotify: a small semi-transparent panel pinned to the top-right of the screen, always on top — even over full-screen apps — and fully click-through, so it never gets in the way.

Spotify's official Web API provides the current track and playback position. The login uses OAuth 2.0 with PKCE, so there is no client secret to store: a short-lived local server catches the redirect, and tokens are refreshed automatically. The app polls every few seconds and handles expired sessions and rate limits. Lyrics come from the free LRCLIB API, queried with the track's title, artist, album and duration; titles are cleaned of suffixes like “Remastered” or “feat.” to improve matches, with a search fallback.

Between two polls the app doesn't wait: the renderer estimates the playback position from the last known value and the time elapsed, and a binary search over the timestamped lines finds the current one on every animation frame, so the previous, current and next lines change in time with the music. A global shortcut (⌥⌘L) shows or hides the panel, and a ♪ icon in the menu bar offers reconnecting and quitting.

This project taught me the Electron architecture (main process, preload bridge, isolated renderer with a strict content security policy), OAuth in a desktop context, and how to build a smooth real-time display on top of a slow, polled API.