EPG (Channel guide) page

Prev Next

Compatibility notes: This article details the newly designed EPG, compatible with Deltatre Apps 1.0 onwards, bringing AXIS closer to industry standards for EPG user experience, and the legacy EPG (before Deltatre Apps 1.0).

In this article, we introduce the Electronic Program Guide (EPG).

The design, layout, and visual appeal of your apps play a huge part in providing a great user experience to your customers. Presentation Manager offers pre-made page templates, enabling you to tailor the look and feel of your AXIS Apps to your customer's needs, right out-of-the-box. To understand more about templates, as well as how they look on different platforms, read on below:

What is an EPG?

The Electronic Program Guide (EPG) uses the AXIS Presentation Manager EPG (Channel guide) page template and displays a grid format of on-air channels and their program schedules. The EPG covers seven days of forward scheduling data, allowing users to easily navigate and find upcoming content, enhancing their viewing experience.

The updated EPG (from Deltatre Apps 1.0 onwards) features an intuitive design that allows users to easily find and plan their viewing, as well as increased engagement through clear presentation of on-air and upcoming content, encouraging users to explore the full range of programming.

The EPG (Channel guide) page template displays a grid format to showcase on-air channels and their schedules, enhancing the user's viewing experience.

We recommend using two rows for the EPG page: the H11 hero text row for the header, and the EPG1 channel grid for the content.

💡 Visit our Create live linear and EPG content article for quick tips and suggestions on setting up EPG content. For more information on row types, read our Pages and supported rows article.

Key EPG features from Deltatre Apps 1.0 onwards includes:

  • Grid view structure for intuitive channel and show browsing

  • Clear indication of currently live shows

  • Easy navigation to upcoming shows with timing information

  • Date-wise and channel-wise schedule segregation

  • Basic metadata for assets to aid user decisions

  • Smooth navigation within the EPG page

  • Interaction journeys for both assets and channels

Customization options from Deltatre Apps 1.0 onwards:

While the core functionality remains consistent, it's possible to customize certain aspects of the EPG to suit your specific needs:

  • Channel order: Set the default order of channels in the backend

  • Asset display: Customize the metadata shown for assets

  • Schedule: How many days of EPG schedule is available to view 

How it works

The EPG page consists of two main components:

  1. Channel list: Displayed in the first column, showing channel logos in the default order (specified in the backend).

  2. Program schedule: Subsequent columns show the asset schedule for each channel, including:

    1. On-air assets: Displayed with imagery, asset progress bar, and title

    2. Upcoming assets: Shown with asset title and start/end times

Select an accordion below to view EPG examples:

EPG functionality (from Deltatre Apps 1.0 onwards)  

On Responsive desktop, users can navigate through the EPG using the following features:

  • Date selector: Allows users to choose specific dates for viewing schedules

  • Time tracker: Shows the time in 30-minute increments

  • Live now indicator: Displays the current time

  • Channels: Selecting a channel tile directs users to the Channel details page

  • Grid navigation arrows: Displays on the right of the grid, allowing users to view future schedules in 1-hourly increments

Example showing EPG on Responsive desktop:

EPG RW.png

For On Now/Live assets, hover over grid cells to view a pop-up dialog featuring relevant metadata and Watch and More Details CTAs. Select Watch to initiate playback, and select More Details to view the item/event detail page.

Example showing EPG with On Now/Live pop-up on Responsive desktop:

Watch:more details EPG RW.png

For upcoming assets, hover over grid cells to view a pop-up dialog featuring relevant metadata and a More Details CTA. Select More Details to view the item/event detail page.

Example showing EPG (upcoming assets pop-up) on Responsive desktop:

More details EPG RW.png

Fallback imagery displays when there is an image loading issue or if images are not configured in the back end.

Example showing fallback imagery on Responsive desktop:

EPG1_ Fallback image in hero & grid.png

On Responsive tablet and mobile, users can navigate through the EPG using the following features:

  • Date selector: Allows users to choose specific dates for viewing schedules

  • Channels: Selecting a channel tile directs users to the Channel details page

Example showing EPG on Responsive tablet:

EPG tablet.png

For On Now/Live assets, selecting a grid cell initiates playback.

For upcoming assets, selecting a grid cell displays a pop-up dialog featuring relevant metadata and a More Details CTA. Select More Details to view the item/event detail page.

Example showing EPG (upcoming assets pop-up) on Responsive tablet:

More details EPG RW (tablet).png

Example showing EPG on Responsive mobile:

EPG mobile.png

For On Now/Live assets, selecting a grid cell initiates playback.

For upcoming assets, selecting a grid cell displays a pop-up dialog featuring relevant metadata and a More Details CTA. Select More Details to view the item/event detail page.

EPG examples (upcoming assets pop-up) on Responsive mobile:

More details EPG RW (mobile).png

On TV Apps, users can navigate through the EPG using the following features:

  • Date selector: Allows users to choose specific dates for viewing schedules

  • Time tracker: Shows the time in 30-minute increments (WebTV and Android)

  • Live now indicator: Displays the current time on WebTV and Android TV, and the 'LIVE' badge on Roku

  • Channels: Selecting a channel tile directs users to the Channel details page

On TV Apps, the detail hero (EPG1 row) displays above the EPG grid, beneath the asset tile, providing additional information on the asset in focus, e.g., Homes Under the Hammer in the example below.

EPG example on WebTV/Android TV:

EPG1 TV.png

EPG example on Roku (LIVE badge):

Roku EPG.png

For On Now/Live assets, selecting a grid cell initiates playback.

For upcoming assets, selecting a grid cell displays a pop-up dialog featuring relevant metadata and a More Details CTA. Select More Details to view the item/event detail page.

EPG examples (upcoming assets pop-up) on WebTV/Android TV:

More details EPG TV Apps.png

Fallback imagery

Fallback imagery displays when there is an image loading issue or if images are not configured in the back end.

Example showing fallback imagery on WebTV/Android TV (Homes Under the Hammer asset):

EPG1_ Fallback image in hero & grid.png

EPG functionality (before Deltatre Apps 1.0)

EPG example on Responsive web (desktop):

Channel_Guide_Page_Type_-_Responsive_Web.jpg

EPG example on TV Apps:

Channel_Guide_Page_Type_-_TV.jpg

EPG example on Native mobile:

Channel_Guide_Page_Type_-_Mobile.jpg

EPG example on Native tablet:

Channel_Guide_Page_Type_-_Tablet.jpg