OrangeHub
A video-focused web project built around a straightforward experience, clean navigation, and a practical interface.
Overview
OrangeHub is a personal video-streaming experiment: a dark, fast interface for browsing, searching, and watching video content. It started as an exploration of how a video platform should feel when the chrome gets out of the way — large thumbnails, a readable feed, and a player that stays simple.
The project is deployed and publicly reachable, and it is still being developed. Sections below describe what is actually implemented today, not a roadmap dressed up as a launch.
Problem / Goal
Most video sites I used felt cluttered: competing banners, tiny tap targets, and players that fought the content. I wanted to see if I could build a browsing experience that stayed quiet — where finding something to watch and pressing play were the only two things that mattered.
Approach
- Dark-first interface with generous thumbnails and a calm information hierarchy.
- A real feed and search rather than static mockups, so every layout decision was tested against actual content.
- Deployment on Netlify with serverless functions for stream-URL resolution, keeping the frontend and media layer separate.
Selected features
- Homepage with curated sections and a live feedBuilt
- Search with sorting across the catalogBuilt
- Video player page with playback controlsBuilt
- Multi-source stream resolution via serverless functionsBuilt
- Playback stability fixes for watch pagesIn progress
- Migration to an always-on host for the database and media layerPlanned
Constraints & challenges
Platform limits became architecture decisions
A serverless function's 10-second CPU limit and the host's bandwidth quota forced real trade-offs: stream extraction had to stay lean, edge caching needed careful tuning, and eventually the project outgrew the free tier entirely — which is why a migration to an always-on host is now planned instead of patched around.
Playback bugs that only showed up live
The watch page crashed in production on a type error that never appeared in local testing. Fixing it meant adding crash guards around the player and re-verifying on the deployed URL rather than trusting the local build — a good reminder that the deploy is the product.
Outcome & lessons
- 01Free-tier limits are design constraints, not surprises — plan the exit before you need it.
- 02Verify on the live URL. Local green builds are not the same as working software.
- 03A quiet interface is harder to build than a busy one: every element has to earn its place.