every-channel/every.channel
1
0
Fork 0
Code Releases Activity Actions
every.channel/evolution/proposals/ECP-0120-material-watch-surface.md
Conrad Kramer cfc4902016
Some checks are pending
ci-gates / checks (push) Waiting to run
Details
deploy-cloudflare / checks (push) Waiting to run
Details
deploy-cloudflare / deploy (push) Blocked by required conditions
Details
Harden LA publishers and add multi-relay guide
2026-06-10 01:28:15 -07:00

2 KiB
Raw Blame History

ECP-0120: Material Watch Surface

Status: Draft

Problem statement

The web watch page should feel like a real television/player surface, not a protocol console, marketing page, or dark decorative shell. It also needs room for modern watch behaviors: channel switching, multiview, scrubbing, clipping, direct tuning, and DVR mode.

Constraints

  • Preserve existing live WebTransport playback, DVR replay, public station scanning, share links, and manual signal tuning.
  • Keep the first screen content/player-first and operable with obvious controls.
  • Use YouTube as interaction grammar, not as visual branding.
  • Keep the palette bright enough for daytime/living-room use.
  • Do not rely on browser-specific copy.

Alternatives considered

  • Continue the dark broadcast-console skin from ECP-0118. Rejected because it reads too much like a control-room hero image and too little like a daily-use player.
  • Copy YouTube visually. Rejected because every.channel should inherit watch-page mechanics without borrowing YouTube brand language.
  • Use pure flat CSS. Rejected because the desired direction is a tactile television object with material depth.

Decision

Rebuild the static web watch surface around a large video player, right-side channel rail, lower scrubber, clip controls, and multiview tray. Use generated bitmap material assets for live-preview tiles and subtle hardware texture, then layer a lighter skeuomorphic system in CSS: warm wood, brushed metal, smoked acrylic, cream buttons, and broadcast-monitor geometry.

The design lineage is intentionally loose: Braun/Ulm clarity for simple control layout, Sony-style broadcast monitor seriousness for the player frame, and Bang & Olufsen-style furniture warmth for the room/object feel. These references are constraints, not objects to copy.

Rollout / teardown plan

Ship as a static web UI change and validate with desktop/mobile screenshots plus the web build. Teardown is reverting the HTML/CSS shell to the previous watch page while leaving playback, directory, and share-link code paths intact.