Drupal 8 on your Apple TV

Drupal 8 on your Apple TV

A64c4ca5f775360dee0a3b6244a9a4df?s=128

Rafael Silva

November 25, 2017
Tweet

Transcript

  1. #DrupalCampSP

  2. PRESENTED BY Rafael Silva - Senior Drupal Developer Myplanet Nov

    25, 2017 A prototype on how to take Drupal into Apple TV Drupal 8 on your Apple TV
  3. WHAT’S INSIDE Intro to Myplanet 3 Why did we do

    this? 7 Building a live prototype 24
  4. WHO WE ARE Cara Tsang User Researcher
 & Interaction Designer

    
 PhD, Cognitive Psych Rafael Silva Senior 
 Drupal Developer
  5. About us Senior Drupal Developer. I have more than 13

    years of experience with web development. I’m the creator of Drupal Brasil and a passionate contributor of both open source and Drupal. 5 WHO WE ARE Rafael Silva Senior 
 Drupal Developer @rfsbsb
  6. WE’RE HIRING! If you are interested in work for a

    young and vibrant company with many talented software developers, come and talk to me! Digital first, from consumers to employees. We’re a software studio. We make smarter interfaces to empower your employees and engage your customers. 6 WHAT WE DO
  7. Key Stats: • 90 designers, product managers & engineers globally

    • Expertise in open source custom applications, Drupal, mobile applications & browser-based, video solutions, chatbot, and personalization • Strategic partnerships with IBM & Acquia Our Team
  8. A little background on our experiment. Why did we do

    this?
  9. In recent years we’ve seen a plethora of new interfaces

    emerging. Nowadays Alexa, Google Home, Apple TV, Chromecast, Roku are taking over the market. Drupal site owners and managers will need to have their content delivered to those devices. The world is changing More and more we see new interfaces taking over. 9 WHY DID WE DO THIS?
  10. Why should we care about TV? WHY TELEVISION TV is

    a huge part of our lives • Avg Canadian watches 3h 45mins TV per day • 70% of Canadians watch TV when they eat • Quality time? (UK survey) • 62% think watching TV s a way to relax as a family • ~50% of moms think TV brings the family together • A more social, interactive digital experience
  11. But why the Apple TV? APPLE TV Over The Top

    streaming + Apple TV’s accessibility • OTT streaming services are now in over 64% of US households with TVs • Apple TV offers: • Relatively consistent layout and design • A lot of built-in accessibility features • New Siri commands offer great value for accessibility
  12. Making it intuitive,
 making it accessible. Designing 
 the App

  13. How do we design good 10-ft UI experiences? Think about

    scale. Bigger screen, but the user is also sitting further back. Amp up text and image sizing, make sure focus indicators are obvious enough. Think about context. Users are more likely to be in “relaxation” mode, maybe with lots of distractions. Keep things simple and clear, with low information density. Think about navigation. No mouse + keyboard, so less precision and flexibility. Arrange elements in a grid that’s logical for D-PAD usage. 13 DESIGNING THE APP
  14. RESEARCH We looked at… • Apple’s tvOS Human Interface guidelines

    • Apple TV’s accessibility features, best practices • Other Apple TV apps
  15. DESIGN PROCESS Next… • Design studio - lots of ideas,

    rough sketches • High fidelity mockups • Test it out at scale: project it on TVs
  16. Making it work, 
 checking it twice. Building a 


    Live Prototype
  17. Some modules we used Video. In this prototype it was

    used to store the video uploads. Image Raw Formatter. Return the image as URL, instead of formatted data. 17 SECTION Views. Used to select the data we want to export to the user. RESTful web services. Supports exporting the data as a web service. Serialization. Combined with RESTful web services it helps format your data to be served. + Custom module
  18. Spoiler alert: NO! Now we are going to create an

    App that consumes REST right? REST amiright?
  19. Apple TV makes it pretty easy. TVML Traditional apps are

    divided into 2 parts: client- and server- side. On Apple TV, part of the client is also processed on server, so you must have both the screens and logic on the same server. Client app then fetches the 2 and renders the application. Quick learning curve Analogy for web development: app is the “browser” and TVML files (Javascript & XML) is the “web”. Javascript and XML are well known, devs can more easily pick up developing for Apple TV. Accessible templates Apple offers a full set of templates and accessibility is natively implemented on those templates. Stick to the templates and you get accessibility features without much additional effort. Website integration Integrating app to existing website using TVML is quick and easy, since Javascript is ubiquitous. 19 DEVELOPING FOR APPLE TV
  20. You gotta go live. 20 LIVE PROTOTYPE Building & testing

    out accessibility features • Apple also provides thorough documentation for tvOS developers • 2 options: use Swift or use TV Markup Language (TVML; recommended) • Many visual and functional templates from Apple • TVML apps will run on your server, can change functionality and visuals without redeploying to the Apple Store • Easy to implement designs
  21. None
  22. DEMO TIME 22 DEMO TIME

  23. Try it out! Getting from concept to prototype only took

    a couple of weeks, and was fairly painless, especially if relevant content is already on a website. Demonstrate to stakeholders that ease and value of developing accessible TV apps! Thank you! @rfsbsb @TwittyCara @myplanet @myplanethq @myplanet Psst: we’re hiring! Find Myplanet on Glassdoor or LinkedIn!
  24. None