#+TITLE: Music SVG Application Design Working Set #+AUTHOR: Craig Jennings * Purpose Six functional HTML/SVG prototypes for the music-config application design session. They explore the Dupre chronometer, hi-fi stereo, and automobile-dashboard visual language while preserving the current player, queue, radio, and playlist workflows. This directory owns the complete in-progress remodel package while the design continues. The implementation spec is [[file:2026-07-19-music-config-ui-remodel-spec.org][2026-07-19-music-config-ui-remodel-spec.org]]. The current interactive and rendering evidence lives under [[file:prototypes/][prototypes/]]. Concept boards, source artwork, and visual references stay beside them so local iteration does not depend on files scattered through =docs/=. When the design is accepted, the spec, prototypes, benchmark, render fixture, and selected final assets graduate together to their permanent =docs/= and =assets/= homes. The selected receiver now has a final interaction candidate at [[file:prototypes/2026-07-19-music-config-ui-remodel-prototype-1.html][prototypes/2026-07-19-music-config-ui-remodel-prototype-1.html]]. It uses concept 30 as the physical shell and overlays the changing local-playlist and radio state. The paired [[file:prototypes/2026-07-19-music-config-ui-remodel-benchmark.org][librsvg benchmark]] makes the three-region production renderer mandatory: full-instrument meter refresh missed the budget, while the lower control tile passed. * Inputs - [[file:../../docs/specs/2026-07-06-fancy-music-player-ui-spec.org][Existing music player UI spec]] - [[file:../../docs/specs/music-config-without-emms-spec.org][EMMS-free architecture spec]] - [[file:../../../code/archsetup/docs/prototypes/panel-widget-gallery.html][Dupre panel-widget gallery]] - [[file:../../../code/archsetup/docs/prototypes/waybar-redesign-prototype.html][Waybar redesign prototype]] * Prototype Directions 1. Gold-pinstripe tuner console 2. Touring-car instrument cluster 3. Chronometer record deck 4. Studio rack and tape machine 5. Perpetual-calendar salon receiver 6. Mission-control radio navigator * High-Fidelity Concept Boards — Iteration Two The second pass deliberately separates visual design from implementation. These boards establish materials, lighting, silhouette, hierarchy, and instrument semantics before the selected direction is translated into Dupre components. 1. [[file:concepts/01-champagne-receiver.png][Champagne Receiver]] 2. [[file:concepts/02-le-mans-night-cluster.png][Le Mans Night Cluster]] 3. [[file:concepts/03-geneva-playback-chronograph.png][Geneva Playback Chronograph]] 4. [[file:concepts/04-mastering-room-reel-console.png][Mastering Room Reel Console]] 5. [[file:concepts/05-perpetual-calendar-salon.png][Perpetual Calendar Salon]] 6. [[file:concepts/06-transatlantic-broadcast-navigator.png][Transatlantic Broadcast Navigator]] 7. [[file:concepts/07-functional-black-glass-receiver.png][Functional Black Glass Receiver]] 8. [[file:concepts/08-functional-black-glass-flipped.png][Functional Black Glass Receiver — flipped]] 9. [[file:concepts/09-functional-black-glass-retro.png][Functional Black Glass Receiver — retro]] 10. [[file:concepts/10-warm-black-glass-player-volume.png][Warm Black Glass Receiver — player volume]] 11. [[file:concepts/11-illuminated-black-glass-controls.png][Illuminated Black Glass Receiver — varied controls]] 12. [[file:concepts/12-consolidated-functional-receiver.png][Consolidated Functional Receiver]] 13. [[file:concepts/13-black-silver-chronograph-receiver.png][Black and Silver Chronograph Receiver]] 14. [[file:concepts/14-corrected-luxury-chronograph-receiver.png][Corrected Luxury Chronograph Receiver]] 15. [[file:concepts/15-champagne-brass-digital-hifi.png][Champagne-Brass Digital Hi-Fi]] 16. [[file:concepts/16-champagne-aluminum-radio-groups.png][Champagne-Aluminum Radio Groups]] 17. [[file:concepts/17-dupre-coltrane-scrollbar.png][Dupre Coltrane Scrollbar State]] 18. [[file:concepts/18-dupre-branding-control-study.png][Dupre Branding and Compact-Control Study]] 19. [[file:concepts/19a-dupre-playlist-state.png][Dupre Playlist State]] / [[file:concepts/19b-dupre-radio-state.png][Dupre Radio State]] 20. [[file:concepts/20-dupre-playlist-radio-comparison.png][Dupre Long-Playlist / Compact-Radio Comparison]] ([[file:concepts/20a-dupre-long-playlist.png][playlist source]] / [[file:concepts/20b-dupre-compact-radio.png][radio source]]) 21. [[file:concepts/21-dupre-semantic-controls-comparison.png][Dupre Semantic-Controls Comparison]] ([[file:concepts/21a-dupre-mode-lamps-playlist.png][playlist source]] / [[file:concepts/21b-dupre-two-on-air-radio.png][radio source]]) - [[file:concept-board.html][Open the six-board review sheet]] The original functional HTML pass remains at [[file:music-svg-directions.html][music-svg-directions.html]] for interaction and workflow reference; it is not the material-design target. * Current Design Decisions - Beauty must communicate real application function; no decorative controls. - Preserve the Champagne Receiver's now-playing, progress, transport, queue, and playlist-management regions as the functional nucleus. - Remove AM/FM, tone, speaker, loudness, power, and other receiver controls without a =music-config.el= command or state. - Target a compact panoramic panel in the bottom portion of a predominantly portrait Emacs frame; playlist and player controls must sit side by side. - Prefer a neutral black-glass, warm-meter, polished-chrome language with restrained warm metal and tactile black leather; keep whitespace low without returning to clutter. Do not use cold blue illumination. - Permanent radio controls map only to the implemented name and tag searches. Manual URL entry remains an Emacs command rather than faceplate hardware. - Place the player on the left and playlist on the right. - The dots around the volume knob are a cumulative illuminated scale driven by actual volume; the last lit dot is the precise pointer. They never chase or flash. - The knob controls dedicated mpv player volume rather than the system mixer. Persist the level in Emacs, pass it to each newly started per-track mpv process, and read/write mpv's =volume= property over the existing IPC socket. - Drive the stereo VU meter from real mpv audio analysis. A labeled lavfi =astats= filter exposes per-channel RMS and peak readings through =af-metadata/