Portfolio Gagan Arora
All projects

Project · OTT Platform

NABTT

An OTT platform with family profiles, parental controls, subscriptions priced by region, adverts mapped to individual videos, and real-time analytics behind it.

Open the live platform Ask me about it

At a glance

What's Inside

What is where, and how it connects. Select any node to read more about it.

The project

NABTT

An OTT platform. Viewers sign in, choose a profile and watch movies, series and shorts; parents set limits for their children; and subscriptions, adverts and analytics run behind it.

  1. NABTT · Part 1 of 5

    Getting in

    What a viewer meets first: an account, a profile to watch as, and a PIN on it if one is set.

    • NABTT · Getting in

      Accounts

      A viewer creates an account and signs in by email.

      • Sign-up asks for an email, gender, date of birth and an optional phone number with its country code.
      • Sign-in is by email and password, with a forgot-password route.
      • A language selector sits on the sign-in screens.
      Leads to
      Profiles

    • NABTT · Getting in

      Profiles

      After signing in, the viewer chooses who is watching.

      • One account holds several profiles.
      • A profile can be a kids profile.
      • Profiles are added and managed from the same screen.
      Comes after
      Accounts
      Leads to
      Profile PIN

    • NABTT · Getting in

      Profile PIN

      A profile can be locked, so opening it needs a four-digit PIN.

      • The PIN can be shown while it is typed.
      • A forgotten PIN is reset with the account password.
      Comes after
      Profiles
      Leads to
      Home

  2. NABTT · Part 2 of 5

    Watching

    The viewing itself: a home screen of titles, a page for each one, the player, and the lists and downloads that go with them.

    • NABTT · Watching

      Home

      The home screen opens with a featured title and rows of content to browse.

      • Rows include Most Viewed, Arabic Animation, English Animation and Preschool Time.
      • The featured title offers Watch Now and My List.
      • Episodes that are free to watch are marked.
      Comes after
      Profile PIN
      Leads to
      Title pages

    • NABTT · Watching

      Title pages

      Every movie or series has its own page, with a description, genres and running time.

      • Series list their episodes by season.
      • A title can be liked, shared, or added to a list.
      • Shorts linked to the title appear on its page.
      Comes after
      Home
      Leads to
      Playback Watchlists

    • NABTT · Watching

      Playback

      Pressing Watch Now plays the video, streamed over HLS through signed URLs.

      Comes after
      Title pages
      Leads to
      Live analytics
      Built with
      HLS Streaming

    • NABTT · Watching

      Watchlists

      Titles saved with My List are kept in a watchlist.

      • Each child profile has a watchlist of its own.
      • A title can be added to a child's list from its page.
      Comes after
      Title pages

    • NABTT · Watching

      Downloads

      Movies can be downloaded, and the Downloads screen lists them.

    • NABTT · Watching

      Shorts

      A Shorts section holds short clips, which also appear on the page of the title they belong to.

  3. NABTT · Part 3 of 5

    Parent oversight

    What a parent controls for a child's profile: what it may show, and for how long.

    • NABTT · Parent oversight

      Child profiles

      A parent creates a child profile, and a watchlist for it, from the Parent Oversight screen.

      Leads to
      Age filter

    • NABTT · Parent oversight

      Age filter

      Each child profile has an age filter that limits what it can show.

      • Left at Any Age, the profile has no age restriction.
      Comes after
      Child profiles
      Leads to
      Screen time

    • NABTT · Parent oversight

      Screen time

      Viewing time on a child profile can be limited in one of two ways.

      • A number of minutes a day, set for each day of the week.
      • Or scheduled hours for each day.
      • Times follow the timezone chosen on the screen.
      • With neither set, the profile has unlimited screen time.
      Comes after
      Age filter

    • NABTT · Parent oversight

      Watchlist-only mode

      A child profile can be restricted to the content in the parent's watchlist.

      Comes after
      Screen time

  4. NABTT · Part 4 of 5

    Monetisation

    How the platform earns: Stripe subscriptions priced by region, and adverts placed in the videos.

    • NABTT · Monetisation

      Paid plans

      Watching is paid for by subscription, and the subscriptions run on Stripe.

      • An Upgrade Plan option sits in the main menu.
      Leads to
      Regional pricing
      Built with
      Stripe

    • NABTT · Monetisation

      Regional pricing

      The price of a plan depends on the viewer's region.

      Comes after
      Paid plans
      Leads to
      Payment checks
      Built with
      Stripe

    • NABTT · Monetisation

      Payment checks

      Stripe reports each payment event by webhook, and every incoming webhook is validated before it is acted on.

      Comes after
      Regional pricing
      Built with
      Webhooks

    • NABTT · Monetisation

      Ad insertion

      Adverts are inserted into videos dynamically.

      Built with
      Dynamic Ad Insertion

    • NABTT · Monetisation

      Per-video adverts

      Adverts are mapped at the level of the individual video, so each video carries the adverts chosen for it.

      Comes after
      Ad insertion
      Built with
      Video-Level Ad Mapping

  5. NABTT · Part 5 of 5

    Behind the scenes

    What runs out of the viewer's sight: analytics, access by role, and notifications.

    • NABTT · Behind the scenes

      Live analytics

      What viewers do is tracked as events, and the analytics update in real time.

      Comes after
      Playback
      Built with
      Event Tracking Real-Time Analytics

    • NABTT · Behind the scenes

      Roles and access

      Access is governed by roles: what someone can do depends on the role they hold.

      Built with
      RBAC

    • NABTT · Behind the scenes

      Notifications

      Notifications are pushed to viewers through Firebase Cloud Messaging.

      • A viewer's account also keeps a list of their notifications.
      Built with
      Firebase FCM
NABTT as a graph: the platform, its five parts, and what each part holds. Lines show what belongs where; select a node to see what it leads to.

Case study

The Story

Problem

NABTT is a subscription OTT platform. Around the player it needs profiles for a whole family with controls for parents, paid plans priced by region, adverts matched to individual videos, and a live picture of what viewers are doing.

Solution

A platform with viewer accounts and profiles, parental oversight with age filters and screen-time limits, Stripe subscriptions priced by region, dynamic ad insertion with video-level ad mapping, real-time analytics and event tracking, role-based access control, and push notifications through Firebase Cloud Messaging.

Technical decisions

  • Video is streamed over HLS, through signed URLs.
  • Each child profile carries its own age filter and screen-time limits.
  • Stripe subscriptions use region-based pricing.
  • Incoming Stripe webhooks are validated.
  • Adverts are mapped to individual videos and inserted dynamically.
  • Access is governed by roles (RBAC).

Outcome

Live for subscribers at user.nabtt.com.

Want to know more about this build?

I'm glad to walk through how it works behind the scenes.

Get in touch All projects

The source code and internal screens of this project are not public.