Building our first tvOS app

by
Tags: , , , , ,
Category:

ChariotTV-Top-Shelf2-640x360

Chariot Solutions runs an annual tech conference in Philadelphia called Emerging Technologies for the Enterprise or ETE. All of these presentations are recorded and we make the videos available on the web.

When the 4th-generation Apple TV and tvOS were released, anyone could write apps for the TV, not just Apple partners. I decided to write an app to make ETE presentations and other Chariot content available though an app. (Now I can catch up on presentations while relaxing on the couch.) In this post I’ll take a quick look at some of the architecture choices made when building our first tvOS app.

Server side architecture

I decided to put a backend server in place instead of hitting Vimeo and other feed sites directly. By aggregating the feeds and storing them in a database I could easily add additional metadata, sort urls, and add a flags like a feature flag that marks the video to be promoted to the top shelf carousel.

There are many server-side languages and frameworks you can use to write your backend. Because I’m an iOS developer and love Swift, I thought why not write it using one of the new server-side Swift web frameworks like Perfect, Vapor, or Kitura (to name a few.) All of these frameworks are under active development. I spent some time experimenting with each of them and ended up choosing Vapor due to its great documentation and ease of use.

Getting the basic web server functionality up and running with Vapor was fast and easy. But the Foundation Framework which provides core building blocks is not complete on Linux. As of this writing, server-side Swift is not quite ready for production, so I put this idea aside for the time being and wrote the server using Node.js with Express. 🙁

Client-side architecture

There are two methods for building a tvOS application:

  1. Using native frameworks (i.e. UIKit) with Swift or Objective-C
  2. Using TVMLKit, where your app is built with TVML templates and JavaScript

Again, because I’m an iOS developer I started writing the app in Swift using UIKit. This a standard video app with rows of images, each representing conference session videos, which I implemented using UICollectionViews. This was around the time that WWDC 2016 was happening, so as I watched several videos on tvOS and especially TVMLKit I started thinking that maybe TVML is a better choice for this app, considering the main purpose is to simply play video content. I still prefer the native approach using UIKit because of the control and power it gives you, but I wanted to give TVML a try.

ChariotTV-Al-feature-2

However, the biggest reason I switched to TVMLKit for this app is the ability to change things without having to re-submit the app for AppStore approval. If the business wants a new row (or shelf as they’re called in TVML) of videos it’s just a matter of tweaking the template and making possible JavaScript changes for the datasource, then pushing it to the server. Just like that, the app has new functionality and an updated look, without going through the approval process.

Version 2.0 (for tvOS 10)

I’m looking forward to updating the app for tvOS 10 (coming fall of 2016). With tvOS 10, users will be able to select a dark or light mode. I’m also looking at the new features; Embedded video playback, Interactive video overlays, and a “Now Playing” Tab.

tvos-10-dark-mode-640x360

The App is available for free in the App Store.

AppStoreBadge-224x66