From 20d645746f7f8ade5e493202d0aa7c2e53f8f9cb Mon Sep 17 00:00:00 2001 From: Craig Jennings Date: Mon, 6 Jul 2026 14:41:13 -0500 Subject: docs(specs): add fancy music-player UI spec + prototype (DRAFT) A spec for the hi-fi look Craig picked from the prototype: the EMMS playlist buffer gains names instead of stream URLs, cover art, a serif now-playing hero with a progress bar, and a warm amber palette, degrading to plain text in a terminal frame. I verified the cover-art path is reachable (radio-browser stations carry a favicon URL, retrievable at search time or by UUID) and framed the work as three layers: a name and text base that ships value on its own and doubles as the terminal fallback, cover-art fetch and cache, then the fancy GUI render. Five design decisions are open, each with a recommended call. The three-direction prototype (minimal, fancy, modern) lands beside the spec as its companion. --- ...2026-07-06-fancy-music-player-ui.prototype.html | 207 +++++++++++++++++++++ 1 file changed, 207 insertions(+) create mode 100644 docs/specs/2026-07-06-fancy-music-player-ui.prototype.html (limited to 'docs/specs/2026-07-06-fancy-music-player-ui.prototype.html') diff --git a/docs/specs/2026-07-06-fancy-music-player-ui.prototype.html b/docs/specs/2026-07-06-fancy-music-player-ui.prototype.html new file mode 100644 index 00000000..8b7ddd21 --- /dev/null +++ b/docs/specs/2026-07-06-fancy-music-player-ui.prototype.html @@ -0,0 +1,207 @@ + + + + + +Music player UI — three directions + + + +
+
+

EMMS playlist buffer · three directions

+

Music player: pick a look

+

Same playlist, three treatments. All are achievable inside an Emacs buffer, but they cost different amounts. Today it shows raw stream URLs (below); each direction fixes that and goes further. Mockups, not live renders.

+
+
+
Current : https://ice6.somafm.com/groovesalad-256-mp3
+
https://ice6.somafm.com/groovesalad-256-mp3
+
https://ice1.somafm.com/groovesalad-256-mp3
+
https://ice2.somafm.com/groovesalad-256-mp3
+
+
+
+ + +
+
1

Minimal

refined terminal — names, one dim glyph, thin now-playing bar
+
+
+
Playlist : Evening mix (5)
+
Current : ▶ Groove Salad · SomaFM
+
━━━━━━━━━━━━──────────────── live · 256k
+
Keys : a:add c:clear L:load S:stop <>:skip
+
Radio : n:by name t:by tag m:enter manually
+
────────────────────────────────────────
+
◉Groove SaladSomaFM · 256k
+
◉Drone ZoneSomaFM · 256k
+
♪Miles Davis — So What9:22
+
♪Bill Evans — Peace Piece6:41
+
◉Jazz Radio BluesFR · 128k
+
+
+

low liftFaces + text only. Names come from the .m3u #EXTINF and local tags; the glyph is a nerd-icon; the bar is one timer-driven line. No images. Sits naturally in the buffer you already have.

+
+ + +
+
2

Fancy

hi-fi / vinyl — cover art, serif titles, warm amber, a real now-playing hero
+
+
+
+
+
Groove Salad
+
SOMA FM · AMBIENT / DOWNTEMPO · 256K
+
+
on airlive stream
+
+
+
+
◉Groove SaladSomaFM
+
◉Drone ZoneSomaFM
+
♪Miles Davis — So What9:22
+
♪Bill Evans — Peace Piece6:41
+
◉Jazz Radio BluesFR
+
+
+

medium liftCover art + variable-pitch serif. Emacs shows images (station favicons, embedded album art) and a serif face for titles via `display` and face remaps. The vinyl cover and segmented bar are drawn with faces/SVG. Needs an art fetch-and-cache layer; the warmth is a theme overlay.

+
+ + +
+
3

Modern

streaming-app card — rounded art, sans title, a slim seek bar with a handle, pill controls
+
+
+
♪
+
+
Groove Salad
+
SomaFM · ambient · 256 kbps
+
+
+
LIVE∞
+
shuffle⏮⏸ pause⏭repeat
+
+
◉Groove Salad ▎▍▎SomaFM
+
◉Drone ZoneSomaFM
+
♪Miles Davis — So What9:22
+
♪Bill Evans — Peace Piece6:41
+
◉Jazz Radio BluesFR
+
+
+

higher liftPushes hardest against the buffer model. Rounded art, pill controls, the seek-bar dot handle, and rounded rows are easy in a browser but need SVG-rendered widgets or `svg-lib`-style images in Emacs, redrawn on playback. Doable in GUI Emacs, but it's the most code and the least "text buffer." A cool accent (mint) instead of the theme's amber to read contemporary.

+
+ +
+

My read: Minimal is the honest sweet spot for an Emacs player you live in, and it kills the primitive feeling on its own. Fancy is worth it if you want the now-playing moment to feel like hi-fi and you're happy to add cover art. Modern is the most striking but fights Emacs the most, so it's the biggest build for a look that a browser does more naturally. All three keep the n/t/m radio row and the same keys.

+

Left out of every direction to stay tasteful: animated equalizers everywhere, a separate browser pane, mouse-first chrome. Glyphs shown here (◉ ♪) stand in for nerd-icons.

+
+
+ + + -- cgit v1.2.3