Apple TV Lesons 7: Crafting icons

First video:

You’ll want to design your icons and launch screen at a size of 1920×1080 and then trim down as needed. Leave at least 90 pixels to each side and 60 at the top and bottom to account for potential overscanning issues. Details are found at the Apple tvOS HIG.

 

Screen Shot 2015-09-10 at 4.48.07 PM

 

I built my icons in Photoshop (here’s hoping El Cap won’t kill my Photoshop!) and imported them into the App Icon & Top Shelf image template. Not all image sizes are listed in the Identity and Type inspector so I had to hunt around a bit. To save you time, here are my sizes:

Front, Middle, and Back (Large): 1280×768

Front, Middle, and Back (Small): 400×240

Launch Image: 1920×1080 (see advice above)

Top Shelf image: 1920×720

For the Top Shelf (this is the MOOSE image in my video), make sure you design side-to-side with enough space and visual punch. This image has a big  role in setting mood.

The front/middle/back sliced images are used to create some of the visual parallax effects. I designed mine all together in Photoshop layers and then saved each one to a different file. I think I may update Art Helper to make this easier.

Your launch image is stored in a separate slot in your xcassets folder so don’t forget it (I did initially) when setting up your art.

One Comment

  • Hello,
    Would you possibly know where the large app icon can be previewed?
    Documentation says it’s used by the App Store but honestly I do not see how or where.
    When I look at any app in the tvOS App Store I do see a large background image but that one is 1920px wide, and it does not look like it’s been scaled up from 1280px.