Apple TV Tech Talk – Designing for Apple TV

This blog article was co-written with Yoseob Lee, iOS Engineer at Prolific Interactive

This year I had the chance to participate to the Apple TV Tech Talk in New York. This blog post is the second of a series of blog posts on interesting subjects Apple shared with us about tvOS but also iOS.

Designing for Apple TV is a completely different challenge than designing for iOS. The size of a TV screen is clearly the biggest difference. There is more space to cover with your app, so you have to make sure your design makes sense for that size. You also have to keep in mind the context people are using your app in. There is an expectation among TV watchers to be active and entertained.

Below are some tips that Apple shared during the recent Apple TV Tech Talk in New York City to help improve your app experience.

Loading

MsYWd

How many times have you seen this image? Isn’t it the most frustrating thing when you want to access data? In order to improve the loading experience in your app, there are several things you can do that will reduce loading indicators and give your users a more fluid app experience.

Blank screens should be avoided at any cost; it’s not acceptable for your tvOS app to not provide some feedback to your users when crucial background tasks are being performed. At minimum, you should provide an activity indicator like the one above. Even better would be to provide a loading bar that gives a time estimation and feedback on what is going on. Making frequent use of placeholder images when you asynchronously download images online is a little trick that will make a difference and allow your UI to display faster. You can also use animations to entertain your users and make time feel a lot shorter. Think about your video game character running, or an activity indicator with a fancy animation. Finally, try download as much data as possible beforehand in the background, so your users don’t have to wait to access the data they want.

Authentication

It’s very difficult to type information on the Apple TV using the remote control. Apple provides a handy virtual keyboard, but using the remote to type is not a great experience for your users. To improve this experience, try to delay the login page until you really need it instead of asking users to login right away. Furthermore, only ask for the bare minimum of information such as their email address and password . Some apps have also been providing a temporary code system, allowing the user to authenticate by using a code from their website. While this will require your users to access the website from their phone, at least the typing experience will be much simpler. You can also make a companion app, or use your current iOS app, to provide a way to authenticate from your phone using Bonjour. Since iOS 9.2, the iOS remote app can also be used to replace the Apple TV remote, allowing your users to type information directly from their phone. Remember that your TV is not a personal device like your phone; it’s a device that you share with people, so try to have an easy way to switch between different sessions so they don’t need to repeatedly input their credentials again.

Onboarding

This is mostly true for games, but it also applies to regular apps: try to avoid onboarding screens as much as possible. Your users want to be entertained, so let them play around with the app so they can discover how to do things themselves. Your UI should be descriptive enough to not be explained by an onboarding screen. If you are working on a video game, show the controls in the pause menu; if users pause the game, it’s the perfect opportunity to teach them something.

Cursors

People don’t want to work on their TV; they want to be entertained. Having a cursor is a bad way to remind them of their desktop computers. Instead of cursors, use the focus engine to provide some feedback on the UI. Apple noticed that a lot of video games on Apple TV are using cursors to navigate in the menu. They demonstrated how hard and frustrating it is for a user to move the cursor to highlight the UI item they wanted. By using the focus engine, you provide an efficient way to navigate inside your app that is more entertaining than a mouse cursor.

Principles of Designing a tvOS App

Developing an Apple TV application is — from a purely technical standpoint — pretty similar to developing a mobile application. However, when it comes to the actual design, there are few key points that a developer (and a designer) should think about:

  • Connection
  • Clarity
  • Immersive

Connection

  1. A new show is premiering and you and a group of friends have gathered to watch it at your apartment.
  2. A new show is premiering and you pull it up on your phone to watch it on the go.
  3. A new show is premiering and you pull it up on your laptop for you and a group of friends to watch together.

Can you spot the odd one out? (Hint: Where are your friends?) There is an inherent difference in the way media is consumed on TV versus personal mobile devices — connection.

Throughout television history (think Breaking Bad or American Idol) it has drawn people together. While Apple TV apps aren’t limited to typical “shows,” this sense of connection is what designers should strive to emulate within their own applications.

Take for example, the home screen. At first glance, there doesn’t seem to be very many actions a user can take aside from scrolling between elements on the screen and selecting one. However, a user can “swipe” around an individual element, and what once seemed static is actually dynamic and, more importantly, interactable.

Clarity

Striving for clarity is something that goes without saying; however, think about the fundamental difference in how a user interacts with a mobile app versus a tvOS app. In an iOS app, the user has absolute freedom; they are able to, theoretically, interact with anything on the screen.

On the TV, the Siri Remote is the gatekeeper between what the user wants to do and what actually happens. Fret not, Mike Stern, User Experience Evangelist at Apple, provides these quick tips to design around this limitation to boost clarity and avoid ambiguity:

  • Avoid overly small font sizes
  • Big, bold, better
  • “Never Get Lost” (think of the Menu button as a built in “back” button)

Immersive

A television screen is bigger. Place your phone against the corner of the closest television screen and you’ll notice — it’s a lot bigger. Supporting a 1920×1080 resolution, you can take advantage of the larger canvas to really design an immersive experience for the user.

If there’s only one thing you take away from this post, let it be this: Test your application as if you are in a living room! This means taking a step back to be a suitable distance away from the television set.

Designing for a tvOS application is no more difficult than designing for an iOS application, but it requires considering a few additional components and the new medium.

Started from the Bottom Now You’re Here – Featured

The App Store promotion email is one of the most highly sought after emails in the world of iOS development. It signifies that, among the multitude of apps in the app store, your app passed the rigorous evaluation by Apple to join the esteemed ranks of Featured Apps.

With the Apple TV App Store projected to reach “10,000 apps in early 2016”, even the most well-developed applications will never see the light of day without some clever marketing. Here are some tips that Apple shared on how to optimize your app to better your chances of making it to the front page of the App Store.

App Store Optimization – Keywords

Twitter has a character limit count of 140; Apple TV has 100.

It might not seem like a lot, and it isn’t, but heed these simple tips to get the most out of each character:

Original Keywords

school, schools, education, AppTutor, student, students, teacher, professor, professors, lesson (95 characters)

Here are Apple’s suggestions on how to improve these keywords to make them stronger:

  • Use commas between words, noSpaces
  • Don’t include your app name
  • Don’t include your app category
  • Don’t include plurals

Based off these tips, here is our revised list:

Revised Keywords:

school,student,teacher,professor,lesson,classroom,homework,study,mentor,tutor,instructor,library (96 characters)

By simply implementing these four easy tips, we were able to free up a significant amount of characters that we could then use for more meaningful alternatives. These 100 characters are crucial to your app’s visibility to users so take advantage of every. single. one.

Getting Featured

No one really knows the exact process by which an app is selected for feature in the App Store (unless you work at Apple), but these are some general guidelines presented at the Apple TV Tech Talks:

  • Make a great app. Strive to develop an app that is unique and engaging in a living room setting. Implement a solid first-time experience and creative ways of using the Siri Remote — and of course, design your app for the Apple TV, this isn’t the iPhone or iPad anymore.
  • Understand the process. Keep in mind that the Apple App Store is refreshed every Thursday and it’s your job to get into the mindset of the people on the other side. From the conference it seems that the overlords of the App Store love themes and holidays, have a preference for localized content and are most focused on your app’s initial launch and any significant updates.
  • Let them know. The team behind the App Store face the daunting challenge of combing through hundreds, if not thousands, of apps every day. Take that extra step and make it easier for them – by doing the work yourself! It’ll show that not only do you understand the process but are confident that your app is up-to-par.

Shoot an email over to appstorepromotion@apple.com with your app bundle ID, category, and features. If you have a product roadmap or a marketing and PR plan — include that in the email as well. The most important thing to keep in mind is that you should aim to send this email 3–4 weeks before your release date!

Treat this email as a golden ticket, take the time to think things through and you’ll be one step closer to achieving the Featured Apps dream.