System Requirements Document (SRD)

Project: purple-siaran

Version: 1.0.0 Date: 2026-03-01 Prepared for: Kerja Cerdas Status: Initial Draft

1. Introduction

This document outlines the System Requirements for purple-siaran, a real-time online TV broadcasting platform developed for Kerja Cerdas. The platform enables users to manage, schedule, and broadcast live content using YouTube iframe embeds, complete with a full-screen timeline display, an admin panel with rotation controls, analytics, and automated notifications.

This SRD serves as the foundation for design, development, and deployment decisions throughout the project lifecycle. The system is intended to be fully functional and accessible online — not a demo or simulation — delivering a live, real broadcasting experience.

2. System Overview

purple-siaran is a web-based TV broadcasting management system that allows administrators to schedule and stream YouTube-based content as a continuous live channel. Viewers access a full-screen timeline schedule, while admins manage playlists, embed YouTube videos/ads/iframes, preview content, rotate the schedule display, and monitor analytics in real time.

The system consists of:

• A public-facing TV viewer (full-screen, live, real-time schedule display)
• An admin panel (schedule management, video preview, notifications, analytics)
• A backend API (scheduling engine, notification service, analytics collector)
• A database layer (schedules, video metadata, analytics data)

The platform targets Indonesian users (timezone: WIB / UTC+7, locale: id-ID).

3. Functional Requirements

3.1 Public TV Viewer

• As a Viewer I should be able to watch a live YouTube iframe embed broadcast on a full-screen page
• As a Viewer I should be able to see the current and upcoming schedule in a full-screen timeline table
• As a Viewer I should be able to see the currently airing program with its title, time, and category
• As a Viewer I should be able to have the schedule table auto-rotate/scroll so no interaction is needed on display screens

3.2 Schedule Management

• As an Admin I should be able to create, edit, and delete schedule entries in a timeline table
• As an Admin I should be able to assign a YouTube video URL or YouTube iframe embed to any schedule slot
• As an Admin I should be able to set program start time and end time per schedule entry (WIB / UTC+7)
• As an Admin I should be able to view the full weekly/daily schedule in a visual timeline format
• As an Admin I should be able to manually rotate or reorder items in the schedule
• As an Admin I should be able to drag-and-drop schedule entries to rearrange broadcast order

3.3 Video & Content Management

• As an Admin I should be able to add YouTube video URLs and have them embedded as YouTube iframes
• As an Admin I should be able to add YouTube ad URLs as schedule slots
• As an Admin I should be able to preview a video before publishing it live to the broadcast
• As an Admin I should be able to skip or replace a currently airing video directly from the admin panel
• As an Admin I should be able to mark a video as active/inactive without deleting it

3.4 Notifications

• As an Admin I should be able to receive automatic notifications when a scheduled program is about to air
• As an Admin I should be able to configure notification lead time (e.g., 5, 10, 15 minutes before airtime)
• As an Admin I should be able to receive notifications when a video fails to load or an iframe returns an error

3.5 Analytics

• As an Admin I should be able to view real-time viewer count per broadcast slot
• As an Admin I should be able to see performance analytics per video (views, watch time, engagement)
• As an Admin I should be able to view historical analytics by date, program, or category
• As an Admin I should be able to export analytics data as CSV or PDF

3.6 Authentication & Access

• As an Admin I should be able to log in securely to the admin panel
• As an Admin I should be able to manage other admin accounts (create, disable, reset password)
• As a Super Admin I should be able to assign roles and permissions to admin users

4. User Personas

5. Visuals, Colors & Theme

The color palette for purple-siaran is inspired by broadcast media, digital screens, and nighttime TV aesthetics — bold, premium, and modern.

Typography:

• Headings: Inter or Space Grotesk — bold, clean, techy
• Body: Inter — readable at all sizes
• Monospace (schedule times): JetBrains Mono or Fira Code

Design Language: Dark mode first. Glassy card surfaces with subtle purple glow. Neon accents for live indicators. Inspired by modern broadcast dashboards and streaming platforms.

6. Signature Design Concept

🎬 "The Broadcast Dimension" — A Living TV Station Control Room

Imagine opening purple-siaran and being greeted not by a flat webpage — but by a cinematic broadcast control room experience that feels alive.

🏠 Home / Viewer Page — Full-Screen Live Broadcast Experience:

The viewer page is a full-bleed, edge-to-edge broadcast screen. The YouTube iframe occupies 100% of the viewport — no scrollbars, no chrome, just the broadcast. Overlaid at the bottom is a glowing neon ticker tape — a horizontal schedule ribbon that slides in from the right, showing upcoming programs in real time. The ticker uses JetBrains Mono font with a pulsing LIVE badge in vivid red that breathes (CSS pulse animation) to signal real broadcast status.

When a new program begins, the screen performs a channel-change transition: a brief horizontal static glitch effect (CRT scanline flash, ~300ms) before the new YouTube iframe fades in. It feels exactly like changing the channel on a real TV.

The schedule timeline at the bottom auto-rotates every 8 seconds — smoothly sliding left to reveal future programs — mimicking the look of a real broadcast network's on-screen guide.

🖥️ Admin Panel — The Control Room Aesthetic:

The admin dashboard looks and feels like a TV broadcast control room. Dark charcoal panels with glowing purple borders. The schedule timeline is presented as a horizontal swimlane timeline (like a DAW/video editor timeline) — each program slot is a draggable "clip" that snaps to time slots. Clips glow neon cyan when active/live, soft purple when scheduled, and grey when inactive.

Hovering over a clip reveals a floating preview card — a mini YouTube thumbnail with program name, duration, and quick-action buttons (▶ Preview, ✏ Edit, ⏭ Skip Live). The preview card animates in with a smooth 3D flip from the clip.

The top of the admin panel features a "NOW ON AIR" monitor widget — a small glowing screen showing what's currently broadcasting, with a red ● LIVE dot and elapsed time counter ticking in real time.

Notifications appear as broadcast-style alert banners that slide in from the top-right — styled like an urgent news chyron: yellow background, black bold text, with a countdown timer.

Analytics pages use waveform-style bar charts — bars that animate upward like audio equalizer levels when the page loads, reinforcing the broadcast/studio theme.

Every micro-interaction is deliberate: button clicks produce a subtle "click" of a broadcast switcher, transitions use cut/fade-to-black effects familiar from TV production, and the entire experience immerses the admin in the fantasy of running a real television station.

7. Non-Functional Requirements

8. Tech Stack

Frontend

Backend

Database

Infrastructure

Note on Firebase: Firebase was considered but the preferred stack uses FastAPI + MySQL for full control over data, with MongoDB for analytics — giving Kerja Cerdas complete ownership and flexibility without vendor lock-in.

9. Assumptions and Constraints

Assumptions

• All video content is hosted on YouTube; no self-hosted video streaming is required
• YouTube IFrame API terms of service allow embedding for this use case
• Admin users have stable internet connections for managing the panel
• The viewer display (TV/monitor) runs a modern Chromium-based browser
• Initial deployment targets Indonesian audience, timezone WIB (UTC+7)
• Currency and billing (if added later) will use IDR (Indonesian Rupiah)

Constraints

• YouTube IFrame API limits control over ads and some autoplay behaviors depending on the video owner's settings
• YouTube does not provide real viewer count via iframe; viewer analytics will be tracked via the platform's own session tracking
• No self-hosted video encoding or streaming (no RTMP, HLS, or transcoding pipeline in scope)
• Admin panel is desktop-first; mobile admin is out of scope for v1.0
• Free-tier infrastructure may limit concurrent connections during scale testing

10. Glossary

Document prepared by the purple-siaran SRD Generator for Kerja Cerdas | Version 1.0.0 | 2026-03-01