internet@tv

11

Prez Flash :: Internet@TV

30 août 201130 août 2011

Kévin GrosselKévin Grossel

2 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

3 / 29© Klee Group Prez Flash Internet@TV

Smart TV

Nouvelle génération de TV

Connexions Wifi ou Ethernet pour partage de médias

Box

PC

Smartphone

Tablette

Différents services

Navigation: Internet@TV, Google TV, Yahoo TV

Vidéos: catch-up TV, VOD

Applications: news, webradios, sports…

4 / 29© Klee Group Prez Flash Internet@TV

Acteurs du marché

Constructeurs de téléviseurs

Samsung

LG

Sony

Développeurs d’applications pour Smartphone

Google

Apple

Opérateurs téléphoniques

Orange

Free

Opposition des chaînes de télévision traditionnelles

5 / 29© Klee Group Prez Flash Internet@TV

Rendre « Smart » une TV

Téléviseur « Smart »

Samsung

Sony

LG

Panasonic

Boitier multimédia « Smart »

Toshiba: Toshiba Places

LG: ST600 Smart TV

Boxee

6 / 29© Klee Group Prez Flash Internet@TV

Standardisation

2010: les Smart TV représentaient 20%

des télévisions envoyées de par le monde

2014: DisplaySearch prévoit une

vente de 123 millions de Smart TV dans

le monde (58% des télés à écran plat)

Les Smart TV plus populaires que les TV 3D

7 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

8 / 29© Klee Group Prez Flash Internet@TV

Samsung

Plus grand Apps Store pour TV

Samsung SDK accessible au public

Forum d’aide pour les développeurs

9 / 29© Klee Group Prez Flash Internet@TV

Samsung SDK

Application Web

HTML 4

CSS 2

JavaScript 1.8

Fichier config.xml

Navigateur Maple (Markup engine Platform for Embedded Systems)

Application Manager: Smart Hub

10 / 29© Klee Group Prez Flash Internet@TV

Ergonomie

Navigation sur la page avec une télécommande

Navigation sur la page à gérer par le développeur de l’application

Ecriture par IME widget de Samsung

11 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

12 / 29© Klee Group Prez Flash Internet@TV

Application Klee

Présenter l’entreprise

Plaquettes

Offres de stages

Vidéos

Naviguer facilement et rapidement

Carrousels

13 / 29© Klee Group Prez Flash Internet@TV

Composition de l’application

Application séparée en 3 pages

Index.html : page des carrousels

Formulaire.html : page de postulation

Video.html : page pour visionner une vidéo

Librairies utilisées

jMyCarousel qui utilise jquery

Tutoriaux de Samsung: IME, Video

Ressources

Thème, offres de stage et vidéos de KTouchUnivers de Mike Gorodilin

Vidéos fournies par le tutoriel de Samsung

14 / 29© Klee Group Prez Flash Internet@TV

Index.html

Déplacement dans les carrousels

Agrandissement de l’image sélectionnée

Possibilité d’appuyer sur Postuler ou de Fermer l’image

15 / 29© Klee Group Prez Flash Internet@TV

Formulaire.html

Ecrire via l’IME de Samsung

Déplacement dans les champs

Envoi du formulaire

16 / 29© Klee Group Prez Flash Internet@TV

Video.html

Lire une vidéo

Possibilité de mettre en Pause, Avance Rapide, Retour en Arrière…

17 / 29© Klee Group Prez Flash Internet@TV

Recherche de données

Images et vidéos récupérées par XHR

Ajouter/supprimer/modifier sans modifier les pages de l’appli

Document comportant les sources en langage JSON

Langage léger

Simple à mettre en œuvre

18 / 29© Klee Group Prez Flash Internet@TV

Transfert d’informations

Transfert du numéro d’image ou de vidéo

Sauvegarde du numéro dans la requête

La requête est ajoutée à l’url de la page cible

Ajouter à la requête les informations de Smart Hub pour l’IME ?country=US&language=1&lang=en&modelid=VALENCIA&server=development&firmware=T-SPHAKRC-1000&remocon=1_35_259_0&area=USA

19 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

20 / 29© Klee Group Prez Flash Internet@TV

Problèmes techniques

Très peu de mémoire disponible pour les images (environ 1.3Mo)

Impossibilité de charger toutes les grandes images (200ko) dès le début

Incompatible avec certaines librairies (Highslide par exemple)

Créer l’élément image puis le détruire à la fin de la visualisation

Problème lors du changement de résolution (960*540 à 1280*720)

21 / 29© Klee Group Prez Flash Internet@TV

Test sur TV

Relier le téléviseur à l’ordinateur

Configurer les paramètres

22 / 29© Klee Group Prez Flash Internet@TV

Authentification par Samsung

Remplir des formulaires

Upload l’application

23 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

24 / 29© Klee Group Prez Flash Internet@TV

Navigation dans l’application

25 / 29© Klee Group Prez Flash Internet@TV

Navigation dans le formulaire

26 / 29© Klee Group Prez Flash Internet@TV

Navigation pour la vidéo

27 / 29© Klee Group Prez Flash Internet@TV

Introduction sur les Smart TV

Développer dans l’univers Samsung

Composition de l’application

Problèmes techniques liés au développement

Aperçu de la navigation dans l’application

Retour d’expérience

Sommaire

28 / 29© Klee Group Prez Flash Internet@TV

Retour d’expérience

Facile à développer pour développeurs web

Langages html, css et JavaScript

Nombreux tutoriaux

Manière de coder

Cheminement à suivre pour Samsung App Store

Communauté active sur le forum Samsung

Mises à jour régulières

Dizaine de posts par jour

29 / 29© Klee Group Prez Flash Internet@TV

Questions ?

Retrouvez nous sur le blog technique de Klee

http://blog.kleegroup.com/teknics

teKnics@kleegroup.com@teKnics_Klee