How to Build a Video Streaming Website, Service, or Platform like Netflix, Amazon, or Hulu

How to Build a Video Streaming Website, Service, or Platform like Netflix, Amazon, or Hulu

• Category: Commercial
• Date 05-09-2017

The media and entertainment industry has always been at the forefront of tech innovation. An unspoken law reads, either change or die. That’s what the incumbents like Disney, Fox, Comcast, and Time Warner are still figuring out. That’s what streaming video services like Netflix, Amazon Instant Video, and Hulu have got covered. But before you learn how to build a video streaming website, here’s a story.

Story time

Once an underdog in video rentals, Netflix approached the then major player, Blockbuster, about selling 49% of the company to act as an online arm for the video-rental giant. Netflix estimated its worth at $$50 million. ‘Loonatics!’ laughed Blockbuster folk, ‘Isn’t that a bit over-the-top?!’ Well, they were spot on! Over just a decade, Netflix transformed into a $47 billion video streaming service to deliver over-the-top (OTT) video content!

Okay, so you want to make a video streaming website? Let’s dig into the topic.

• What is over-the-top video content
• How to make a video streaming website
• Video streaming website: user-facing features
• How to choose a technology stack for a video streaming site
• Understand a streaming website architecture
• Study the video streaming server requirements
• Dig into video streaming protocols
• BONUS! Video streaming website: a startup kit

Over-the-top video content, eh?

Away with downloads! Video streaming service rules!

Downloads suck! The waiting. The storage space. And you want your movie RIGHT NOW! Well, video streaming service is your oxygen. It transmits data as a continuous flow, so you can watch or listen almost immediately. In fact, streaming files can be hard to save (yeah, your copyright is safe). They disappear as soon as you’re done. So a streaming video website is akin to television. The only difference is the medium – it’s delivered via the web (aka ‘over the top’). So what does it mean to build a video streaming server?

Oh, I get it! Another YouTube rabbit hole!

Why not?! YouTube’s initial concept of a video sharing site has evolved to perfectly house both pre-recorded and live streaming options. Netflix and Amazon Prime specialize in on-demand video. Hulu is in-between. But live streaming is also big on Facebook and other social networking sites. SO BIG you have no idea! Let’s clarify. On-demand video is pre-recorded and compressed. It’s stored on servers and delivered to one or multiple users ‘by request’. But even if you didn’t ask for it to play (remember those annoying ads that start playing by themselves?) it’s still ‘on-demand’. Duh! Live streaming is a whole other story. It’s captured, compressed, and transmitted in real-time. Of course, you need huge computing resources and oftentimes specific hardware support. But who doesn’t like sports, news, or concerts – LIVE?! Never miss an event in your life! Isn’t it cute? Live stream to someone special (one-to-one) or to the whole tribe (one-to-many), and even get feedback (two-way). Wonder what happens after live videos are no longer so… erm… ‘live’? Periscope and Snapchat leave them up for 24 hours (FOMO, you know), FB keeps them forever.

So video streaming, huh? Tell me about it!

Video streaming works by breaking a video into small chunks and sending them via the net to get reassembled and played at their final destination. In case techy parlance like ‘streaming protocol’, ‘codec’, or ‘container format’ scares you, here’s a journey metaphor. Imagine you are a delivery service transporting goods, like clothing, in bulk (the goods are the video). The codec will be a machine that compresses the clothing into a bundle to save space. The container format is a boxcar where these bundles are packed in. And the streaming protocol is the railroad tracks, signals, and drivers that deliver it to the destination. So there! You’re smart enough to know how to start a video streaming website. But wait! What about the ‘why’?

Over-the-top video streaming is gaining ground

Wonder why?

• Storage space: no more downloads to a laptop, desktop, or phone.
• Access: anytime anyplace with consistent internet connection.
• Good ol’ buttons: pause, rewind, fast forward same way as on a VCR.
• In control: away with spoon-feeding! Binge-watch your favourite shows.
• Variety: high-quality professional on-demand videos, user-generated content (UGC), or live streaming events to cater to all tastes.
• Virality: video content is the most shareable and engaging (hear, hear marketing folk!).

Sounds like business, right?

The video streaming market is estimated to be a $70.5 billion industry by 2021. There’s a huge potential for video-on-demand (VOD) platforms in education, media & entertainment, e-commerce, healthcare and other areas. Moreover, 80% of consumers agree that corporate live videos are engaging, add credibility and humanize the brand. Live streaming is catching on in business, transforming the ways social media marketing campaigns are run. Businesses are broadcasting live video streams for product demos and tutorials. Nonprofits are using live streaming to bring major events to a larger audience. Media organizations are streaming live news. Sporting leagues are using live streaming to bring matches to their fans, wherever they are. Governments are using live broadcasting to comply with open-meeting laws. Religious groups are using streaming media to grow their congregations. And you can, too!

Want to make a video streaming website?

 Whatever are your business objectives, models, or use cases, it’s your prerogative. How you’re going to attract the audience, what sort of videos you’re going to stream (professional, user-generated), or how you’re going to monetize the site (subscription, ads, pay-per-view, or some other ingenious way), is outside the scope of this article. Hope, as a startup, you don’t fall for the temptation of building another streaming service like Netflix but go for an online tech company that distributes video and acts as a streaming platform for creatives. If your users are co-creators, the proper technical implementation is the bottom line. So how to start a video streaming service? Here’s a minimum feature-set for a video streaming website development.

Making a video streaming website: user-facing features

Let’s assume you plan to create a streaming service or a platform to unite video producers and consumers. Your role is to ensure all-time technical support and website administration. The ultimate goal, to delight media consumers, will only be fulfilled if all the pieces of this mosaic fall into place, that is if all the website users are happy at all stages. So a streaming platform development includes this functionality.

• Home page. The place to inform your users of the benefits they will find, show them the capabilities, mesmerize them by the looks and promises of entertainment. The Home section highlights movies, TV shows, sports programs, and other categories of content, and is customized according to each user’s preferences (thanks to a complex recommendation algorithm).
• Onboarding. Needless to say how much onboarding benefits a product use. How else would they know you offer the best functionality? But there’s more! Reduce your users’ learning curve and ensure they know every nook and cranny of your site. This will make their stay unforgettable.
• Registration/Login. An indispensable interactive element for a VOD service. Provide a variety of ways for your user to register/log-in:
  • Facebook login
  • Google login
  • Mobile number for OTP verification
  Also, how can you start a video streaming website without a password recovery option?
• User profile. It’s good to have somewhere to feel at home in. After a home page, a user profile is virtually this dashboard to navigate through the entire journey, not to mention an excellent place for you to get insights (analytics-wise).
• Settings. Letting users control the level of their privacy is a good tactic. Allow users to toggle between privacy options for the audience and social platforms to broadcast to.

Video consumers would appreciate it if you build a streaming platform with these features:

• Search a video. Once your platform has grown, it could be increasingly hard to find the content. You need a strict system of categories and an extended system of indicators for users to filter through. Keep filters for searching by location, broadcast topic, date, length of the video, genres, language, and most-watched, etc. Auto-correct and autocomplete will quicken the procedure, especially for a mobile user. Choose one of these tools to implement search on your website.
• Video library. Create ‘shelves’ for viewers to treasure their best video experiences – ‘viewed’ history, to watch later, favorites, likes, shares and such. The ‘expiring’ category (Hulu) indicates the episodes that might be prioritized on your watch-list.
• Video player & play experiences. Video players are your first point of contact with your audience, so delivering the best possible experience is key. Viewers can create a familiar look and feel by customizing the following elements: player logo, watermark, a quality selector (crucial for a mobile viewer on a limited data plan), info screen, share & embed options, related videos, playlist configuration, download button. Mind the integrations: analytics, monetization.
• Subscription & interaction. Users should be able to subscribe to channels of their choice. Allow them to interact with the content and community in a variety of ways:
  • Subscribe to channels
  • Like/dislike videos
  • Comment on videos
  • Review and rate
  • Share links to free video on websites
  • Share the screen
  • Live chat
• Payments. On-site payments are indispensable for user retention. Users can pay by PayPal or by their debit/credit card. The two payment models are:
  • Pay to get access to gated content (pay-per-view)
  • Pay monthly subscription from your page
  This can be technically implemented by integrating PayPal via Braintree or Stripe.

Video creators should be treated lavishly to the best tools to make their stay pleasant and rewarding. They will need access to a creative studio and user analytics.

• Video upload and ingestion. Help transfer video from their multiple devices onto your site with video upload. Video ingestion allows the receiver of the video to take it in and process it for further use. Use the studio in a variety of ways:
  • Upload files from the desktop and mobile devices
  • Capture videos from the webcam
  • Create screen recordings in real-time
  • Launch live web events
  • Create video presentations with synchronized video and slides
  • Import directly from YouTube at the click of a button
  • Edit the recording
• Video management. Managing a media library, even a large one, should be simple and straightforward. Content creators will benefit from tools to organize videos and metadata, easily search media, edit the information, moderate, create playlists, etc.
• Analytics. Provide the creators with a comprehensive tracking system to measure the engagement.

Admin role will boost your platform’s credibility. It involves content moderation, payment management, advanced analytics and QoE/QoS monitoring. The latter is crucial for the platform’s long-term strategy. I bet you want all that right now?! Not so fast! We’ve come to the most demanding part – choosing technology to develop a video streaming website. Not something to take lightly.

Choose a technology stack for a video streaming site

Picking the right technology stack allows you to build a streaming server that lasts. You’re tempted to repeat the success of the industry leaders. But there’s a catch:

1. They are miles ahead of you. So how can you catch up with an established video streaming service by using the same tools?
2. They started a while ago. Technology evolves, and there are smarter, cheaper, more efficient solutions on the market.
3. The circumstances are always unique. And so is your business model.

Remember, your goal is to find a toolset that provides unique advantages for your project. So there are no shortcuts. Take your time. Research your options. And make decisions. Just bear with us and you’ll be rewarded in the end. (Wink. Wink.) 

Understand a streaming website architecture

How does video streaming work? Okay, just imagine a three-layered pie. The top layer is the client software, the bottom – the server component, and in the middle, the distribution component. The server component takes the segmented chunks of stream, dresses them into a suitable format and prepares for distribution. The distribution component delivers the media and associated resources to the client by request. For large-scale distribution, edge networks or other content delivery networks can also be used. The client software determines the video to request, continually downloads and reassembles the streaming files back into a digestible format. You need to get those three properly aligned. But there’s more! You want a cost-effective, good-quality, forward-oriented solution that will produce great user experience.

Study the video streaming server requirements

How to make sure your video streaming site is performing well? The bottom line is balancing these performance characteristics:

• reliable storage
• good network connectivity
• high bandwidth
• low jitter
• reasonable latency
• security

Operating this requires a managed data center.

Reliable storage

Your viewers will want all-time availability of your videos, whereas for you it means having a place for hosting your media files with maximum uptime. Moreover, the web host has to support media streaming (not all of them do), which means coping with potential traffic spikes without the downtime and specializing in video sharing. The most cost-effective solution, while you’re small, is to create two dedicated storages.

• Use an SSD storage to keep the newest and most popular videos at the fastest reach. Obviously, you can keep all your data at SSDs, however that may cost some top dollars.
• Use a less powerful (and cheaper) storage type to host the remaining, less popular video data.

But as you grow, cloud hosting becomes an optimal solution. It takes much of the burden of streaming off the local computer, speeding things up and increasing fidelity and reliability.

Good network connectivity

Creating a streaming website requires reliable connectivity. Even if you’re not planning on growing fast, eventually you’re going to scale. A content delivery network (CDN) has a lot to offer and considering it right off will spare you much hassle later on. In case you don’t know, a Content Delivery Network is an infrastructure that provides guaranteed delivery of content to users through a geographically distributed network of servers. Why does a CDN matter? Basically, it transforms your streaming website into a scalable system to meet any major spike in demand for your content. A CDN is a cost-effective alternative to overbuilding your own servers. But there are other reasons, too:

• Helps prevent server overload
• Shorter request response time
• Smaller probability of packet loss

Here’s a detailed post on how to choose a CDN.

High bandwidth

How much bandwidth is enough for making a video streaming website work? Consider this: A user requires 4Mbps to watch a 720p video in real time. Imagine, you had 2,500+ users watching the same video simultaneously. That’s 10 Gbps! HD video (1080p) requires even more. Now with 4K resolution becoming a near-standard future, Hulu recommends 13 Mbps, Amazon advises 15 Mbps, and Netflix 25 Mbps. You can do the maths, right? Two things are important in video streaming website development – a quality CDN and the right protocol (will come to that shortly).

Low jitter

The term ‘jitter’ indicates latency variation, or vibrations in network delay. It causes video frame drops, freezing images, desynced audio and video, and other issues. Choppy streaming has been a pain in the neck for video-on-demand (VOD) providers and consumers alike, even streaming leaders (like Netflix) aren’t immune to rebuffering. And what with live video streaming? The technical challenges of live video streaming include jitter, high latency, packet loss, and network asymmetry. To fight jitter, adaptive bitrate (ABR) streaming has been widely used. In adaptive HTTP streaming, the source video (a file or live stream) is encoded into file segments – sometimes referred to as ‘chunks’ – using the desired format, which includes a container, video codec, audio codec, encryption protocol, etc. Segments typically represent two (to ten) seconds of video. The segments are subsequently hosted on a regular web server. They may differ in bitrate, resolution, codec or codec profile/level. Recently, an AI-driven approach to selecting the right bitrate has been introduced. Researchers at MIT CSAIL came up with a neural network algo dubbed ‘Pensieve’ that ensures a smooth stream at the best possible quality. The effect is, the rebuffering has fallen by 10-30 while the picture quality has risen by 10-25.

Reasonable latency characteristics

The ugly truth about live video streaming is that it’s never actually ‘live’. Whatever a camera captures is delivered to the end viewer with a delay of (hopefully) several seconds. The reason for that is… latency, meaning the time it takes for a message (a packet) to travel from its point of origin to the point of destination. What latency is reasonable when it comes to live streaming? That depends. It’s okay to have a 30-45 seconds’ latency if you watch a live concert. But other use cases, like videoconferencing, betting and bidding, or video gaming, require ultra-low latency. So how to deliver low latency streaming? There’s no cooked-up solution, you’ll have to find the right balance of these three factors:

• Encoding protocol and device/player compatibility
• Audience size and geographic distribution
• Video resolution and complexity

A streaming protocol makes a huge difference to latency. For example, RTMP (Real-Time Messaging Protocol) and WebRTC (Web Real-Time Communications) are the standards for low-latency streaming. We’ll dig into those shortly. Another major consideration is your streaming server or cloud service. You’ll want streaming technology that provides you with fine-grained control over latency and video quality, as well as the greatest flexibility.

Security

How will you protect your gated content from unauthorized use across all consumer devices? A lot of factors are at play to ensure that your video streaming site is designed for security.

• Network background – a dependable CDN to guarantee global presence and instantaneous connection; 24/7 monitoring and backup to provide content availability in case of a server failure.
• Token security – to prevent content redirection to a 3rd-party source without the owner’s approval.
• Domain restriction. A feature called referers allows to lock content to a specific domain. It prevents seeing the embedded link in the source code and so it cannot be embedded into another site.
• Geographical restriction – you may want to exclude certain locations for copyright and licensing agreement reasons.
• Watermarking – gives an added level of live stream security in the sense that you maintain rights to your own content.
• Viewer payment security. You will need full SSL encryption of transactions done via your paywall. This sort of encryption provides a series of checks to ensure safety of user payment data.

Dig into video streaming protocols

If you’re going to be setting up a VOD or live-streaming platform, you may want to look a bit deeper into the streaming technology. Don’t panic! We’re here to help. Most video files aren’t designed for streaming. A video streaming protocol is a standardized delivery method for breaking up video into chunks, sending it to the viewer, and reassembling it. Don’t mix it with a codec, which refers to video compression technology. How you choose a protocol depends on your priorities. Do you want quality? Or does latency matter? In the former case, go for adaptive bitrate (ABR) protocols, which deliver the best video quality there is with the current internet speed. In the latter, choose low latency ones. Some protocols only work on certain systems. Others focus on digital rights management (DRM). Let’s have a look at the most popular ones to-date.

RTMP

 Real-time messaging protocol (developed by Macromedia) is widely used today primarily for ingesting live streams. It’s still the best option when it comes to real-time streaming as it has the least latency among other technologies. It is also used as a fallback for HLS, HDS, SmoothStreaming or DASH when it comes to platforms that don’t support these protocols. But there’s a catch. You may send the video to the CDN using the RTMP protocol, but you need another one to deliver it to the end-user (normally, HTL streaming protocol). Why? Since RTMP is dependent on the Flash plugin, which has security issues, this protocol has been phased out on the viewer-facing side.

MPEG-DASH

 Moving Picture Experts Group Dynamic Adaptive Streaming over HTTP (MPEG-DASH) is an up-and-coming option, interesting in many ways. It’s a vendor-neutral standard, compatible with almost any encoding format. Due to its ability to adjust second-to-second, MPEG-DASH fixes some long-standing technical issues with delivery and compression. How come? It implements AI to select segments and intervals in the multimedia contents with highest bitrate possible that can be downloaded for playback without buffering. This results in less data used during the streaming. The protocol supports encrypted media extensions (EME), which are standards-based APIs for browser-based digital rights management (DRM). The only downside, the support of H.265 codec is out of bounds for licensing reasons.

HLS

 HTTP Live Streaming (HLS) protocol seems like the safest bet for now. It’s widely known as robust and delivers the best audience experience. Originally developed by Apple to drop Flash from iPhones, it’s now supported on desktop, smart TVs, Android, and iOS. HTML5 video players also natively support HLS (but not RTMP). So if you are planning on scaling, this is your number-one choice for creating a streaming service.

WebRTC – real-time communication technology of the future

 The magic of WebRTC lies in its ability to transmit audio and video between browsers in real-time with no downloads or plugins. You simply open a web page and start communication. It delivers voice, video, enables screen sharing, whiteboarding, online gaming with no additional client‐end software beyond a standard web browser. In other words, it opens the door for live, end‐to‐end communications from nearly any endpoint: phones, web pages, kiosks, automobiles, and even household appliances. Its simplicity and potential ubiquity make it great for video streaming, especially in the areas of video teleconferencing and peer-to-peer data exchange. WebRTC (Web Real Time Communication) is in fact not a protocol, but a protocol stack.  The protocol is based on three main APIs:

• MediaStream. Responsible for enabling web browser to receive audio and video signal from cameras or user’s desktop.
• RTCPeerConnection. Responsible for the connection between browsers to exchange media data received from a camera, microphone or user’s desktop. Its ‘duties’ also include signal processing (cleaning it up from background noise, adjusting the microphone level) and controlling audio and video codecs used.
• RTCDataChannel. Responsible for two-way data transmission through the established connection.

Clearly, WebRTC is far more complex than HLS. It provides tight data exchange between the sender and the recipient via RTCP-feedback, bandwidth control and latency targeting. So it’s ideal for live streaming where low latency is a must. Combined with RTMP for stream ingestion, it makes a perfect solution for real-time streaming technology.  Are you still here?! Congrats! You’ve made it to the reward (remember? We promised). Get your prize!

BONUS! A video streaming website startup kit

As a startup, you’re looking for some feasible and cost-effective tech solution of how you can start a streaming website. Below is a proof of concept for a project CodeTiburon helped implement. It involved building a VOD website on the base of AWS. 

building a VOD website on the base of AWS. 

Check our product

CodeTiburon took a step further to develop a white-label solution Vodnext. Want to know more? Book a demo with no strings attached.

Share This