24
Apple TV UX: 8 Guidelines for greater Apps

Apple TV UX: 8 Guidelines for greater Apps

  • Upload
    cellular

  • View
    20.184

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Apple TV UX: 8 Guidelines for greater Apps

Apple TV UX: 8 Guidelines for greater Apps

Page 2: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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

Page 3: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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

Even my grandma knows how to do it!

Page 4: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„The future of TV is apps.“

Page 5: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

But how do you build anoutstanding TV App?

Page 6: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

CELLULAR’s 8 Guidelines:

Page 7: Apple TV UX: 8 Guidelines for greater Apps

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

ST ICK TO THE APPLE GUIDELINES

Page 8: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

Apple TV works different from other TV boxes. The all new touch remote changes the interaction with the box and implies new UI principles.

STICK TO THE APPLE GUIDELINES

Best practice: Showtime

Recommendations

If you decide to deviate from the guidelines, your layout needs to create a new value for the user

Use interface elements from UI Kit

Page 9: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

MAKE FOCUS OBVIOUS

„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

Page 10: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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.

MAKE FOCUS OBVIOUS

Best practice: ZDF App

RecommendationsTherefore content needs to be clearly visible at all times

Add certain information when youritem comes on focus. Apple for example is adding the title

Don’t let other content distract your focus

Page 11: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„Don’t see the focus as a limitation, but as a chance.“

JOHANNA OPPENHEIM , CREATION CELLULAR

D ISCOVER THE FOCUS

AS A VALUE

Page 12: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

Focus gains a totally new and higher significance on TV and needs to be rethought.

DISCOVER THE FOCUS AS VALUE

RecommendationsSee, 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 inweb and is of way greater importance

Distinguish which information need to always be shown and which on focus

Best practice: Airbnb

Page 13: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„The remote does not support diagonal directions.

Therefore you should avoid diagonal routes for your user.“

THORSTEN JONAS , CREATION CELLULAR

NO DIAGONAL NAVIGATION

Page 14: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

Even though the touch remote invites the user to make diagonal touch gestures, the Apple TV does not support diagonal navigation.

NO DIAGONAL NAVIGATION

Best practice: Movies

RecommendationsBuild 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

Page 15: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„Finally I can touch the TV without having to get up from the couch.“

JÖRN SIEDENTOPP , CREATION CELLULAR

USE THE TOUCH PAD

WISELY

Page 16: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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.

USE THE TOUCH PAD WISELY

Recommendations

Make use of animations as a result to an user interaction to explain context whenever possible

Support the users feeling of touching the interface by providing teasers withparallax effect

Page 17: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„Simplicity and reduction need to be the guiding

principles during the creation process.“

SIMONE BRAUNER , CREATION CELLULAR

REDUCE

Page 18: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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.

REDUCE

Best practice: Airbnb

RecommendationsDetect the essential information

Know at what point whichinformation is relevant for your user

Try to show as much information as possible by using images

Page 19: Apple TV UX: 8 Guidelines for greater Apps

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

PERFORMANCE DEFINES THE QUALITY

Page 20: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

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.

PERFORMANCE DEFINES THE QUALITY

Best practice: Plex

RecommendationsTechnology 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 technologyto generate this feeling

Page 21: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

„TV is great, because it is getting personal.“

GUNNAR HAMM, CREATION CELLULAR

BE EMOTIONAL

Page 22: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

The TV is the flagship for big and beautiful visuals. Make every screen a cinematicexperience

BE EMOTIONAL

Best practice: Yummly

RecommendationsDon’t try to fill every empty space

Use rather less content and arrangeit generously

Avoid tiny artwork, but use fullscreen images to support the cinematic feeling

Page 23: Apple TV UX: 8 Guidelines for greater Apps

Best practice:

A TV app should be as easy to use as the TV itself.

Naturally this leads to one principle:

Page 24: Apple TV UX: 8 Guidelines for greater Apps

Thank you.CELLULAR Hamburg, Germany [email protected]

Thorsten Jonas Head of Concept [email protected]

Tara Weston Concept

Constantin Rueff Design

Credits: Apple TV Product Photos by Apple, ZDF App Photos by CELLULAR