Gennaio 15, 2016 - Commenti disabilitati su Apple TV Tech Talks for tvOS

Apple TV Tech Talks for tvOS

We had the opportunity to participate at the Apple TV Tech Talks at Berlin. This was a one-day event where was possible to get in-depth technical information on building and designing for tvOS, and obtain valuable development instruction from Apple experts.

1

The event started at 9:00 and finished at 17:00 approximately, for a total of 11 talks each one with the duration of half an hour. During all day was possible to meet with Apple experts to get development help for tvOS.

The agenda was the following:

Morning Agenda:

  • Apple TV Tech Talks Kickoff
  • Designing for the Apple TV
  • Focus-Driven Interfaces with UIKit
  • Break
  • Siri Remote & Game Controllers
  • On-Demand Resources & Data Storage
  • Lunch

Afternoon Agenda:

  • Media Playback
  • Leveraging TVML for Media Apps
  • Best Practices for Designing tvOS Apps
  • Break
  • Tuning Your tvOS App
  • Making the Most Out of Top Shelf
  • App Store Distribution
  • Reception

We will now dive deep into each talk and describe what impress us the most.

Apple TV Tech Talks Kickoff

2

In this introduction talk was explained the agenda and expectations for the day. A event talking about the mindset, best practices, state of the art developing into this new Apple platform.

It was talked that the rate of innovation in mobile is very different in regard to the one seen on the TV.  In the words of Apple "The future of TV is Apps". Apps optimised for media consumption like NetflixYoutubeHBO, etc. Apps for fitness like Zova. For shopping like GILT. And gaming apps, like Disney InfinityDoes Not CommuteAlto Adventure. Or even the digital comic book like Madefire. And also children apps like Sago Mini Fairy Tales.

Apple says we are still at the beginning it is still needed to bring the innovation from the mobile platform.

Next was talked about the three tvOS Fundamentals and how they differ from the mobile:

  1. Living Room Experience
  2. Always Connected
  3. Powerful Hardware

6

The Living Room Experience differs from the mobile since it is used from distance, the interaction with the user is focus-based and the attention should be on the content. It often can be a communal experience with a shared device and multiple people interacting, in group or at different hours.

The fact it is a device that is (probably) always connected enables services like http live streaming, on-demand resources and cloud storage to always be easily accessible, versus a mobile connection that usually is unreliable.

3

The "powerful hardware" present on the Apple TV is basically an iPhone 6 without screen and without sensors, it contains the A8 chip with 64-bit architecture (1.5 GHz dual-core + quad-core GPU). Apple says that for developers this HW sets a new performance baseline development, instead of the A5 chip with 32-bit architecture (800 MHz dual-core + dual-core GPU) if you are still supporting the iPhone 4S (which still runs iOS 9).

4

Doing a tvOS app means you are using a separate SDK, with a standalone binary (versus targeting iPhone and iPad where the binary is the same). For developers means you can also use the same tools and frameworks with extra support for media and gaming.

5

Designing for Apple TV

Designing for tvOS means designing for the Living Room Experience. You should connect people to content in a direct way, even if the TV is far away from the user. With the remote you can use gestures, small or quick movements.

7

The experience should be connected, clear and immersive. The omnipresent parallax effect should delight and connect the user to the content.

Some things should be intuitive, it should be clear where the user is at the moment. It never should be hard to read text, and the UI should never be dense.

The app navigation should be clear, one in-out path.

8

The system font San Francisco was optimised for large distances, and it responds to accessibility settings.

When possible should be used the grid structure with the item at focus clear at distance.

There should not be ambiguous gestures with the remote.

When correct it should be used a cinematic experience with edge-to-edge background of movie images.

The user can interact with the TV using the touch surface, menu button, play/pause button. It is not appropriated to use multi-touch gestures with two fingers, but you can use one-finger gestures.

The Play/Pause button can be used for playback or game shortcuts.

The Menu is the back button for navigation (there should be no back buttons on the UI).

The Accelerometer and Gyro are available for use, and in certain cases can help to connect users with the content, for example with subtle movements in the controller affecting the content rotation.

The remote can also be used in landscape, for example in the break neck game.

The content should move in the expected direction, inverse of direct manipulation like iOS (except in fullscreen mode or games).

The UI buttons can have different distinct states, unselected, selected focus, highlighted, disabled.

The focus should be obvious, a good test will be: "Look out of the TV and look back, the content at focus is obvious?".

It is possible to add animation to make it easy to see which content is at focus.

Measurements for grids and spacing are available for use at Apple Human Interface guidelines.

Most of the times use clicks instead of taps, taps can be made accidentally, click is intentionally and often will be a better option.

Focus-Driven Interfaces with UIKit

The focus-driven interface present in the TV follows the finger movement and states the next view in focus. This engine calculates how to move and animate, where the focus should be at any moment, the parallax effect, the speed adaption (if I move faster the finger on the remote).

The focus engine handle all the (numerous) tasks related to focus model.

9

The Focus API gets the focusable view, the initial focus and current focus.
A new property was added to UIView called canBecomeFocused to tell if the view can become focused.

The new protocol UIFocusEnvironment introduces new the property preferredFocusedView and table and collection views delegate methods for handling the focus model. To UIView and UIScreen were also added new read-only properties.

11

The focus should not be set manually, the user should be in control of the focus.
Avoid ambitious cases, for example when views are removed, new views are presented or dismissed, the focus update requests where the focus should go. To do this use canBecomeFocused and preferredFocusedView

You can request focus, with setNeedFocusUpdate and update focus if needed for collection view cells, just remember to adjust the cell when the ancestor is focused, for example respond to focus changes by showing/hiding a label with animation.

The animation timing should responds to speed of swipe in the remote, fast movements make faster animations.12

If you want to listen to focus updates implement the method didUpdateFocusInContext.

Use focus guides to guide focus when it is not clear in the UI where the focus model should move.

13

14

To debug focus use the property whyIsThisViewNotFocusable, or using the option "Quick Look"  in the Xcode debugger.

15

16

It is also possible to tap edges of the remote Up, Left, Right, Down, Arrow, works on Siri remote, and with game controllers pads

You can also implement low level event handling, the touch API is also available, coordinates are from center of focused view.

Siri Remote & Game Controllers

You can use the Siri Remote as a game controller directly by using the game controller framework.

Touches on the Digital Pad are windowing, that is the framework creates a window with a center where user first puts the finger and all values are relative to this virtual window.

DPAD values are by default in portrait, you can adapt it automatically with a the allows rotation property.

The menu button in gameplay should toggle pause/resume instead of handling navigation.

You can integrate the controller with UIKit with the user interaction enabled property.

To disable the screensaver timeout with idleTimerDisabled property, this should be done not always but only while in gameplay mode.

To access device motion use the GCMotion profile, this access accelerometer and gyroscope data, this data is already filtered and uses fused data from both sensors. This access is not intended for vigorous shaking aggressive movements.

17

18

There is a limitation for the number of controllers you can use: one siri remote plus up to two MFI controllers. You should always take input from all controllers if possible.

19

On-Demand Resources & Data Storage

20

Instead of traditional apps and downloading all the bundle, in the TV based on user interactions and predictions you download the resources you need. For example, when the user downloads the game, the app may contain the first level, and based on the level he is playing the resources are downloaded for that level, and when no longer in use they are erased.

21

The dynamically loaded content is hosted in the App Store. The on-demand resources feature enabled prioritised downloads and intelligent caching.

What the customer gets with on-demand resources? Better install experience with reduced time install, more apps on the device, and up to 20GB of content.

You can define install tags (download on demand) for the content and prefetch tags (immediately download after install).

The TV storage limits are the following base app up to 200MB, on-demand up to 20GB, in use app up to 2GB.

22

Initialise the content with a set of tags, then begin requests, and after tell the system when you are finished. You can track the progress of request, but ideally you should not have need to use this, instead you should anticipate the user needs better. Temporary data is subject to purge.

You can set the loading priority, and also set an urgent priority if the user is waiting for the content. You can use the property Is content available? You can conditionally begin accessing resources and receive the result with a completion handler.

23

You can also set a preservation priority to tell the system how important is to keep around the disk, this is for content not actively used, and is used for caching, it is relative to your app not system wide (don't set it to 100 to keep it around more than other apps ;)).
To test on-demand resources you can use Xcode and Xcode server, this is a artificial download, it should test correctness not performance.
If you use TestFlight closer to deploy, you get real world performance with the network link conditioner.
You can also embed the resources in the build, build settings to embed assets into the app, not correct for App Store, can be used to distribute ad hoc the app outside of App Store.
It is also possible to host the content in your internal web server, for example in a enterprise scenario.

To store small preferences data you can iCloud key-value store, for structured and bulk data you can use CloudKit. Remember that the user might not be signed in and multiple people may be sharing the device.

24

The cool thing is that public data is available even if user is not signed in. There is however a single sign in account per user.

Media Playback

The TV can offer a very good media playback experience. The video player present in the framework does a lot of heavy lifting for you. The AVFoundation and AVKit provides a info panel, language, subtitles, sound, content scrubbing.

AVAsset represents a single media asset, from a file or streaming. AVPlayerItem, references single asset, with metadata. AVPlayer, manages the playback of a AVPlayerItem and AVQueuePlayer plays multiple items in sequence.

To show metadata in the info panel, you set it in AVPlayerItem or set it with external metadata. "What did he/she just say" feature of Siri uses this metadata.

25

Interstitial time ranges, time ranges not part of actual content (ads,legal,warnings,etc.) and you can set different rules for it, for example no skipping ads. Avoid swapping players to display interstitial, instead use AVPlayerViewController delegate methods for managing interstitial , for example to disable skipping.

Rare cases can use AVPlayerLayer directly, use it when you want to customize the playback experience, this provides No Controls or UI, Zova uses it to skip/previous exercises.

The reproduce media can be file based (Local bundle, On-Demand Resources, or cached). This has to be downloaded prior playback and should be very short clips to avoid long loading times.

The ideal way to provide media is trough http live streaming (HLS), segments are downloaded during playback and is adaptive based on the available the internet connection status

27

The used codec is H.264 / AVC, it supports up to 60fps.

In the audio can be add described video track for accessibility. To support "trick play" it is needed to add frames with EXT I FRAMES. Subtitles are important for accessibility of for the "what did he just say" Siri feature.

For more info on the media reproduction with accessibility it is recommended to see the presentation of the WWDC13 Preparing and Presenting Media for Accessibility.

Leveraging TVML for Media Apps

TVMLKit is used by the App Store, music and video apps from Apple. It is recommend when the server content is the focus of the app.

2

TVML is template based language that offers consistent UI, and can lead to reduced development effort with shorten time to market.

1

Optimal cases where leverage existing client server architectures benefit a lot from TVMLKit, you
provide native experience with little development times.

As said clearly by Apple this is not a web browser.

The UI is defined with a XML document. and you can link the JavaScript with Swift or Objective-C. The TVJS framework has access to system frameworks, and you can bridge from native to JavaScript and vice-versa.

4

3

5

6

For debugging you can use the Safari web inspector.

Apple haves sample projects made with TVML and content server samples.

Best Practices for Designing tvOS Apps

This talk was about the common questions and problems when designing for tvOS.

In the TV loading is a constant, since the local storage is limited and you can always assume a network connection. Therefore you should at all costs avoid blank screens, is better to use placeholder for images and the UI, while the content is being loaded.

1

Activity indicators or other UI elements can indicate well progress, The game Does Not Commute and Rayman Adventures do it very well. In the first the radio of the car presents a loading bar and then it is the place where the game is played, in the latter we see Rayman running when loading the content.

Always try to set expectations to loading time, and use the loading time to educate the user (with useful info) or entertain him. Galaxy on Fire app when loading shows the story or if you skip show game tips.

Try to avoid authentication since it is not a good experience, if you need it, for example with payment systems, delay it until it is really necessary. GILT app lets browse everything without sign in until you try to buy something.

Important if you need to ask for emails remember to use the correct keyboard that shows the Recent emails entered in any system app.

When needed you can create a companion app to do more complex authentication behaviours.
Not on the high street app completes the payment with an iOS companion application, it finds your device in the network using the bonjour technology.

Since the apps in the TV can have multiple users Include a fast profile switching like in the Airbnb app.

Very likely your app will be used in different devices, iOS or tvOS, therefore make restore purchases obvious.

2

The on boarding is critical to show how to use your app. Try to get out of the way, remember people want entertainment, they don't want to read instructions.
Badland app does not show any instructions when starting, when you start playing the possibilities are gradually presented.

The on boarding should not be a crutch for a bad UI. If developing a game show the controls when the user pauses the gameplay, like Breakneck app does.

Transistor app show different instructions based on the controller you are using. Click with Siri remote, or press buttons with MFI controllers.

The Alto Adventures game show instructions as you go, much more fun than displaying a list of instructions (that everyone will skip).

3

Try to anticipate the need for help and give the information to users gradually.

Using a cursor to point something is wrong , the focus model is right. Try to design the UI right to take advantage of the focus model.

4

Take in mind that the TV is a totally new device, design specifically for this platform don't try to port from Mac or iOS, it will not work.

Making the Most Out of Top Shelf

The tvOS has a feature called "Top Shelf", that is when the user moves the app to the Top Shelf (the upper dock of the main screen).

When the app is at this position it has control of the content displayed on the Top Shelf. This can content can be a static image, and so it is not interactive.

If your app was moved to the top of the home screen the users are already using it, this is no place to capture users, but instead to promote content to your users and provide a quicker access to parts of your app.

If you choose to display dynamic content try to ship it on the first version otherwise people may lose it. This dynamic content has also the advantage that it is not linked to the bundle so it is always update when you change the service that serve this content.

Sing by Smule app does it with image content from the application. Zova shows the most relevant content for the user. The Newsy app shows featured content.

This feature can saves steps by going directly to content, and you should implement play to start immediate playback.

To be personalised you can  use the TV top shelf provider protocol. You can choose the Top shelf style, that can be a unique part with inset or divided by sections.

To populate the shelf you define a Tv content item array, specifying the image ratio and other metadata. If you use the section style you return an array with the sections.

You should provide links to content, with custom URL schemes for your app and responding to system calls, like you do right now in iOS.

The URL with media should go directly to playback when the play button is pressed.

You should implement the play direct option and display for all content on the top shelf, posting to different parts of your app.

To let the system know when the items will need to change using the notifications : tv top shelf items did change notification.

App Store Distribution

A the moment the tvOS App Store is available in over 100 countries. All apps are handpicked by Apple, trough their submission process, very similarly to iOS. The sections in the store are Editorial curated by local Apple employees and the store also displays a search feature and the traditional top charts, divided by paid, free and grossing.

The top markets for iOS at the moment is the following:

IMG_0235

There are some business considerations to define when developing an tvOS app. These Business models are the same as iOS. And application can be free and make money by selling services or goods (GILT, Airbnb, etc.), it can be a pay once strategy (Alto Adventures, etc.), a Freemium model, free to download and pay after for contents or features or even a Paymium model, where the user pays to download and then pays after for contents or features.

For the TV almost 40% of the applications are paid, contrary to the 10% in iOS.

IMG_0233

IMG_0234

Depending on what you want to achieve reach (maximum number of users), revenue (maximum return) or both, you have to find a solution that fits you and your users.
Freemium can be a good model to reach both a user base and still make a good revenue from the app.
It is a difficult task to find the right price for throughly charge users, and what kind of model does your user expect.
To help reasoning you have to think which kind of use is your app best at, people will use it periodically for a quick use or it has a lasting value? Does the app gets better the more user it has? All these are important questions that affect you product development.

With the TV Apple introduces a feature called "Universal Purchase" this is a non reversible action that enables your users to purchase once and use it in iOS and tvOS.

In app purchases are a place where you can use this feature, always demand the same question "What is most important reach, revenue or both?". Take in mind that customer don't want to pay two times, but if you offer something different/platform specific it may work. Take in consideration also case where you have Content right limitations , show in mobile and tv may not be the same and the user understands it (a little bit like Netflix does with their business model).

Both app stores enable global expansion and make it easy to start a global business, the iOS App Store is right now at 154 countries. But take in mind that the editors of the App Store like to feature local content. A good strategy should be to consider the top markets by leveraging also your own data and localise the app right in order to meet customer expectations (if I see a app in the store in my language but after I download it and I don't understand anything I will delete it).

Remember every visitor in the store is a potential customer, polish your Icon, have a good, unique, short app name, match uniqueness, short, no Apple TV or tvOS trademarks. Take great screenshots of your app. The first 3/4 lines of the description are the most important.

Keywords are important for ASO. Use all 100 characters, commas, plurals and category are not necessary, they are automatically added by the engine. Add relevant keywords by understanding well the rules.

IMG_0238

IMG_0239

When developing marketing materials use tvOS approved image in guidelines, Download the App Store badge to display in your website, add icon imagery. A good example is the Sago Mini Fairy Tales app.

Getting featured in the store is very easy, just make a great app that customer will love. 🙂IMG_0241

Always ask yourself the following questions: Is the app unique? What make people love your app?

The app should be engaging, provide a living room experience when interacting with a group of people. It should be have a intuitive use of Siri remote.

The first time a user opens you app should be fantastic, with great on boarding (don't use on boarding screens, don't pop up for login at start).

Remember that performance matters, if the app is slow at loading, freezes or crashes, it will not be featured.

If the app is not a port of a Mac or iOS but it is clear that is designed specifically for tvOS also helps getting featured.

Getting featured is also a matter of understanding the process at Apple. They refresh the contents every Thursday. Usually the it has certain themes for holidays or periods of the year (for example a fitness app in January, I see what you did there Zova 🙂 ). They have a preference for localised content, and have focus on initial launch and significant updates.

Even if Apple does not naturally discovers your app you can also let them know. Be sure to send the Product details, Apple ID and App Store link. Tell what makes your app special, your product roadmap, send the marketing material. Be sure to contact before going online, 3/4 weeks before is the recommend time frame. The contact email is appstorepromotion@apple.com

IMG_0243

Quality always comes first when getting featured, having the right business model to enable sustainable development of your app. Try to think global but be local. Create a great product page to help drive your sales and don't forget to market your app.

Conclusion

Overall the Apple TV Tech Talks for tvOS was a great day, the presentations had a great quality and the Apple experts at the event were very available to answer any doubt regarding different parts of tvOS.

All the materials of the event are present here.

Published by: xpeppers in Blog, Coding, Eventi, XPeppers