Accessibility

Customizing your branding in Adobe Media Player

Adobe

 

Note: The following article is adapted from the Adobe Media Player 1.5 Content Developer Kit, available for download from the Adobe Media Player Developer Center home page.

Branding allows you to extend your presence in Adobe Media Player. Adobe Media Player provides the ability to display branding using background images, banners, logos, and overlay ads. This article explains branding basics, including how branding works in Adobe Media Player.

Adobe Media Player offers a flexible platform that gives you the benefits of brand customization, while also providing the advantages of media aggregation to viewers. Branding in Adobe Media Player is similar to what is available in standard MRSS for logos and images. However, Adobe Media Player offers additional functionality that allows you to integrate branding around your content.

You can integrate custom graphics into key areas of Adobe Media Player. To most effectively showcase your branding elements within Adobe Media Player, and minimize competition between brands, branding elements are integrated into the content viewing area itself, at the Network and Show level. This approach maximizes viewer exposure to your branding, while eliminating viewer exposure to simultaneous and conflicting advertising or branding messages. You can define branding within your Feeds, as well as within Enhanced Feeds. With Enhanced Feeds, however, you can provide dynamic advertising to your viewers, that changes as the viewer watches your video content. For more information on adding dynamic advertising to your video content, see Delivering your advertising in Adobe Media Player.

Overview of the brand extension workflow

There are a fixed number of branding elements that you can provide for display in the content viewing area of Adobe Media Player. The assets for the branding elements are supplied directly by you in the Feeds of your shows, making the process of adding these elements simple and flexible.

A high-level description of the branding workflow is as follows:

  1. Create your desired branding assets according to the Adobe Media Player Brand Assets criteria.
  2. Publish your branding assets on a server.
  3. Customize your show Feed to include the relevant branding extensions. For more information on adding branding to your Feed, see the "Adding branding" section later in this article.
  4. Adobe Media Player downloads and stores the branding assets referred to by the Feed extensions.
  5. Adobe Media Player displays these branding assets on the appropriate screens when your video content is displayed.

Branding assets

Adobe Media Player enables branding of shows using background images, and banners (half and full). Figure 1 shows the primary kinds of branding assets:

For information on logos and overlay ads, see "Advertising assets and viewer experience" in Delivering your advertising in Adobe Media Player.

Figure 1. Main branding areas within Adobe Media Player: half-banner (a), full banner (b), background image (c)

Supported file types for branding assets and content

Table 1 describes which file types Adobe Media Player supports for each region. For information on supported file formats, see "H.264 and supported file formats" in Preparing and customizing content in Adobe Media Player.

Table 1. File formats supported by region in Adobe Media Player

Region File Format
Content FLV and F4V, H.264
Banner PNG, JPEG, GIF, SWF
Background PNG, JPEG, GIF, SWF

Branding element sizing and scaling

There are several custom branding elements that you can provide. Table 2 lists the various branding elements and their sizing and scaling rules in detail.

Asset type Episode logo Show Logo Show Background Show Banner Show Half-Banner Show Featured Logo
Element name Branding delivered via MRSS thumbnail amp:logo; ampshowLogo amp:background; amp:showBackground amp:banner; amp:showBanner amp:halfBanner; amp:showHalfBanner amp:showFeaturedLogo
Element type   URL to image URL to Image URL to Image URL to Image URL to Image
Dimensions 88 x 66 250x250 1024x576 686x60 (some scaling) 234x60 216x144
Display when missing? Placeholder

Feed image (Atom: feed.icon, RSS 2.0: rss.channel.image, RSS 1.0: N/A)

If no Feed image is specified, a default placeholder image from Adobe displays

 Nothing Feed title (Title of the Feed) Feed title Show logo, or a placeholder image
Relevant screens New Episodes, My Favorites episode list My Favorite Shows, New Episodes, Catalog Dashboard Featured, Home screen Featured, Home screen Showcase Animation, Home screen Recently Added New Episodes, Video Player, Catalog Dashboard Featured header New Episodes, Show pod Episode list when viewing from My Favorites Home screen Featured Shows panel
Scaling rules Scale to fit 88 x 66 My Favorite Shows and New Episodes scale to fit 66x66, Catalog Dashboard Featured and Home screen Showcase Animation scale to fit 134x133, Home screen Featured scale to fit 250x250, Homescreen Recently Added scale to fit 32x32 Scale to fit based on Video Player window size, scale to fit based on application window size x 201 Scale to fit 686x60 Scales to fit 234x60 Scale to fit 216x144
Notes   Defines the show logo. If a show is featured in the Catalog, the Show Logo displays on the Adobe Media Player Home screen. These dimensions are not square. Ensure that artwork allows for image clipping so that the logo displays correctly when featured. Also, ensure that the key branding elements are vertically centered, to avoid logo cut-off if the show displays in the Featured view of the Catalog. Defines background image for the show. In some screen configurations, the left third of the image is covered. Defines a rectangular banner that represents the show. The recommended size is 686x60 pixels, though the banner scales horizontally as the application window is resized. Defines a half-size rectangular banner that represents the show, when episodes for a show are in 1/3 view. If no such element is specified, the region displays a black background with the Feed title centered horizontally and vertically. Include this image asset if you are to be featured on the Adobe Media Player Home screen

Note: Show Logo and Show Background assets only need to be provided once, in one size. The assets are sized and scaled, as described in the following diagram, to display in different areas of the application.

For information on adding network branding to Adobe Media Player, see "Setting up a Network" in Preparing and customizing content in Adobe Media Player.

Note: For information on networkSmallLogo and other featured assets, see the section "An overview of the Network setup workflow" later in this article.

Referencing branding in your Feed

To ensure your branding displays correctly in Adobe Media Player, integrate the following recommendations:

Adobe Media Player processes extensions in the following manner:

Adding branding to your Feed

Add branding to your Feed by implementing branding extensions.

  1. Create your desired branding assets according to the Adobe Media Player Brand Assets criteria.
  2. Publish your branding assets on a server.
  3. Customize your show RSS feed to:
    • Include the URLs of the branding assets published to your server.
    • Include an entry for each branding asset (for example, show logo). Following is an example of a Feed containing a full set of branding extensions: 
<?xml version="1.0" encoding="UTF-8"?> <rss version="2.0" xmlns:media="http://search.yahoo.com/mrss" xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" xmlns:amp="http://www.adobe.com/amp/1.0"> 
    <channel> 
       <title>MyShow</title> 
       <copyright> 
       <link>http://www.mysite.com/MyShow/</link> 
       <description> 
         Desciption of show 
       </description> 

       <language>en-us</language> 

       <ttl>30</ttl> 

       <image> 
         <title>MyShow</title> 
         <width>100</width> 
         <height>100</height> 
         <link>http://www.mysite.com</link>             
         <url>http://mysite.com/myShow/images/myShow_show_icon.jpg</url> 
       </image> 

       <!-- Network Assets --> 
       <amp:networkSmallLogo> http://mysite.com/myShow/images/network_small logo.jpg</amp:networkSmallLogo> 

       <!-- Show Assets -->                
    <amp:logo>http://mysite.com/myShow/images/myShow_show_logo.jpg</amp:logo>      <amp:background> http://mysite.com/myShow/images/myShow_background_image.jpg
</amp:background>    <amp:banner>http://mysite.com/myShow/images/myShow_banner.jpg 
</amp:banner>  
<amp:halfBanner> 
http://mysite.com/myShow/images/myShow_half_banner.jpg 
</amp:halfBanner> 
      <item>
        ... 
      </item> 
    </channel> 
</rss>

An overview of the Network setup workflow

If you want to group multiple shows within the context of a single parent brand, complete the following steps:

  1. Enter into a business relationship with Adobe.
  2. Create some Network assets and publish them to a server.
  3. Send Adobe a description of your Network. Descriptions can contain a minimum of two sentences with a maximum of 65 characters per line and a maximum of 195 characters in total.
  4. Send Adobe the URLs to the Network assets; Adobe points them to the Adobe Media Player Catalog.

Table 3 describes the Network asset types and their associated elements in detail. For information on additional branding elements, see the "Branding assets" section earlier in this article.

Table 3. Network asset types and their associated elements

Asset type Element name Element type Dimensions Display when missing? Relevant screens Scaling rules
Featured Logo Not applicable; e-mailed to Adobe URL to image   nothing; no featured placement on the home screen Feature section of the Home Screen. Scale to fit 216 × 144
Network Background Not applicable; manually inserted by Adobe URL to image 1024x576 Nothing Catalog (Network) Scale to fit 1024x576

Note: You can insert Network Logo, Network Small Logo and Network Watermark into your Feed. Network Background and Network Half-Banner images are manually added by Adobe.

Network Logo shows thumbnails for networks displayed in list, while Network Small Logo is used in the show information screen. When adding Network logos to your Feeds, consider the following:

Featuring your Show or Network in the Catalog

Adobe Media Player features partner Networks and Shows in the Featured (FMA) panel of the Adobe Media Player Home screen. To get your Show or Network featured in Adobe Media Player, contact Adobe Strategic Alliance Group at ampbizdev@adobe.com.

  1. If you want to feature your shows or Network in the Catalog and Catalog Home screen view, contact your alliance manager to introduce you to the Adobe Media Player Marketing Team.

  2. Once you have entered a marketing agreement, created the new featured image asset.

    Note: The height of the Featured pod is fixed; the image size is 216 × 144.

  3. If you have not already created a description of your Show or Network, create one to describe your featured content. Descriptions can contain a minimum of two sentences with a maximum of 65 characters per line and a maximum of 195 characters in total.
  4. Once you have created the image asset and description, send Adobe the URLs to the Network or Show assets; Adobe points them to the Adobe Media Player Catalog.

Where to go from here

To learn more about monetizing your video content by delivering advertisements alongside your content, see Delivering your advertising in Adobe Media Player.

Browse the other chapters linked to at left to read more of the CDK.

About the author

This content was authored by Adobe Systems, Inc.