Apple TV App Images Apple TV App Images

Apple TV App Images

Alina Zoraian Alina Zoraian

We’ve outlined required and optional image assets for your Apple TV app. At the end of this article is a checklist to make sure you have all the necessary assets when you create your Apple TV app.

 

Required Image Assets

Channel Store Icon

Screen_Shot_2017-03-10_at_11.51.55_PM.png

You will need 2 channel store icons that will be listed in the Apple TV store.

Please note that both channel store icons must have 2 layers. The back layer will be the background and the front layer will be your logo with transparency. When uploading to Zype you will upload each layer separately.

Consider layer separation carefully. If your icon includes a logo, separate it from the background. If your icon includes text, bring it to the front so it’s not hidden by other layers when the parallax effect occurs. Please note the background layer cannot be transparent.

  • Large back: 1280 x 768px, PNG (safe zone approx. 1184 x 710px)       
  • Large front: 1280 x 768px, PNG with transparency
  • Small back: 400 x 240px, PNG
  • Small front: 400 x 240px, PNG with transparency (safe zone = 370 x 222px or see image below)       
  • Small back @ 2x size: 800 x 480px, PNG 
  • Small front @ 2x size: 800 x 480px, PNG with transparency (safe zone approx. 740 x 444px)       

 Screen_Shot_2017-07-07_at_12.45.21_PM.png

 

Top Shelf

The top shelf image will be used when the user has placed your app in the top row of the Home screen. This is a great opportunity for added visibility.

  • 1920 x 720px, JPEG (top shelf regular)
  • 2320 x 720px, JPEG (top shelf wide)
  • 4640 x 1440px, JPEG (top shelf wide @ 2x size)

Screen_Shot_2017-03-10_at_11.53.38_PM.png

Image Background:

This will be the background for your Apple TV channel. We suggest using a simple, dark background (dark enough for light font to be legible on) OR a simple, light background (light enough for dark font to be legible on). Please note this layer cannot be transparent.

  • 1920px  x 1080px, JPEG

Dark background with light text:

Screen_Shot_2017-03-10_at_11.57.41_PM.png

Light background with dark text:

Screen_Shot_2017-03-10_at_11.57.49_PM.png

Launch Screen (Splash Screen):

A splash screen displays when your app starts up. It appears instantly and is quickly replaced with the first screen of your app. Launch images are static and don’t include layers. 

  • 1920px  x 1080px, JPEG

 

Playlist Thumbnails 

If you have a tiered playlist structure, you'll want to add images to all playlists that will be present within your app. You can do this by visiting a particular playlist within the platform, clicking the thumbnails tab and uploading an image. 

  • Standard 16:9 ratio (minimum size: 250px x 141px)

 

Optional Image Assets 

Top Playlists 

Each top playlist image will be associated with a specific playlist and will rotate along the top of your Apple TV channel. Make sure your call to action to that specific playlist is clear (i.e. “See all featured videos >”, linking to your featured videos playlist). This shouldn’t be a space for the sole purpose of adding extra branding to your app. We suggest having 2-4 sliders.

These sliders can be dynamically set up through the Zype platform.

Use this article to add and configure top playlist images for your Apple TV app.

  • 1740px x 700px (per slider)

Screen_Shot_2017-03-10_at_11.55.33_PM.png

Favorites Button 

Our app reference template gives you the option to customize the button that users will click on to favorite a video. 

  • 180px x 100px

Example:

Screen_Shot_2017-03-11_at_12.14.27_AM.png

Un-favorite Button 

Customize the button that users will click to remove a video from their Favorites.

  • 180px x 100px

Example:

Screen_Shot_2017-03-11_at_12.14.43_AM.png

Play Button 

Users can remove a video from their Favorites.

  • 180px x 100px

Example:

Screen_Shot_2017-03-11_at_12.14.48_AM.png

 

Image Asset Checklist  

Name

Size

Required

Large channel store icon, back

1280 x 768px, PNG

Yes

Large channel store icon, front

1280 x 768px, PNG with transparency

(safe zone = 1184 x 710px)

Yes

Small channel store icon, back

400 x 240px, PNG

Yes

Small channel store icon, front

400 x 240px, PNG with transparency 

(safe zone = 370 x 222px)

Yes

Small channel store icon, back @ 2x size

800 x 480px, PNG

 Yes

Small channel store icon, front @ 2x size

800 x 480px, PNG with transparency

(safe zone approx. 740 x 444px)

Yes 

Top Shelf Regular

1920 x 720px, JPEG

Yes

Top Shelf Wide

2320 x 720px, JPEG

Yes

Top Shelf @ 2x size

4640 x 1440px, JPEG Yes

Background

1920 x 1080px, JPEG

Yes

Splash screen

1920 x 1080px, JPEG

Yes

Playlist Thumbnails

Standard 16:9 ratio (minimum size: 250px x 141px)  Yes (add within the platform)

Slider Images

1740px x 700px, JPEG (per slider)  No (but recommended)

Favorites Button

180px x 100px  No

Un-favorite Button

180px x 100px  No

Play Button

180px x 100px  No

Note: After you've added your image assets to the Zype platform, you will download your app bundle. You may need to add image assets with a scale value of x2 within your app bundle code directly.

Image asset files must be aligned with the scale factor and image size and resolution requested by Apple guidelines, here is their documentation and specifications regarding this matter.

How to update or change image assets in your application project:

  1. Within your application project, navigate to ApplicationProjectNameAppleTVapp>Zype>Support files, double click on Assets.xcassets
  2. Upload the missing image with the scale value of x2 for each asset:
    pasted_image_0.png
  3. Run the app through the simulator to confirm that the images are working properly.