62 lines
4.4 KiB
Markdown
62 lines
4.4 KiB
Markdown
|
|
# Product
|
|||
|
|
|
|||
|
|
## What it is
|
|||
|
|
|
|||
|
|
Dragonflight (codebase name; UI brand: "Dragonflight · Wild Dragon Broadcast") is an on-prem broadcast media asset manager and live ingest controller. Operators capture from SRT, RTMP, and SDI sources, schedule windowed recordings against named recorders, transcode/proxy in the background, browse and clip in a library, import from YouTube, and hand off to Premiere or an in-house editor.
|
|||
|
|
|
|||
|
|
The deployable surface is a React (Babel-in-browser) single-page app served by nginx, talking to a Node/Express API backed by Postgres + Redis + BullMQ, with capture and worker containers handling the actual media.
|
|||
|
|
|
|||
|
|
Stack lives at `services/web-ui` (UI), `services/mam-api` (API), `services/capture`, `services/worker`, `services/editor`.
|
|||
|
|
|
|||
|
|
## Register
|
|||
|
|
|
|||
|
|
**Product.** This is operator UI for a working broadcast tool, not a brand site or marketing surface. Design serves the operator's job, not the brand's identity.
|
|||
|
|
|
|||
|
|
## Users
|
|||
|
|
|
|||
|
|
Primary: broadcast operators and engineers running live productions. They schedule and supervise back-to-back recordings across multiple recorders in a single shift. They care about: what's recording right now, what's about to start, what failed, and which recorder is bound to what source.
|
|||
|
|
|
|||
|
|
Secondary: editors and producers who consume the resulting library, comment on assets, request proxy regeneration. They mostly live in the Library and Asset detail screens, not the scheduler.
|
|||
|
|
|
|||
|
|
Tertiary: admins managing recorders, users, cluster nodes, and storage. Live in the Admin screens.
|
|||
|
|
|
|||
|
|
## Product purpose
|
|||
|
|
|
|||
|
|
Replace a stack of one-trick tools (NewBlue scheduler, vMix capture, ad-hoc Premiere ingest, manual S3 syncs) with a single operator surface that supervises recorders, owns the asset catalog through proxy generation, and stays out of the editor's way once footage lands.
|
|||
|
|
|
|||
|
|
## Tone
|
|||
|
|
|
|||
|
|
Function-first. Dense. Operations-room. Mono fonts where data lives. Small type. Restrained chrome. The operator should be able to glance at any screen and read the state of the system in under a second; they should never wonder "is this still happening" or "did that finish."
|
|||
|
|
|
|||
|
|
Not: marketing-warm, conversational, gamified, congratulatory.
|
|||
|
|
|
|||
|
|
## Strategic principles
|
|||
|
|
|
|||
|
|
1. **Glance-readable status.** Every list, every cell, every badge must answer "what is the state of this thing right now" without a hover.
|
|||
|
|
2. **Trust the operator.** No confirmation modals for reversible actions. No nag, no toasts for routine success. Errors stay visible until acknowledged.
|
|||
|
|
3. **Time is the spine.** This product is about time-based events (recordings, schedules, jobs). UIs should privilege time as a primary axis, not bury it under categorical filters.
|
|||
|
|
4. **Density over whitespace.** Operators run multi-monitor setups and want maximum signal per pixel. Generous whitespace is a brand-site reflex; reject it here.
|
|||
|
|
5. **No half-states.** Pending UIs disable controls; live UIs show live data; failed UIs show the failure inline, not in a separate notification feed.
|
|||
|
|
|
|||
|
|
## Anti-references
|
|||
|
|
|
|||
|
|
Steer away from:
|
|||
|
|
|
|||
|
|
- **Linear-pastel SaaS aesthetics.** Purples, mint accents, friendly empty states with cartoon line illustrations.
|
|||
|
|
- **Google-Calendar generic.** A neutral month grid with rounded event chips, no operational signal, optimized for "is Friday free" rather than "is recorder A in conflict at 14:00."
|
|||
|
|
- **Gantt-chart project-management feel.** Implies long-horizon planning of tasks with dependencies; this product is hour-scale broadcast operations.
|
|||
|
|
- **Cards-for-everything.** Identical card grids of icon+label+value. Particularly the SaaS hero-metric template.
|
|||
|
|
- **Decorative blur / glassmorphism / gradient text.** Read as decorative AI slop in a broadcast-ops context.
|
|||
|
|
- **NewBlue / Wirecast skinning.** Heavy bevels, gradient buttons, drop shadows. Read as outdated broadcast software.
|
|||
|
|
|
|||
|
|
## Decision context (Schedule v2)
|
|||
|
|
|
|||
|
|
The Schedule screen was rebuilt as an EPG (electronic program guide) timeline. Operator confirmed:
|
|||
|
|
|
|||
|
|
- Density: **heavy / back-to-back, many recorders all day** — month grid was the wrong primary.
|
|||
|
|
- At-a-glance signals: now/next, recorder bookings (conflicts), project context, failure history.
|
|||
|
|
- Aesthetic: **studio / cinematic — dark, type-led, accent moments.** DaVinci-Resolve-panel territory.
|
|||
|
|
- Scope: full rethink — replace the primary view.
|
|||
|
|
|
|||
|
|
Implementation: recorder rows × time-of-day horizontal axis, sticky gutter + ruler, vertical hot-red now-line, event blocks colored by project, status pills in a top strip. Today / Week / List views.
|