Images and Their Specifications

Introduction

For you Brightcove Beacon apps there are five video images that can be used. You can find the image information when you click on a video and then from the details page click the Images link. You will see the following, but of course using your images:

There are hundreds of permutations of where the different images can be used. This is because there are:

• Multiple platforms: Web, mobile, tablet, smart TV
• Multiple entities: Movies, series, seasons, episode, playlists, etc., each which have images associated with them.
• Multiple screens: Movie details, VOD player, favorites, recently watched, etc.
• Multiple layouts for each screen: For example, there are four movie detail layouts
• Different image ratios needed for different layouts: For example, a featured, wide banner carousel uses a different image ratio than a normal carousel.

All those factors influence the image used, hence leading to the multitude of options where a specific image could be used.

The following provides a small insight on how images are used by showing four examples from a web app.

1. The Video Cloud Poster (2:3) used in Movie Details Layout I

   

2. A cropped version of the Beacon Poster used in Movie Layout F

   

3. The Video Cloud Poster (16:9) used in a episodes list

   

4. The Beacon Ultrawide used in a featured, wide banner carousel.

   

   Note that this is the only time the Beacon Ultrawide image is used.
5. In the details I layout, both portrait and landscape images have a fade effect present on the bottom and left side of the image. The following diagram shows how to avoid getting text hidden or cut under the fade effect.

   Portrait

   

   Landscape

   

Video images

Following are details about each of the images, grouped by Video Cloud images then Beacon images:

Video Cloud images

• Video Cloud Poster
  • Created automatically by Beacon Studio
  • Use JPG or PNG
  • Minimum 640px wide
  • Aspect ratio should match video, generally 16:9 or 4:3
• Video Cloud Thumbnail:
  • Created automatically by Beacon Studio
  • Use JPG or PNG
  • Minimum 160px wide
  • Aspect ratio should match video, generally 16:9 or 4:3

Beacon images

The following are specifications for the Beacon video images:

Note: Images may be JPG for PNG

Series and season images

When creating a series or season you will see that three images are required:

These images follow the same specifications as the Beacon video images:

Here is the Landscape image used in a carousel:

Hero image

If you are using a hero image in your page layout, it must meet these specifications:

Corporate logo

You will need to supply your corporate logo for use in the Brightcove Beacon Experience. Follow these guidelines for the image:

Working in Beacon Classic

When entering information in Beacon Classic, you will be asked for Non-Textual Data. This means images for the assets you are currently creating. These images can be broken down into three groups, those being:

Live Events

For live events a page will appear similar to the following (without the red OPTIONAL text over the Thumbnail and Wide Banner, for which you do not need to supply images):

When you encounter this screen, supply a JPEG image for the Portrait Poster and Landscape Poster matching the requirements below. You DO NOT need to supply images for Thumbnail and Wide banner. If not provided, the Thumbnail image will be generated from the Portrait Poster and the Wide banner from the Landscape Poster.

Channel logos

Channel logo images are composed of a thumbnail background and an image (with or without transparency), both with a 16:9 aspect ratio. The following diagram shows how channel logos are created:

This is the Non-Textual Data form you will see for when creating a new channel:

The size requirements are detailed in the table.