All Collections
Website and App Development
Design guide - Assets required for Streaming Website
Design guide - Assets required for Streaming Website
Anjana avatar
Written by Anjana
Updated over a week ago

To create a visually appealing streaming website for your viewers, we require specific assets from you.

Here are assets you need to provide:

Image Aspect Ratio and Dimensions:

  • 16:9 - 1920 x 1080 pixels

  • 4:3 - 1440 x 1080 pixels

  • 3:4 - 1080 x 1440 pixels

  • 1:1 - 1080 x 1080 pixels

Theme:

Choose a theme that aligns with the identity of your content. For this article I've explained the defaults based on theme - Hybrid. You can choose any other theme as well

Theme Presets:

Once you select a theme its presets are applied to your content

Typically on the below page types

  • Movie Content

  • Series Content

  • EPG / Live TV Content

Here are the widgets that are used on these pages

1. Header

There are 3 header layouts, you can customize it based on your requirements

Default Header - Hybrid Theme

Header Style 2

Header Style 3

2. Footer:

There are 5 styles of footer

Default Hybrid Theme Footer

Footer Style 2

Footer Style 3

Footer Style 4

Footer Style 5

3. Carousel:

Carousel supports only 16:9 aspect ratio images.

There are 3 layouts for your carousel

Default Hybrid Theme Carousel

Carousel Style 2

Carousel Style 3

4. Horizontal Listing / Grid Listing:

  • Horizontal listing displays multiple videos under a single category in one row.

  • Grid listing displays multiple videos under a single category in multiple rows.

Horizontal Listing

Grid Listing

  • Three layouts are available for both horizontal and grid listings, supporting 16:9, 3:4, and 1:1 aspect ratios.
    ⚠️ Note: Default layout for Horizontal/Grid Listing: 16:9 (Medium)

Default Horizontal Listing

Listing Style 2 (Detail over Thumb)

Listing Style 3 (Circular) - 1:1 image needed

Details that can be Displayed:

  • Title: Name of the content (video/show/playlist).

  • Subline:Select the details to be displayed (e.g., Video name, Duration, Rating, Release Date, Publish date, Show Name, Category name)
    ⚠️ Note: Any two details to be highlighted in the Subline section.

Each horizontal listing layout (16:9, 1:1, 3:4) has different card sizes: Small, Medium, Large, Extra Large, Jumbo.

⚠️ Note: Default Horizontal Listing card size: 16:9 (Medium)

Jumbo - 16:9

Extra Large -16:9

Large - 16:9

Medium - 16:9 (Default)

Small - 16:9

5. EPG (Electronic Program Guide)

Channel Logos: We will need logos for each channel to be added to the EPG.

Here is how it will look

6. Detail Page - Video/ Movie / Show/ Season Page

For the Detail pages, we need high-resolution 16:9 preview images.

⚠️Note: The preview image is associated with the content, eg, the thumbnail of a video.

Movie Detail Page

Video Detail Page

Show/Season Detail Page

Supports the following widgets:

  • 16:9 Full width scroll widgets

  • Grid listing

  • 1:1 hero image scroll widgets

  • Message widgets

For each of these widgets the below components can be added

  • Title

  • Overline

  • Subline

  • Description

  • Button

  • 16:9 image

  • 1:1 image

  • Grid listing

  • Video Player

Ad Banner:

  • Can be added in 32:9 aspect ratio.

Note:

  • Ensure all images are high-resolution and optimized for quick loading.

  • The theme presets and layouts mentioned above are just examples. You can explore and choose the ones that best suit your needs.

Did this answer your question?