Our Apple TV icon template for Photoshop will get you started with the proper image dimensions and layering.
Apple took a unique approach when conceptualizing App icons for Apple TV. Instead of being a flattened image, like most Operating System’s icons, tvOS icons are actually composed of individual layers. You’ll need anywhere from 2 to 5 layers for this work.
We’ve built a properly-sized 3 layer template to get you started.
Focus / Touch
With the release of tvOS 10, Apple added Siri to their TV experience. Now a user can launch an app with a simple voice command.
The Siri Remote also features a matte black touchpad. Using the touchpad from the Home Screen, users can “focus” their selection on any app they like.
As the user browses their collection of installed apps, whichever app is currently selected pops into a 3D perspective and displays a subtle but evident amount of parallax motion within the icon. The layers move at slightly varied speeds and the perspective changes depending on what part of the trackpad the user is touching. The operating system also adds some minimal lighting highlights which enhance the effect.
The combined effect makes the icon come to life when the app is selected. To open it, they tap.
For most Operating Systems, icons are pretty straightforward. However, with tvOS, Apple reimagined how icons function. This attention to detail is part of why Apple products FEEL better. The icon effects exemplify one of Apple’s overarching motifs for the tvOS experience… they really want users to feel a sense of connection with the medium.
A Connected Experience
We’re all accustomed to being able to touch our screens to tap exactly what we want. However, TVs present obvious challenges when it comes to intuitive navigation design.
With the Siri Remote, utilizing the trackpad, Apple allows you to virtually touch the screen… and when the icons seem to pop off the screen and change angles in relation to your thumb, you really do feel connected to your TV.
What are Apple TV icon dimensions for tvOS?
To meet tvOS requirements, the largest image dimensions you will need for your tvOS app is 1280×768. You will also need to export other sizes such as 800×480 and 400×240.
How do I use this Apple TV icon template?
First of all, to edit this tvOS icon template, you will need Photoshop or an image editing program that can open PSD files.
Make sure you export all layers as PNG files with transparency enabled (alpha channel), except for the background. The background must be a PNG file without transparency enabled (Save To Web [Legacy]… uncheck “Transparency”).
If you have any questions about how to customize this Apple TV icon template, or want to learn more about how tvOS icons work, please feel free to contact us.
In addition to creating an Apple TV icon, you will also need to create a Top Shelf Image. Use our 3D Image Grid, Top Shelf Image Template for After Effects to make your Top Shelf Image stand out.