As Seen On TV ... Bringing Apps To The Living Room

As Seen On TV ... Bringing Apps To The Living Room

The new Apple TV is out and with it the ability to run apps! To make things even better, these apps can be built using Swift, Objective-C, even C#! This session will introduce how to create and design a tvOS app. Capabilities and limitations of the Apple TV hardware along with the architecture of the two different types of Apple TV apps will be explored. Differences between the tvOS and iOS APIs, how to respond to input and focus events from the new remote control and UI design best practices are some of the unique aspects of developing for this set top box that will be covered. So grab some popcorn, this is going to be good!

Df69069a0bffd2dae5a8700a1bef7bfd?s=128

Matt Soucoup

August 08, 2016
Tweet

Transcript

  1. As Seen On TV … Developing Apps for Apple TV

    & tvOS Matthew Soucoup Code Mill Technologies @codemillmatt https://github.com/codemillmatt/that-conference-tv-os
  2. None
  3. None
  4. Today’s Lineup • Introduce hardware, OS and take a tour

    • Techniques to navigate between views • Best practices to present cinematic content to a room full of people Topics
  5. None
  6. Meet Our Stars • Characteristics • Strengths • Weaknesses •

    Special considerations Apple TV, Siri Remote, tvOS
  7. Hardware

  8. 64-bit A8 processor Up to 64 GB Storage 2 GB

    RAM 10/100 Mbps Ethernet WiFi 802.11 a/b/g/n/ac 1080p Resolution HDMI Game Controller Capable Siri Remote / Apple TV Remote
  9. Touch surface Menu Siri / Search Play / Pause Home

    Volume Lightning Connector
  10. Hardware Star Bio • Ample power for apps • No

    hardware fragmentation • One screen size • Always on – high speed Internet • New user interaction model Strong Points • Limited storage • 200 MB app bundle • 4 GB total ODR • Cannot write to permanent storage • No 4K support • New user interaction model Weak Points
  11. tvOS

  12. tvOS Intro • Derived from iOS • But is a

    distinct OS • UIKit, AVKit, CoreGraphics … still present • Supports new app type – TVML • New TVServices framework Characteristics
  13. TVServices Framework / Front Row

  14. tvOS Intro • Derived from iOS • But is a

    distinct OS • UIKit, AVKit, CoreGraphics … still present • Supports new app type – TVML • New TVServices framework • Radically different interaction model • No touch - remote • Social • Immersive Characteristics
  15. None
  16. None
  17. tvOS Star Bio • Two types of apps • TVML

    • Traditional • Same old UIKit • Different way to interact • Immersive experience • Most other native frameworks available Considerations
  18. tvOS 10 Beta • New UI styles (light & dark)

    • HomeKit • Photos • UserNotifications • ReplayKit • ExternalAccessory New Features & Added Frameworks
  19. None
  20. Development Environment • XCode 7.3 • tvOS 9.2 SDK Apple

    • Xamarin.tvOS Cycle 7 • Xamarin Studio 6 • Visual Studio(!!) • Can build with Unity Xamarin
  21. None
  22. Sneak Preview • Types of interactions • Navigation between views

    • Design considerations Remote & Navigation • What it is • Focus engine • Interacting with Focus Model Demo!
  23. Siri Remote

  24. Remote Interaction • Across the room • Only one element

    on screen ”in focus” • Siri remote & game controllers • Can use in landscape • Accelerometer & gyroscope available Interacting with tvOS
  25. Touch surface Menu Siri / Search Play / Pause Home

    Volume
  26. Touch surface Menu Play / Pause • Gestures • Swipes

    – 1 finger only! • Taps • Clicks Touch Surface
  27. Touch surface Menu Play / Pause • Back button •

    No on-screen back! • Pause for game play Menu
  28. Touch surface Menu Play / Pause • Playback shortcuts •

    Game controls Play / Pause
  29. Remote Best Practices • Don’t repurpose standard gestures • Don’t

    invent new gestures • Use menu as back button Standards
  30. Navigation • Only one item “in-focus” at a time •

    Focused item needs to be obvious • Move between items with minimal gestures • Navigation between items & screens intuitive • Don’t get the user lost! Everything Needs To Be Obvious
  31. Focused Control

  32. Focused Control

  33. Focused Control

  34. Focused Control

  35. Focused Control

  36. Focused Control

  37. Focused Control

  38. Focused Control

  39. Focused Control

  40. Focused Control ?

  41. Focused Control

  42. Focused Control

  43. Focused Control

  44. Focused Control ?

  45. Focus Model & Engine • Implementation of Focus Model for

    UIKit controls • Intended for use with Siri Remote (works with others) • Provides consistent user experience Focus Engine • Theory of indirect UI manipulation • Only one view in focus • Obvious and intuitive movement between views Focus Model
  46. Focus Engine • Maintains single view in focus at a

    time • Takes care of finding next focusable view • Cannot set focus programmatically • Provides API to respond to focus changes • Don’t fight it – defaults on most UIKit controls work API Basics
  47. Demo!

  48. Scene One • User interaction happens at a distance •

    Maintain a consistent remote control experience • Don’t get the user lost – easy navigation • Take time to understand focus model and engine Recap
  49. None
  50. Sneak Preview • Cinematic experience • Many people – far

    away • Organized and legible content Design Practices For • Stack views • Collection views Tools To Provide
  51. Immersive

  52. Living Room Experience • Edge to edge content • No

    chrome • Rely on focus model Cinematic • Legible at distance • Adjust for content appearing/disappearing • Reduce words on screen Organized
  53. The Tools

  54. Collection Views

  55. Stack View

  56. Demo!

  57. Scene Two • Provide “Living Room Experience” • Immersive, cinematic

    – edge-to-edge content, no chrome • Easy to read and understand from a distance • Adjust for content appearing and disappearing • Stack Views – Auto Layout’s helper • Collection Views – Grid organization Recap
  58. None
  59. C# in the Living Room • New generation of hardware

    and remote • New tvOS and two ways to write apps • Traditional apps – UIKit based • User do not interact directly – rely on focus model • Make interactions obvious and intuitive • Immersive and organized layouts Recap
  60. As Seen On TV … Developing Apps for Apple TV

    & tvOS Matthew Soucoup Code Mill Technologies @codemillmatt https://github.com/codemillmatt/that-conference-tv-os
  61. None