Apple TV UX: 8 Guidelines for Greater Apps

The Presentation inside:

Slide 0

Apple TV UX: 8 Guidelines for greater Apps

Slide 1

Using the TV itself is super easy and almost the same for the past 40 years. Best practice:

Slide 2

Using the TV itself is super easy and almost the same for the past 40 years. Best practice: it! ow to do ws h ma kno nd n my gra Eve

Slide 3

„The future of TV is apps.“ Best practice:

Slide 4

But how do you build an outstanding TV App? Best practice:

Slide 5

CELLULAR’s 8 Guidelines: Best practice:

Slide 6

STICK TO THE APPLE GUIDELINES Best practice: „Already little deviations to the standard Apple TV UI, can eventually pose a bigger challenge for the development than an iOS app.“ SVEN JANSEN , DEVELOPMENT CELLULAR

Slide 7

STICK TO THE APPLE GUIDELINES Apple TV works different from other TV boxes. The all new touch remote changes the interaction with the box and implies new UI principles. Best practice: Recommendations Use interface elements from UI Kit If you decide to deviate from the guidelines, your layout needs to create a new value for the user Best practice: Showtime

Slide 8

MAKE FOCUS OBVIOUS Best practice: „The speed of the Touch Remote is one of the best features on the new Apple TV. Therefore, a clear focus is essential for a good orientation.“ TARA WESTON , CREATION CELLULAR

Slide 9

MAKE FOCUS OBVIOUS While using the Apple TV, the user sits at a distance and needs to have a clear view on what he is doing and where he is navigating. Additionally, he is able to skip through content extremely quickly. Best practice: Recommendations Therefore content needs to be clearly visible at all times Add certain information when your item comes on focus. Apple for example is adding the title Don’t let other content distract your focus Best practice: ZDF App

Slide 10

DISCOVER THE FOCUS Best practice: AS A VALUE „Don’t see the focus as a limitation, but as a chance.“ JOHANNA OPPENHEIM , CREATION CELLULAR

Slide 11

DISCOVER THE FOCUS AS VALUE Focus gains a totally new and higher significance on TV and needs to be rethought. Best practice: Recommendations See, that focus on TV gives you a whole new level to show information Know, that focus on a TV Box works completely different than a mouse over in web and is of way greater importance Distinguish which information need to always be shown and which on focus Best practice: Airbnb

Slide 12

NO DIAGONAL NAVIGATION Best practice: „The remote does not support diagonal directions. Therefore you should avoid diagonal routes for your user.“ THORSTEN JONAS , CREATION CELLULAR

Slide 13

NO DIAGONAL NAVIGATION Even though the touch remote invites the user to make diagonal touch gestures, the Apple TV does not support diagonal navigation. Best practice: Recommendations Build a structure that is easy to use with up, down, left and right navigation Arrange contents in vertical and horizontal lines and avoid dimensional grids If that’s not possible, change your structure and stay with one of the templates Best practice: Movies

Slide 14

USE THE TOUCH PAD WISELY Best practice: „Finally I can touch the TV without having to get up from the couch.“ JÖRN SIEDENTOPP , CREATION CELLULAR

Slide 15

USE THE TOUCH PAD WISELY The new Apple TV remote works completely different than all other remotes. It has a touch pad, which enables a much faster navigation and uses a floating instead of a fixed focus, for example. Best practice: Recommendations Support the users feeling of touching the interface by providing teasers with parallax effect Make use of animations as a result to an user interaction to explain context whenever possible

Slide 16

REDUCE Best practice: „Simplicity and reduction need to be the guiding principles during the creation process.“ SIMONE BRAUNER , CREATION CELLULAR

Slide 17

REDUCE The Apple TV impresses with its light and airy design, which only works without overloaded screens. Furthermore, no one wants to read long copies on TV. Best practice: Recommendations Detect the essential information Know at what point which information is relevant for your user Try to show as much information as possible by using images Best practice: Airbnb

Slide 18

PERFORMANCE DEFINES THE QUALITY Best practice: „Latency in visual feedback to touch input can harm the user experience extremely. That‘s why we made every effort in optimizing the performance of the user interface.“ KAI HUPPMANN , DEVELOPMENT CELLULAR

Slide 19

PERFORMANCE DEFINES THE QUALITY The new Apple TV lives through its fluent and vivid navigation. Every jiggle strikes even more attention than on mobile devices. People are used to having their TV work perfectly at all times. Best practice: Recommendations Technology builds the basis Improve the performance of your app and make it work perfectly for your user Performance is a feeling Use structure, UX, UI, and technology to generate this feeling Best practice: Plex

Slide 20

BE EMOTIONAL Best practice: „TV is great, because it is getting personal.“ GUNNAR HAMM, CREATION CELLULAR

Slide 21

BE EMOTIONAL The TV is the flagship for big and beautiful visuals. Make every screen a cinematic experience Best practice: Recommendations Don’t try to fill every empty space Use rather less content and arrange it generously Avoid tiny artwork, but use fullscreen images to support the cinematic feeling Best practice: Yummly

Slide 22

Naturally this leads to one principle: A TV app should be as easy to use as the TV itself. Best practice:

Slide 23

Thank you. CELLULAR Hamburg, Germany [email protected] Thorsten Jonas Head of Concept [email protected] Credits: Apple TV Product Photos by Apple, ZDF App Photos by CELLULAR Tara Weston Constantin Rueff Concept Design

Slide 24