§ masterplan.md
Vintage Internet Radio
A retro radio player with spinning vinyl animations, station presets and a live song request wall.
01
App overview and objectives
An internet radio station styled like a 1970s receiver: dial-based station switching, a live now-playing readout, listener requests and a published schedule. It rewards leaving the tab open.
02
The problem worth solving
Algorithmic playlists removed the human voice from listening. A curated station with a visible schedule and real requests recreates shared time — everyone hearing the same song at once.
03
Target audience
- Primary — Listeners who want curation instead of endless choice.
- Secondary — DJs and collectors who want a small broadcast slot.
04
Roles and permissions
- Visitor — read-only public pages, can sign up.
- Member — owns their own records, cannot see other users' data.
05
Core features
- Persistent player that survives navigation with a tactile dial for stations
- Now playing with track history and cover art
- Request form with a moderated queue
- Weekly schedule of shows with host profiles
- Chat or reactions during live shows
- Low-bandwidth stream option
Deliberately later
- Show archives and podcasts
- Listener accounts with favourites
- Mobile app with background audio
06
Technical stack
React front end, a dedicated streaming server or hosted stream provider, small database for schedule and requests.
Why: Audio streaming is a solved specialist problem; renting it is cheaper and far more reliable than self-hosting.
Alternatives: Self-hosted stream server (full control, bandwidth costs and uptime burden) or a playlist-based fake-live approach (cheap, no true live shows).
07
Conceptual data model
Station — name, genre, stream url, artwork
Show — station, host, weekly slot, description
Track — title, artist, album, art, played_at
Request — listener, track, message, status
Host — name, bio, photo, shows
08
Integrations
- Streaming provider
- Metadata feed for now-playing
- Music licensing service
- Chat service
09
UI design principles
- Period-accurate details: pixel or bitmap type, dithered textures, chunky borders.
- Nostalgia must not cost usability — keep tap targets and contrast modern.
- Sound and animation are opt-in, never autoplay.
10
Security considerations
- Request messages moderated before display.
- Rate limit requests per session to prevent flooding.
- Persist no listener identity beyond an anonymous session id.
11
Development phases
Phase 1 — Prove the core
- — Persistent player that survives navigation with a tactile dial for stations
- — Now playing with track history and cover art
- — Request form with a moderated queue
- — Static content and design system in place
- — Basic analytics
Phase 2 — Make it real
- — Weekly schedule of shows with host profiles
- — Chat or reactions during live shows
- — Low-bandwidth stream option
- — Accounts, sign-in and password reset
- — Empty, loading and error states everywhere
Phase 3 — Polish and launch
- — Performance, accessibility and SEO pass
- — Legal pages, contact route and 404 handling
- — Wire up: Streaming provider
- — Wire up: Metadata feed for now-playing
Phase 4 — Grow
- — Show archives and podcasts
- — Listener accounts with favourites
- — Mobile app with background audio
12
Challenges and solutions
Risk — Music licensing is legally serious
Solution — Register with the appropriate licensing bodies before launch and log all plays for reporting.
Risk — Player breaks on navigation
Solution — Mount the audio element once at the root and drive it through global state.
Risk — Dead air between shows
Solution — An automated fallback playlist with the same station identity.
13
Future expansion
- Local advertising for small businesses
- Live event broadcasts
- Regional sister stations
14
Page list (13 pages)
- 01 PUBLIC Listen — The receiver: player, dial, now playing.
- 02 PUBLIC Stations — Genres and channels.
- 03 PUBLIC Requests — Submit and see the queue.
- 04 PUBLIC Schedule — Weekly shows and hosts.
- 05 PUBLIC About — Story, licensing and contact.
- 06 AUTH Sign up — Create an account with email or a social provider.
- 07 AUTH Log in — Return to the account, with error and lockout states.
- 08 AUTH Reset password — Request a reset link and set a new password.
- 09 APP (signed in) Account settings — Profile, email, password, language and delete account.
- 10 PUBLIC Contact — Contact form plus real address, phone and email.
- 11 LEGAL & SYSTEM Privacy policy — What data is collected, why, and how to remove it.
- 12 LEGAL & SYSTEM Terms of service — Rules of use, liability and account termination.
- 13 LEGAL & SYSTEM 404 not found — Friendly dead end with search and links back.
15
Page map
PUBLIC AUTH APP (signed in) LEGAL & SYSTEM ─────────── ───────────────── ─────────────────── ─────────────────── ├─ Listen ├─ Sign up └─ Account settings ├─ Privacy policy ├─ Stations ├─ Log in ├─ Terms of service ├─ Requests └─ Reset password └─ 404 not found ├─ Schedule ├─ About └─ Contact key flows: Listen ──▶ Requests Stations ──▶ Listen Schedule ──▶ Listen