diff --git a/website/assets/hightube-icon.png b/website/assets/hightube-icon.png new file mode 100644 index 0000000..5337445 Binary files /dev/null and b/website/assets/hightube-icon.png differ diff --git a/website/index.html b/website/index.html new file mode 100644 index 0000000..cea2c5e --- /dev/null +++ b/website/index.html @@ -0,0 +1,255 @@ + + + + + + + Hightube | Open Source Live Streaming Platform + + + + +
+ + + Hightube + + +
+ +
+
+
+

Flutter + Go live streaming stack

+

Hightube

+

+ An open source live streaming platform designed for creators, + private communities, classrooms, labs, and self-hosted media + services. +

+
+ Download builds + + View source + +
+
+
+
+
+ + + +
+
+
LIVE
+
+
+
+
+ Flutter + Client UI +
+
+ Go + Backend API +
+
+ RTMP + Streaming +
+
+ Open + Source +
+
+
+
+
+ +
+
+

Architecture

+

Built with Flutter clients and a Go streaming backend

+

+ Hightube separates a portable client experience from a compact, + self-hostable backend, keeping deployment simple while leaving room + for native desktop, mobile, and web clients. +

+
+
+
+
F
+

Flutter frontends

+

+ One UI technology stack targets Linux, Android, Web, and future + desktop builds with consistent interaction patterns. +

+
+
+
G
+

Go backend

+

+ The server handles API requests, authentication, live room state, + RTMP publishing, HTTP-FLV playback, chat, and monitoring. +

+
+
+
S
+

Self-hosted streaming

+

+ Deploy the server on your own Linux host and connect compatible + broadcasters such as OBS through standard RTMP workflows. +

+
+
+
+ +
+
+

Project highlights

+

Open, free, and cross-platform by design

+
+
+
+

Open source freedom

+

+ Read, modify, build, and deploy the platform from source without + vendor lock-in. +

+
+
+

Cross-platform clients

+

+ Current builds include Linux, Web, and Android client packages, + with Windows builds planned later. +

+
+
+

Practical live features

+

+ Live rooms, RTMP publishing, HTTP-FLV playback, multi-quality + transcoding, chat, danmaku-style messages, and admin monitoring. +

+
+
+

Small deployment surface

+

+ The Go server uses a lightweight runtime model and can be deployed + as a single Linux server component. +

+
+
+
+ +
+
+

Downloads

+

Get the current executable builds

+

+ These files are hosted in the local website resources directory. + Windows server and client builds will be added later. Apple device + builds are not provided at this time. +

+
+
+ + + + +
+ Coming later +

Windows server

+

Planned server executable for Windows environments.

+
+
+ Coming later +

Windows client

+

Planned desktop client build for Windows users.

+
+
+
+ +
+
+

Source code

+

Build it, audit it, host it your way

+

+ Hightube is developed as an open source project. Clone the source, + inspect the Flutter and Go code, build your own binaries, and adapt + it for your own live platform. +

+
+ + Open repository + +
+
+ + + + diff --git a/website/resources/hightube-client/hightube-android-arm64-v8a-v1.0.0.apk b/website/resources/hightube-client/hightube-android-arm64-v8a-v1.0.0.apk new file mode 100644 index 0000000..42ce8c9 Binary files /dev/null and b/website/resources/hightube-client/hightube-android-arm64-v8a-v1.0.0.apk differ diff --git a/website/resources/hightube-client/hightube-linux-amd64-v1.0.0.AppImage b/website/resources/hightube-client/hightube-linux-amd64-v1.0.0.AppImage new file mode 100755 index 0000000..9b73c2d Binary files /dev/null and b/website/resources/hightube-client/hightube-linux-amd64-v1.0.0.AppImage differ diff --git a/website/resources/hightube-client/hightube-web-v1.0.0.tar.gz b/website/resources/hightube-client/hightube-web-v1.0.0.tar.gz new file mode 100644 index 0000000..b5a1228 Binary files /dev/null and b/website/resources/hightube-client/hightube-web-v1.0.0.tar.gz differ diff --git a/website/resources/hightube-server/hightube-server_amd64_v1.0.0 b/website/resources/hightube-server/hightube-server_amd64_v1.0.0 new file mode 100755 index 0000000..8a344bd Binary files /dev/null and b/website/resources/hightube-server/hightube-server_amd64_v1.0.0 differ diff --git a/website/styles.css b/website/styles.css new file mode 100644 index 0000000..bdc86f2 --- /dev/null +++ b/website/styles.css @@ -0,0 +1,495 @@ +:root { + color-scheme: light; + --primary: #0b57d0; + --on-primary: #ffffff; + --primary-container: #d7e3ff; + --secondary: #565f71; + --tertiary: #705575; + --surface: #fbfcff; + --surface-container: #eef3fb; + --surface-container-high: #e5ebf5; + --outline: #727782; + --text: #191c20; + --muted: #42474f; + --success: #146c2e; + --warning: #7a5900; + --shadow: 0 24px 60px rgba(11, 87, 208, 0.16); +} + +* { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + margin: 0; + min-width: 320px; + background: var(--surface); + color: var(--text); + font-family: + Inter, Roboto, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", + sans-serif; + line-height: 1.6; +} + +a { + color: inherit; +} + +.topbar { + position: sticky; + top: 0; + z-index: 10; + display: flex; + align-items: center; + justify-content: space-between; + gap: 24px; + padding: 14px clamp(20px, 5vw, 72px); + background: rgba(251, 252, 255, 0.68); + border-bottom: 1px solid rgba(114, 119, 130, 0.18); + box-shadow: 0 12px 36px rgba(11, 87, 208, 0.08); + -webkit-backdrop-filter: blur(22px) saturate(160%); + backdrop-filter: blur(22px) saturate(160%); +} + +.brand { + display: inline-flex; + align-items: center; + gap: 10px; + color: var(--text); + font-weight: 800; + text-decoration: none; +} + +.brand img { + width: 36px; + height: 36px; + border-radius: 10px; +} + +.nav { + display: flex; + align-items: center; + gap: 6px; +} + +.nav a { + min-height: 40px; + padding: 8px 14px; + border-radius: 20px; + color: var(--muted); + font-size: 0.94rem; + font-weight: 650; + text-decoration: none; +} + +.nav a:hover { + background: var(--surface-container); + color: var(--primary); +} + +.hero { + display: grid; + grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr); + gap: clamp(28px, 6vw, 84px); + align-items: center; + min-height: calc(100vh - 68px); + padding: clamp(48px, 7vw, 96px) clamp(20px, 5vw, 72px); +} + +.hero-copy { + max-width: 680px; +} + +.eyebrow { + margin: 0 0 12px; + color: var(--primary); + font-size: 0.85rem; + font-weight: 800; + letter-spacing: 0.08em; + text-transform: uppercase; +} + +h1, +h2, +h3, +p { + overflow-wrap: anywhere; +} + +h1 { + margin: 0; + color: var(--text); + font-size: clamp(3.5rem, 11vw, 8rem); + line-height: 0.9; + letter-spacing: 0; +} + +h2 { + margin: 0; + font-size: clamp(2rem, 4vw, 3.5rem); + line-height: 1.05; + letter-spacing: 0; +} + +h3 { + margin: 0; + font-size: 1.2rem; + line-height: 1.2; + letter-spacing: 0; +} + +.lead { + max-width: 620px; + margin: 28px 0 0; + color: var(--muted); + font-size: clamp(1.1rem, 2vw, 1.35rem); +} + +.actions { + display: flex; + flex-wrap: wrap; + gap: 12px; + margin-top: 34px; +} + +.button, +.download-link { + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 48px; + padding: 12px 22px; + border-radius: 24px; + font-weight: 800; + text-decoration: none; + transition: + transform 160ms ease, + box-shadow 160ms ease, + background 160ms ease; +} + +.button:hover, +.download-link:hover { + transform: translateY(-1px); +} + +.primary { + background: var(--primary); + color: var(--on-primary); + box-shadow: 0 10px 24px rgba(11, 87, 208, 0.22); +} + +.secondary { + background: var(--primary-container); + color: #001b3f; +} + +.hero-panel { + display: flex; + justify-content: center; +} + +.device-window { + width: min(100%, 560px); + overflow: hidden; + border: 1px solid rgba(114, 119, 130, 0.32); + border-radius: 28px; + background: var(--surface-container); + box-shadow: var(--shadow); +} + +.window-bar { + display: flex; + gap: 8px; + padding: 16px 18px; + border-bottom: 1px solid rgba(114, 119, 130, 0.24); +} + +.window-bar span { + width: 12px; + height: 12px; + border-radius: 50%; + background: var(--outline); +} + +.window-bar span:first-child { + background: #ba1a1a; +} + +.window-bar span:nth-child(2) { + background: #a46700; +} + +.window-bar span:nth-child(3) { + background: #146c2e; +} + +.stream-preview { + position: relative; + display: grid; + min-height: 280px; + place-items: center; + background: + linear-gradient(135deg, rgba(11, 87, 208, 0.94), rgba(112, 85, 117, 0.9)), + radial-gradient(circle at 30% 30%, #d7e3ff, transparent 32%); +} + +.live-badge { + position: absolute; + top: 18px; + left: 18px; + padding: 6px 12px; + border-radius: 16px; + background: #ba1a1a; + color: #ffffff; + font-size: 0.8rem; + font-weight: 900; +} + +.play-symbol { + width: 86px; + height: 86px; + border-radius: 50%; + background: rgba(255, 255, 255, 0.88); + clip-path: polygon(28% 18%, 28% 82%, 82% 50%); +} + +.stats-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1px; + background: rgba(114, 119, 130, 0.24); +} + +.stats-grid div { + min-width: 0; + padding: 18px 14px; + background: var(--surface); +} + +.stats-grid strong, +.stats-grid span { + display: block; +} + +.stats-grid strong { + color: var(--primary); + font-size: 1.02rem; +} + +.stats-grid span { + color: var(--muted); + font-size: 0.88rem; +} + +.section { + padding: clamp(64px, 8vw, 112px) clamp(20px, 5vw, 72px); +} + +.section-heading { + max-width: 820px; + margin-bottom: 32px; +} + +.section-heading p:not(.eyebrow) { + max-width: 760px; + color: var(--muted); + font-size: 1.06rem; +} + +.architecture-grid, +.download-grid { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 18px; +} + +.architecture-card, +.download-card { + min-width: 0; + padding: 24px; + border: 1px solid rgba(114, 119, 130, 0.24); + border-radius: 24px; + background: var(--surface-container); +} + +.architecture-card .icon { + display: grid; + width: 48px; + height: 48px; + margin-bottom: 20px; + place-items: center; + border-radius: 16px; + background: var(--primary); + color: var(--on-primary); + font-weight: 900; +} + +.architecture-card p, +.download-card p, +.feature-item p, +.source-section p { + color: var(--muted); +} + +.feature-band { + background: var(--surface-container); +} + +.feature-list { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1px; + overflow: hidden; + border: 1px solid rgba(114, 119, 130, 0.24); + border-radius: 28px; + background: rgba(114, 119, 130, 0.24); +} + +.feature-item { + min-width: 0; + padding: 28px; + background: var(--surface); +} + +.download-grid { + grid-template-columns: repeat(3, minmax(0, 1fr)); +} + +.download-card { + display: flex; + min-height: 240px; + flex-direction: column; + align-items: flex-start; +} + +.status { + margin-bottom: 18px; + padding: 5px 10px; + border-radius: 14px; + background: rgba(20, 108, 46, 0.12); + color: var(--success); + font-size: 0.78rem; + font-weight: 850; +} + +.status.muted { + background: rgba(122, 89, 0, 0.12); + color: var(--warning); +} + +.download-link { + margin-top: auto; + background: var(--primary); + color: var(--on-primary); +} + +.planned { + background: var(--surface-container-high); +} + +.source-section { + display: flex; + align-items: center; + justify-content: space-between; + gap: 24px; + background: #001b3f; + color: #ffffff; +} + +.source-section .eyebrow, +.source-section p { + color: #d7e3ff; +} + +.source-section div { + max-width: 820px; +} + +.footer { + display: grid; + grid-template-columns: 1fr auto 1fr; + align-items: center; + gap: 16px; + padding: 28px clamp(20px, 5vw, 72px); + background: #001533; + color: #d7e3ff; + font-size: 0.92rem; +} + +.footer span:nth-child(2) { + text-align: center; +} + +.footer span:last-child { + text-align: right; +} + +@media (max-width: 900px) { + .topbar { + align-items: flex-start; + flex-direction: column; + } + + .nav { + width: 100%; + overflow-x: auto; + padding-bottom: 2px; + } + + .hero { + grid-template-columns: 1fr; + min-height: auto; + } + + .architecture-grid, + .download-grid { + grid-template-columns: 1fr 1fr; + } + + .stats-grid { + grid-template-columns: repeat(2, 1fr); + } + + .source-section { + align-items: flex-start; + flex-direction: column; + } +} + +@media (max-width: 640px) { + .hero, + .section { + padding-right: 16px; + padding-left: 16px; + } + + .architecture-grid, + .download-grid, + .feature-list { + grid-template-columns: 1fr; + } + + .actions, + .button, + .download-link { + width: 100%; + } + + .stream-preview { + min-height: 220px; + } + + .footer { + grid-template-columns: 1fr; + } + + .footer span, + .footer span:last-child { + text-align: left; + } +}