widget technology in convergence erasee.xidian.edu.cn/conference/mpegjpeg/workshop/ppt/...overview...

Widget technology in

Convergence era

Widget technology in

Convergence era

2009.10.31

Jaeyeon Song

Samsung Electronics

2009.10.31

Jaeyeon Song

Samsung Electronics

마스터 제목 스타일 편집

1/37

Samsung ConfidentialStandards & Industry Initiatives

Overview

0. Overview of Telecom ParisTech

1. Introduction

2. Presentation of the MPEG-U standard

3. Demonstrations


2/37


Rich Media User Interface

User Interfaces are evolvingIntegrate advanced rich media

-2D/3D, animations, video/audio clips

Possible to have a common user interfaces on many devices

-TV, Phone, Desktop, Web page

Designed around dedicated small applications ⇒Widgets


3/37


What is a Widget ?

Standalone application Software Widget

Embedded in a Web page Web Widget

Mostly rely on Web technologiesHTML, CSS, JS or equivalent

XML Configuration file

ZIP Packaging

Running EnvironmentWidget User Agent / Widget Manager

http://fr.wikipedia.org/wiki/Fichier:Wikipediawidget.png


4/37


Examples of Widgets Solutions

Yahoo! Widgets

Google Gadgets

Microsoft Gadgets

Opera Widgets

Apple Dashboard

…


5/37


Examples of Widgets

Clock

Dictionary

Photo Viewer

Radio players

News Slideshow

Weather

…


6/37

Samsung ConfidentialStandards & Industry InitiativesExisting standardization effort s

The W3C Widgets 1.0 family of specificationsPackaging and Configuration

APIs and Events

Updates

Digital Signatures

Open Mobile Terminal Platform / BONDI

Open Ajax Alliance

CEA 2014-A (Web4CE)

http://images.google.com/imgres?imgurl=http://www.w3.org/2009/Talks/1015Potsdam-KB/scripts/keys.jpg&imgrefurl=http://www.w3.org/2009/Talks/1015Potsdam-KB/Slides.html&usg=__NANP8fvTwjpHXSZuUkzo2BV7nNQ=&h=506&w=665&sz=41&hl=fr&start=1&um=1&tbnid=xsVr4V_814skUM:&tbnh=105&tbnw=138&prev=/images%3Fq%3Dw3c%26hl%3Dfr%26client%3Dfirefox-a%26rls%3Dorg.mozilla:fr:official%26um%3D1

http://images.google.com/imgres?imgurl=http://overtheair.org/blog/wp-content/uploads/2008/03/OMTP-logo1.gif&imgrefurl=http://overtheair.org/blog/sponsors/omtp/&usg=__G53QrjcuACB0BlK48RSRGzqs_U0=&h=200&w=200&sz=4&hl=fr&start=1&um=1&tbnid=sxcYN2E_71UkSM:&tbnh=104&tbnw=104&prev=/images%3Fq%3Domtp%26hl%3Dfr%26client%3Dfirefox-a%26rls%3Dorg.mozilla:fr:official%26um%3D1

http://www.openajax.org/index.php

http://www.ce.org/default.asp


7/37


Problems

Existing widgets are Web-centricInternet connection is assumed

Not compatible with home-networking

Existing widgets assume a client/server architectureCommunication entities are supposed to be well-known internet servers (e.g. Yahoo! Weather)

The source server address must be known at authoring time

Existing widgets heavily use JavaScriptUse of XMLHttpRequest for data retrieval and processing

Not suited for constrained devices (e.g. CE)

Not the processing power of PC browser

http://images.google.com/imgres?imgurl=http://lulu.projet-idea.com/wp-content/uploads/2009/01/UPnp.jpg&imgrefurl=http://lulu.projet-idea.com/%3Fp%3D493&usg=__z1gPjD0DOdMhvhbIV-BDMfOcHNc=&h=557&w=900&sz=81&hl=fr&start=1&um=1&tbnid=2VYjKQ4fg6d2xM:&tbnh=90&tbnw=146&prev=/images%3Fq%3Dupnp%26hl%3Dfr%26client%3Dfirefox-a%26rls%3Dorg.mozilla:fr:official%26um%3D1

http://images.google.com/imgres?imgurl=http://www.backtrackreviews.com/images/DLNA-logo.jpg&imgrefurl=http://www.backtrackreviews.com/&usg=__0zt5wJ-wfDjhsln3ObEfCuU24RQ=&h=150&w=200&sz=9&hl=fr&start=2&um=1&tbnid=vrHaSqyQ1cQcrM:&tbnh=78&tbnw=104&prev=/images%3Fq%3Ddlna%26hl%3Dfr%26client%3Dfirefox-a%26rls%3Dorg.mozilla:fr:official%26um%3D1

http://images.google.fr/imgres?imgurl=http://farm4.static.flickr.com/3078/2689468977_8900502c6e.jpg&imgrefurl=http://www.flickr.com/photos/28791486%40N03/2689468977/&usg=__TO38RRoKa9kBn1L_9jOCBqNS4JQ=&h=500&w=395&sz=57&hl=en&start=3&tbnid=xa2P0-ffffvRWM:&tbnh=130&tbnw=103&prev=/images%3Fq%3Djavascript%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://jkontherun.files.wordpress.com/2009/01/google-chrome-logo.jpg&imgrefurl=http://www.salon.com/tech/giga_om/gadget_gurus/2009/01/22/how_to_subscribe_to_rss_feeds_in_google_chrome/index.html&usg=__JmnL6CgmSYw7JLjaP4zqqISPTgs=&h=307&w=430&sz=25&hl=en&start=6&tbnid=mXBeyKisBSFrNM:&tbnh=90&tbnw=126&prev=/images%3Fq%3Djavascript%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://infosecurity.us/images/safari512px.png&imgrefurl=http://infosecurity.us/%3Fp%3D9730&usg=__NRSF__oa3ZRSh6tzFxreJFTbDI0=&h=512&w=512&sz=215&hl=en&start=1&tbnid=uVaEQlK1kjL8kM:&tbnh=131&tbnw=131&prev=/images%3Fq%3Dsafari%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://jmz.iki.fi/images/blog/06/ie7.jpg&imgrefurl=http://iphylo.blogspot.com/2007_08_01_archive.html&usg=__gJRlq3cbEg57FCA8-BKZgz1U2ss=&h=300&w=300&sz=12&hl=en&start=1&tbnid=4CRaF-4mtyTiMM:&tbnh=116&tbnw=116&prev=/images%3Fq%3Die%26gbv%3D2%26hl%3Den%26sa%3DG


8/37


What is MPEG-U? Why?

Based on the W3C specifications

Extended for non-Web domains Home network, Mobile, Broadcast

Extended for support of MPEG media types BIFS, LASeR

Extended for MPEG transports ISOFF, MPEG-2 TS, …

Extended for Widget CommunicationsUsable for restricted profiles (without scripting)

Extended for Widget MobilityWidget Context management and communications


9/37


ISO/IEC 23007, MPEG-U.

Two parts:

Part 1 –

Widget (CD stage -

going to FCD)

Part 2 -

Reference software and conformance (WD stage)

Standardization Roadmap:

9

Software demonstration available by the end of the

year

State of the standardization


10/37


Structure of the MPEG-U standards

Part 1: Widgets Committee Draft, N10815

Architecture

Widget Representation Format

Widget Management

-

Composition and Life Cycle

-

Communications, Context and Mobility

Widget Packaging Format and Delivery

Widget API

Widget XML Syntax

Examples

Part 2: Reference Software and Conformance Working Draft, N10816


11/37


Architecture

BIFS

Widget Manager

MPEG‐2TS

MP4nonMPEG

widget …

…

W3C APIsMPEG

APIs packaging

communication

LASeR HTML …Presentation Engine

widget widget widget

mobility

Life cycle


12/37


Widget Representation Format

Use of a manifestBased on the W3C XML configuration file

To describe metadata (author, name …)

Support for localization (language based)

An icon: static or interactive content-

Possibly fully synchronized with the main view of the w

idget

A scene description and associated resources-

Describes a full featured view of the widget

-

Type identified by a media type

-

Non restricted to W3C (HTML or SVG)

Describes communication capabilities

Security aspects: work undergoing

http://images.google.fr/imgres?imgurl=http://nassau.nami.org/images/communicating.gif&imgrefurl=http://nassau.nami.org/Useful%2520Info/communicating_with.htm&usg=__nGDBFTghhlYXcuzPqvk5xsu-GHs=&h=307&w=521&sz=5&hl=en&start=1&tbnid=gKmnfCLgM9Y34M:&tbnh=77&tbnw=131&prev=/images%3Fq%3Dcommunicating%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://www.savage7.com/wp-content/uploads/2009/06/localization-300x300.jpg&imgrefurl=http://www.savage7.com/index.php/2009/06/adobe-flex-3x-lack-of-support-for-localization-internationalization-i18n/&usg=__P3fNnUgXAOlVhQpNlE3oRJqct-4=&h=300&w=300&sz=80&hl=en&start=5&tbnid=Kz5rHUnBtPW8FM:&tbnh=116&tbnw=116&prev=/images%3Fq%3Dlocalization%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=https://webspace.utexas.edu/curtispe/images/xmlLogo.png&imgrefurl=http://share-book.com/&usg=__gjFeBPklsp2aneqqvu4PfC1r44s=&h=300&w=500&sz=24&hl=en&start=2&tbnid=FbJplR4SdLEXhM:&tbnh=78&tbnw=130&prev=/images%3Fq%3Dxml%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DX

http://images.google.fr/imgres?imgurl=http://www.tamu.edu/images/multimedia.jpg&imgrefurl=http://www.tamu.edu/home/aggieland/&usg=__hEnNUKGzZHUtirzpBqVY6I6sW8w=&h=600&w=300&sz=40&hl=en&start=3&tbnid=6WBg4peaDCsTMM:&tbnh=135&tbnw=68&prev=/images%3Fq%3Dmultimedia%26gbv%3D2%26hl%3Den%26sa%3DG


13/37


Widget Packaging Format and Delivery

Unpackaged delivery Separate delivery of widget manifest, and scene descriptions

ZIP-based formatCommon Web practice

ISO File Format for media centric widgetsSpecific brand and guidelines for storage and localization

Guidelines for streaming and broadcast environmen ts

http://images.google.fr/imgres?imgurl=http://media.primelocation.com/content/marketing/WinZip_icon.gif&imgrefurl=http://www.thedigitalpropertygroup.com/pages/marketing/marketing.html&usg=__XVGBpmh-1R3teIxJ2UZYi56XhqQ=&h=120&w=120&sz=4&hl=en&start=3&tbnid=JgVYrJrH_C8ZQM:&tbnh=88&tbnw=88&prev=/images%3Fq%3Dzip%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://www.vista4beginners.com/files/logo/folder_logo.jpg&imgrefurl=http://www.vista4beginners.com/Move-user-files-folders-to-another-partition&usg=__whXA9h7htoV9J21vdKsnMeSHSsY=&h=105&w=79&sz=3&hl=en&start=5&tbnid=tFmarr3otREnDM:&tbnh=84&tbnw=63&prev=/images%3Fq%3Dfolder%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DG

http://images.google.fr/imgres?imgurl=http://logo.mpegif.org/logo/Color/qual_logo_color_gif_166x80.gif&imgrefurl=http://logo.mpegif.org/logo/indexAuth.php&usg=__UYVznAGPC_VLuhzn3Ev5tXe3c24=&h=80&w=166&sz=3&hl=en&start=2&tbnid=RrKaAECsoq8_sM:&tbnh=48&tbnw=99&prev=/images%3Fq%3Dmp4%2Blogo%26gbv%3D2%26hl%3Den%26sa%3DG


14/37


Widget Manager

Entity managing Widgets

Normative BehaviorWidget Packaging formats

Widget Representation format (manifest)

Widget Life Cycle handling

Widget Communication handling

Widget Context and Mobility management

Widget individual rendering

-

Scene description normative behavior

Examples of non normative behaviorLook and feel (usage of icons, resize …)

Widget discovery

Communication entity discovery and binding

Composition of Widgets with other applications (DTV…)


15/37


Type anddescription

MPEG-U approach for Widget Communications

Communication entity

Scene Description

Interface descriptionMatching?

ProcessingMessagesEvents

Document modifications

ConfigurationDocument

Widget

Media


16/37


Widget Communications

Notion of external communication entity (aka remot e service)

Identified by a type

Described by an interface

Capable of receiving or sending messages from/to widgets

Examples: UPnP services, other Widget, Web services …

InterfaceDeclaration of binding mechanisms

Declaration of input and output messages

Declaration of connection between messages and scene constructs

-

Using declarative-only mechanisms

-

Using programmatic/scripting tools


17/37


Remoting

Widgets

Mobile

TV

1) Local browsing

3) Transfer of Widget & Context

5) Remote browsing

Photo Album

widget

Photo

Album

widget

2) Saving Context

4) Widget Activation and restoration of

Context

Photo

Album

widget


18/37


MPEG-U Use cases


19/37


Use Case 1 –

Personalized

Widgets

19


20/37


Use Case 2 –

Downloadable Widget

20


21/37


Use case 3 -

Remote UI

21

Widgets can be broadcasted through

MPEG-2 TS

Unified control point of the home network

devices


22/37


Use case 4 –

Widget aggregation

22


23/37


Use case 5 –Multimodal Widget

23

Variable UI according to the device capabilities

Branded unified look and feel in

convergent domain


24/37


Use case 6 –

Widget communication

24

Communication between widgets as

standalone applications

Both for home and internet widgets


25/37


widget technology in convergence erasee.xidian.edu.cn/conference/mpegjpeg/workshop/ppt/...overview...

Documents