Download - Internet@TV
![Page 1: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/1.jpg)
11
Prez Flash :: Internet@TV
30 août 201130 août 2011
Kévin GrosselKévin Grossel
![Page 2: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/2.jpg)
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
![Page 3: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/3.jpg)
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…
![Page 4: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/4.jpg)
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
Apple
Opérateurs téléphoniques
Orange
Free
Opposition des chaînes de télévision traditionnelles
![Page 5: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/5.jpg)
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
![Page 6: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/6.jpg)
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
![Page 7: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/7.jpg)
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
![Page 8: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/8.jpg)
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
![Page 9: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/9.jpg)
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
![Page 10: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/10.jpg)
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
![Page 11: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/11.jpg)
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
![Page 12: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/12.jpg)
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
![Page 13: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/13.jpg)
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
![Page 14: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/14.jpg)
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
![Page 15: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/15.jpg)
15 / 29© Klee Group Prez Flash Internet@TV
Formulaire.html
Ecrire via l’IME de Samsung
Déplacement dans les champs
Envoi du formulaire
![Page 16: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/16.jpg)
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…
![Page 17: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/17.jpg)
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
![Page 18: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/18.jpg)
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
![Page 19: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/19.jpg)
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
![Page 20: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/20.jpg)
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)
![Page 21: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/21.jpg)
21 / 29© Klee Group Prez Flash Internet@TV
Test sur TV
Relier le téléviseur à l’ordinateur
Configurer les paramètres
![Page 22: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/22.jpg)
22 / 29© Klee Group Prez Flash Internet@TV
Authentification par Samsung
Remplir des formulaires
Upload l’application
![Page 23: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/23.jpg)
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
![Page 24: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/24.jpg)
24 / 29© Klee Group Prez Flash Internet@TV
Navigation dans l’application
![Page 25: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/25.jpg)
25 / 29© Klee Group Prez Flash Internet@TV
Navigation dans le formulaire
![Page 26: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/26.jpg)
26 / 29© Klee Group Prez Flash Internet@TV
Navigation pour la vidéo
![Page 27: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/27.jpg)
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
![Page 28: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/28.jpg)
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
![Page 29: Internet@TV](https://reader035.vdocuments.fr/reader035/viewer/2022070321/558a5747d8b42a88468b463d/html5/thumbnails/29.jpg)
29 / 29© Klee Group Prez Flash Internet@TV
Questions ?
Retrouvez nous sur le blog technique de Klee
http://blog.kleegroup.com/teknics
[email protected]@teKnics_Klee