How to switch from a mobile app to a TV app
Why create a TV application?
Television is no exception in the age of the connected world.
More and more brands are offering connected TVs.
Internet service providers also offer connected boxes allowing the user to have, in addition to access to the channel line-up, the possibility to download applications on their TV set.
This being said, creating a TV application is not always appropriate. In particular, one must ask oneself what will be the use of such an application on the big screen.
For example, applications for booking a flight or a restaurant or social applications will not be of much use on a TV.
On the other hand, video-on-demand applications, a photo-reader or games will naturally have their place in the TV application store.
We can take the example of Facebook which has a TV application, but only dedicated to video playback.
Even if the existing mobile application has no real added value to be redeveloped for the big screen, it is still interesting, in some cases, to create a TV application that can offer a selection of functionalities.
Is it easy to create a TV application from a mobile application?
A TV application remains very different from a mobile application.
The navigation, design and structure of the application must be designed for use on a large screen.
In order to provide the best possible user experience, it is important to follow the guidelines recommended by the platform in question (Android / iOS guidelines).
The fastest and most efficient way to create a TV application from a mobile application is to create a common module between the two platforms in order to share a maximum of business logic and let each platform create and manage its user interface.
As presented above, the common module (“Common”) will contain all the business logic that can be shared between the mobile application and TV.
This allows the logic to be consolidated in one place and will allow the TV application to reuse it without having to rewrite it.
However, if certain logics prove to be specific to a platform, a level could be added so that each platform can apply its own business rules, thanks to the “Mobile” and “TV” modules.
For the user interface, it is best to let each platform create its own interface, because as explained in the previous paragraph, the user experience differs from one platform to another. With this architecture, we can create the interface directly at the level of the application modules (“Mobile App” and “TV app”) or at the level of the “Mobile” and “TV” modules.
Note: it is preferable not to include business rules or designs directly in the application modules. By keeping these components only in the “Mobile” and “TV” modules, we will be able to later create other variations of the mobile and TV application by retrieving business rules and user interface from older applications.
From a technical point of view, developing a TV application is no more complicated than developing a mobile application and does not require more knowledge.
A simple reading of the guidelines and best practices will suffice.
Adapt your application for television
The user experience is very different from a mobile application to a TV application.
Firstly, unlike a mobile user, the TV user is only a few meters away from the TV, so small details are not necessary and small format texts can be difficult to read.
Secondly, since the user is far away from the TV, he must use a remote control to control the application rather than just touching the elements on the screen as he would naturally do on a mobile application.
These differences will naturally have a significant impact on the user experience of a TV application.
Some good practices on how to design and structure a TV application
Simple and uncluttered design: Due to the distance, the user will not be able to see as much information as on a computer or mobile device. This is why it is important to limit the number of texts and details that are not necessary for the user;
System home page: The system home page (Android TV / Apple TV) is the entry point to the user experience. There are several possibilities to make an application stand out from the crowd. For example, on Android TV, it is possible to offer the content of an application directly from the home page to gain visibility. Called list of recommendations, this is the fastest way for the user to access content without having to launch an application first. On the Apple TV side, Top Shelf also allows to highlight application content directly from the home page. If the application supports Top Shelf, the user will be able, for example, to view video clips directly from the home page.
Global research: research is also a good way to highlight its application. By offering content directly from the system’s global search, we allow the user to launch the application based on what they are looking for. For example, if the application offers the movie “Titanic”, you will be able to offer it in the search results and push the user to use the application;
Simplified structure: Since the user navigates through the application using a remote control, it is important to simplify the structure of the application and allow the user to access the desired content as quickly and easily as possible. Usually, an application is divided into 4 points :
Catalog screen: allowing the user to browse the content of the application;
Detail screen: allowing the user to have a detailed view of the content;
Consumption screen: allowing the user to consume the content;
In-app search: allowing the user to search for content within the application.
Navigation: Usually, on a TV application, the user navigates using a remote control called “D-Pad”. This remote control limits the movements to the left, right, up, down and a few other buttons such as the voice search or the home button. This feature makes navigation less intuitive than it could be on a touch screen, so it’s important to make sure that navigation between the different on-screen components is simple and natural enough.
Theme: since the application will be displayed on a large screen and probably in a dimly lit room, it is preferable for the user’s comfort to use slightly darker colors than those used on the mobile application, especially for the background color. The “pure” white color can also be very aggressive on TV apps, even for text, so it is better to use light gray rather than white for TV apps.
Publish your TV application on Android and iOS stores
The process of publishing a TV application is no different from that of a mobile application, the principle remains the same.
Nevertheless, two choices are possible regarding the application form. Indeed, it is possible to either create a new card (and thus a new store application), or to use the same card as the one in the mobile application.
Using a single form for both applications allows the user to easily retrieve the TV application, consolidate and retrieve all application data and analytical reports directly from a single console. It also makes it easier to track the frequency of updates and helps maintain consistency in application deployments. One of the disadvantages of this type of organization is that it can be difficult to retrieve analytical data by platform. Indeed, most analytical consoles are based on the application identifier (example: be.tapptic.app) and this identifier must be identical to both applications in order to appear on the same store card.
Before publishing a TV application on the blinds, the platform may request that certain criteria be met before it can proceed with the publication. For example, if it is a gaming application, it is necessary to ensure that the application supports video game controllers, that it is navigable in its entirety using only the D-Pad controller (as explained above) or that the application has a specific icon to be displayed correctly on the home page (this may be different from the icon of the mobile application).
List of requirements by platform:
Android: https://developer.android.com/docs/quality-guidelines/tv-app-quality
