1. JAVASCRIPT : DÉVELOPPER
SUR TV CONNECTÉES
L o ï c G u i l l o i s

2. Speaker
Loïc Guillois @loic_guillois
Lead developer / Wiztivi
Blog : www.loicguillois.fr

3. De quoi va-t-on
parler ?
C’est quoi une TV connectée ?
Comment on développe des applications ?
Relation avec les constructeurs
Les standards et l’avenir de la TV connectée

4. Démonstration

5. Un matériel
hétérogène
TV

6. Un matériel
hétérogène
TV Box ADSL

7. Un matériel
hétérogène
TV Box ADSL
Autres box (Google TV, Apple TV, X-Box...)

8. Développer ?
Plateforme de développement
«propriétaire» (Python, Java, .NET, Flash...)
Développement Web

9. Développement Web
Technos standard : le client c’est la TV
JavaScript
HTML
CSS
Coté serveur : ce qu’on veut (JSON, XML)

10. Contraintes
d’ergonomie
Dimensions d’écran fixe en full screen
Navigation avec les flèches de la
télécommande

11. Gestion des
événements
Pas de souris, pas de clavier
Une télécommande
Evénements : JavaScript similaires

12. Les médias
Players vidéos propriétaires (balise object)
Codecs limités à ceux supportés par la TV
(H.264...)
Evénements JavaScript associés : play, pause,
stop...

13. Développer une
application
Concevoir des widgets (clavier, slideshow,
menu...)
Créer des écrans d’application
Intégrer un design
Consommer des données (JSON, XML)

14. Développer une
application
Intérêt de disposer d’un SDK (SDK
propriétaire chez Wiztivi)
S’appuyer sur des bibliothèques complexes
s’avère compliqué (jQuery, Dojo,
Mootools...)

15. Relation avec les
constructeur
Des TVs pour tester nos applications
Changelog des firmwares
Remontées de bug, exemples :
new Date() -> 1er janvier 1970
Cookies qui ne prennent plus les
modifications

16. Problématiques
Un comportement JavaScript différent
Des capacités différentes : HTML5, codecs,
3D...
Un rendu graphique différent (CSS)

17. Les promesses HbbTV
HbbTV un standard porté par de nombreux
constructeurs et acteurs :
France Télévision
Canal+
Philips
STMicroelectronics...

18. Les promesses HbbTV

19. Les promesses HbbTV
Définition des langages de l’application
(XHTML, CSS and JavaScript incluant
AJAX)
Définition de la manière d’intégrer du
streaming vidéo et audio
Définition des événements liés au DOM
Spécification des formats d’images

20. HbbTV : retour
d’expérience
Roland Garros 2011
(Samsung, Panasonic, Sony, Loewe...)

21. Des questions ?

22. JAVASCRIPT : DÉVELOPPER
SUR TV CONNECTÉES
L o ï c G u i l l o i s