Contenu connexe
Similaire à MyMobileWeb Version 4 (20)
MyMobileWeb Version 4
- 2. The Mobile Web
An up-and-coming technology and market
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 3. The Mobile Web
Overview
Accessing web applications and contents from mobile handsets
— From the old days of WAP to the Mobile Web (HTTP + (X)HTML + CSS +
Javascript)
Particularities of the mobile environment Delivery Context
— A myriad of devices and web browsers (multiple combinations)
— Different markup language varieties, image formats, CSS support
— Different form factors subject to orientation changes
— Different interaction resources (multi-touch, stylus, track ball, numeric
keypad, …)
— Network latencies, disconnections…
Users use their mobiles to do different tasks
— Different Context of Use Mobile Applications and Portals optimized
Mobile Web Development is not easy if you wish to support the majority
of devices without compromising functionality or the user experience
TELEFÓNICA I+D
3
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 4. Voice from the Experts
“Unless websites are redesigned for the special circumstances of
mobile use, the mobile Web will remain a mirage. Users won't
realize the benefits promised by mobile vendors, and site owners
won't reap the profits that would follow from gathering hordes of
loyal mobile customers.”
“In user testing, website use on mobile devices got very low
scores, especially when users accessed "full" sites that weren't
designed for mobile.”
“So, if mobile use is important to your Internet strategy, it's smart
to build a dedicated mobile site.”
Jakob Nielsen : Worldwide-recognized Usability Expert
"the king of usability" (Internet Magazine)
"the guru of Web page usability" (The New York Times)
http://www.useit.com/alertbox/mobile-usability.html
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 5. The Mobile Web
Innovation Opportunities
Source: Gartner Hype Cycle for Web and User Interaction Technologies, 2009
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 6. The Mobile Web
Potential Market
Source: AdMob Mobile Metrics Report (June 2009)
TELEFÓNICA I+D
6
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 7. The Mobile Web
Realizing its potential
Making the Mobile Web a reality it is not only a
question of using highly capable devices and browsers
Users are expecting more from the Mobile Web
— Any application / service / portal adapted and optimized
for every device used at a given moment
— Rich user interfaces enabling higher functionalities while
optimizing traffic costs: AJAX, Graphics, Maps
— Context-Awareness : providing what I need, now, here
…
Application and portal developers are demanding
powerful technologies that enable the creation of
advanced, high-quality mobile web applications in
time to market without investing a lot of money
— Using open and standard technologies
— Without the need of highly specialized (and hard to find)
developers
TELEFÓNICA I+D
7
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 8. MyMobileWeb
An up-and-coming open source product
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 9. MyMobileWeb: ¿Why?
28 Kb – 2 seg
¡ 3 Mb – 57 seg !
31 Kb – 2 seg
12,5 Kb – 1’7 seg
TELEFÓNICA I+D
9
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 10. MyMobileWeb
Introduction
MyMobileWeb is an open source, standards-based software framework that
simplifies the rapid development of mobile web applications and portals.
MyMobileWeb encompasses a set of technologies which enable the automatic
adaptation of applications to the target Delivery Context (browser, device,
network, location,…), thus offering a harmonized user experience.
How:
— Using an XML-Based language (IDEAL2), that makes it possible the description
of device independent user interfaces and their adaptation policies
— Using a set of client and server-side runtime libraries that realize the automatic
content & application adaptation
MyMobileWeb enables the creation of Mobile Web Applications that can
adapt seamlessly to multiple devices with minimal effort from the
developer
TELEFÓNICA I+D
10
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 11. MyMobileWeb
History
Born on November 2004 as an internal innovation project at TI+D
– Released as open source (Morfeo) in November 2005
From 2006 has been funded by the Spanish Ministry of Industry
In 2007 the project was labeled as Eureka-CELTIC
Now it is a “Proyecto Singular y de Carácter Estratégico” (Avanza
I+D)
TELEFÓNICA I+D
11
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 12. © 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
12
TELEFÓNICA I+D
User Experience in different Delivery Contexts
>laedi/< >iu/< >ydob/< >noitces/<
>/ edu cn <>v d/<
>/ "2p/tcudorp/cireneg/liateDSP"=tnetnoc edullcnii<>viid/<
>e bat/<
>e bat/<
>ellllbat/<
>e bat/<
>rt/<
>dt/< >/
>dt/< >/
>dt/< >/ tuptuo< >dt<
tuptuo< >dt<
tuptuo< >dt<
>dt/< >/ "etad"=fer tuptuo< >dt<
>dt/< >/ "eman"=fer tuptuo< >dt<
>dt/< >/ tuptuo< >dt<
>dt/< >/ "edoc"=fer tuptuo< >dt<
>
>
>"}edoc.tnerruc.tluseRSPhcraes{$"=eulav
>
“ tluseRSPhcraes"=tesedon-taeper rt<
>ht/<
>ht/<
>ht/<
>ht/< Authoring
>dt/<ahceF>")'eciveDadP'(oTsgnoleb:ncd"=rpxe dt<
>dt/<
>dt/<
>dt/< >dt<
>dt<
>dt/<erbmoN>dt<
>dt<
>dt/<
>dt/< >dt<
>dt<
>dt/<.d C>dt<
>dt/< ó >dt<
>"redaeh"=ssalc ht<
>
>
> e bat<
e bat<
>"SPtsil"=di "etanigap spt"=ssalc "SPdetceles"=fer ellllbat<
e bat<
>"2p"=di "lacitrev retnec"=ssalc vid<
>v d/<
>v d/<
>viiiid/<
>v d/<
> eba /<
> eba /< >
> eba <
eba <
>llleballl/<}esirpretne{$>"kramer"=ssalc llleballl<
Deployment >lebal/<:aserpmE>lebal<
>
>
> v d<
v d<
>"1p"=di "retnec"=ssalc viiiid<
v d<
>"noitceSniam"=di noitces<
>ydob<
>ydob<
>ydob<
>ydob<
> u<
> u<
>iiiu<
>"S/P .snoC .seR"=eltit "tsilsp"=di laedi<
>2laedi EPYTCOD!<
MyMobileWeb in 4 steps
- 13. MyMobileWeb
Functional view and key technologies
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 14. MyMobileWeb
Key Technologies
IDEAL2 (Interface Description Authoring Language, version 2) , for the
declarative description of device-independent user interfaces and adaptation
policies.
SCXML, language for describing application flows modeled as state
machines.
“Device Description Framework” concerned with obtaining information about
the characteristics of devices and web browsers by interfacing with different
Device Description Repositories (DDRs).
“Adaptation and Rendering Engine”, in charge of selecting and generating
the final markup, script, style sheets and other resources (images, audio,
video) to be delivered to the mobile device.
“Client-side Framework” (a.k.a. “Mobile AJAX Framework”) which enables
rich interactions in different Javascript-enabled browsers.
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 16. MyMobileWeb
Core Functionalities
Main Feature: “content and application adaptation”.
Adaptation is a process of selection and generation of
the application’s user interface or contents in order to:
— (a) accommodate to the restrictions imposed by the target
delivery context
— (b) to ensure that the resulting user experience is sufficiently
harmonized with such a delivery context. Adaptation
encompasses a number of sub-functionalities
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 17. Adaptation
Sub-Functionalities
Automatic generation of the most suitable markup, style sheets and Javascript to realize the
different user interface elements (specified using IDEAL2).
— from legacy (WML [16]) to the most modern (WebKit-based) enhanced browsers
— mobileOK content.
selection of CSS style-sheets to customize the look-and-feel or layout for different devices.
selection of user interface parts (including Javascript code), using W3C’s DISelect 1.
pagination of long content such as tables with many rows, menus with many options or
forms with many fields.
selection or transcoding of different multimedia content (images, audio, video). While
selection consists of choosing the best from a set of variants, transcoding implies a
transformation process from a source to a target resource.
— MyMobileWeb incorporates a simple image transcoding component and can interoperate with
any OMA-STI compliant transcoding service, such as the open source Alembik system.
internationalization and literal management which consists of selecting literals depending
on the delivery context (for example to accommodate a short space by choosing an acronym)
or the user preferences (preferred language).
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 18. MyMobileWeb
Core Functionalities
Runtime support for a wide variety of user interface
components and statistical graphics
— input (including automatic completion), date, time, selection, menus,
chained menu, table, list, range, placard (for combining text and images),
carrousel (for showing sequentially a list of items) . . .
Data and content binding. (declarative) association of user
interface components with the data or contents (and possibly their
constraints) they are going to display or manipulate.
— MyMobileWeb can interoperate with any JSR-170-compliant content
repository, such as Alfresco.
Awareness of the delivery context, compliant with the DDR Simple
API W3C Recommendation.
IDEAL2 incorporates an extension which allows to add semantic
annotations to user interface descriptions. One possible application
of this feature is the automatic completion of forms.
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 19. IDEAL 2
IDEAL2 is the result of four years of research and experience in authoring languages for the
description of device-independent user interfaces.
Features
— Based on W3C standards (namely XForms 1.1, DISelect 1)
— Modular and extensible.
— To help web authors, the syntax of IDEAL2 is similar to XHTML’s but as an authoring language,
it incorporates abstractions and extensions that make it a more powerful and higher level
language than XHTML, as the latter is only intended for browser consumption.
— describes user interfaces (UIs) in an abstract manner, i.e. without commitment on how such a UI
will be finally rendered.
– The decision on how an abstract user interface element will be finally rendered will depend on the device
and web browser identified at runtime. The rendering engine can make this decision automatically on behalf
of the developer. Nonetheless, developers can force an specific rendering by means of adaptation policies.
IDEAL2 is only intended to provide the description of a user interface from a structural and
behavioral point of view. All the aspects that have to do with look-and-feel and layout are
specified by means of CSS2 and extensions.
By using IDEAL2 developers can concentrate on the application functionality without
worrying about markup languages or scripting capabilities.
— MyMobileWeb’s rendering engine will take care of such details, performing graceful
degradations for those less capable devices.
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 20. © 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
TELEFÓNICA I+D
More info at http://files.morfeo-project.org/mymobileweb/public/specs/ideal2
> aed /<
> aed /<
>llllaediiii/<
> aed /<
> u/<
>iiiiu/<
> u/<
> u/<
>ydob/<
>ydob/<
>ydob/<
>ydob/<
>retoof/<
>retoof/<
>retoof/<
>retoof/<
>/
>/
>/ edu cn <
edu cn <
>/ "derewop/nommoc/cireneg/nommoC"=tnetnoc edullllcniiii<
edu cn <
>/
>/
>/ rotarapes<
rotarapes<
>/ "enil"=ssalc rotarapes<
rotarapes<
>/
>/
>/ edu cn <
edu cn <
>/ "retoof/nommoc/cireneg/nommoC"=tnetnoc edullllcniiii<
edu cn <
> retoof<
retoof<
>"retoof"=di retoof<
>
> retoof<
>no tces/<
>no tces/<
>noiiiitces/<
>no tces/<
>v d/<
>v d/<
>viiiid/<
>v d/<
>unem/<
>unem/<
>unem/<
>unem/<
>a/<
>a/<
>a/< }eman.tnerruc.tsiLbulc{$
>a/<
>
>"}ferh.tnerruc.tsiLbulc{$"=ferh "}egami.tnerruc.tsiLbulc{$"=crs "tsiLbulc"=tesedon-taeper "redaeh"=di a<
>
> a<
a<
a<
>
>
> unem<
unem<
>"retnec sbulc"=ssalc "bulc"=fer "uneMym"=di unem<
unem<
>
>
>"bulC yM"=eltit "nommoc.eltit nommoc"=ssalc "1p"=di viiiid<
> v d<
v d<
v d<
> no tces<
no tces<
>"niam"=di noiiiitces<
>
> no tces<
>redaeh/<
>redaeh/<
>redaeh/<
>redaeh/<
>/
>/
>/ edu cn <
edu cn <
>/ "redaeh/nommoc/cireneg/nommoC"=tnetnoc edullllcniiii<
edu cn <
> redaeh<
redaeh<
>"redaeh"=di redaeh<
>
> redaeh<
>ydob<
>ydob<
>ydob<
>ydob<
> u<
>iiiiu<
> u<
> u<
>secruoser/<
>secruoser/<
>secruoser/<
>secruoser/<
>/
>/
>/ kn <
kn <
>/ "ssc.reccos"=ferh "elytSreccos"=di "teehselyts"=ler kniiiillll<
kn <
>/
>/ "}nocIvaFym{$"=ferh ")'enohPi'(oTsgnoleb:wmym"=rpxe "noci-hcuot-elppa"=ler "enohPInoci"=di kniiiillll<
>/
>/ kn <
kn <
kn <
>/
>/ "}nocIvaFym{$"=ferh "noci-x/egami"=epyt ")'enohPi'(oTsgnoleb:wmym!"=rpxe "noci tuctrohs"=ler "noci"=di kniiiillll<
>/
>/ kn <
kn <
kn <
>secruoser<
>secruoser<
>secruoser<
>secruoser<
>
>
> aed <
aed <
>"bulC yM"=eltit "xedni"=di llllaediiii<
aed <
>2laedi EPYTCOD!<
>? mx?<
mx?<
>? "8-FTU"=gnidocne "0.1"=noisrev llllmx?<
>?
>? mx?<
IDEAL2 Example (I)
- 21. IDEAL2 : UI Components (I)
<input> enables free-form data entry
or a user interface component
appropriate to the datatype of the
bound node.
<select1> | <select> allows the user
to make a single | multiple selection
from multiple choices.
<textarea> multi-line text input element
<submit> launches an update of the model (initiates a submission)
<trigger> requests something from the UI without updating the
model
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 22. IDEAL2 : UI Components (II)
<upload> enables the common
feature found on Web sites to upload
a file from the local file system
<inputDate> accepts a date as input. It
can be rendered as: calendar, set of input
fields, wizard, …
<inputTime> accepts a time as input
(hours, minutes and seconds)
<range> allows selection
from a sequential range of
values
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 23. IDEAL2 : UI Components (III)
<smsSend> allows to
send a SMS
<phoneBookAdder> adds telephone
numbers to the agenda
<image> | <figure> to display images
(subject to content selection or
transcoding)
<telephoneCaller> allows to
trigger a phone call
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 24. IDEAL2 : UI Components (IV)
<menu> represents a navigation
list. It can be rendered as:
(combo sensitive to changes,
clickable images, list of links, …)
<chainedMenu> It is a set
of mutually dependant
menus
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 25. IDEAL2 : UI Components (V)
<table> represents data in
tabular mode
<placard> a container that supports
advanced layouts combining text and
images
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 26. IDEAL2 : UI Components (VI)
<carousel> displays sequentially a dynamic catalogue of
objects
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 27. IDEAL2 : UI Components (VII)
IDEAL2 Extensions (maps, statistical graphics, …)
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 28. Device Description Framework
MyMobileWeb’s DDR Service provides
information about the “a priori known”, i.e.
static, characteristics of a delivery context. Application Service
— For instance, the display width of a device
when it is in its default orientation.
ServiceImpl
MyMobileWeb is able to connect to any Vocabularies
DDR supporting the W3C’s DDR Simple description and
sources mapping
API Recommendation.
— Connectors with the most popular DDRs
such as WURFL, Device Atlas or UAProf WURFLService UAProfService DeviceAtlasService
are provided off-the-shelf.
Vocabularies mapping
— Multiple vocabularies of properties,
including the W3C’s DDR Core Vocabulary
[11B] and the WURFL’s vocabulary are
supported wurfl uaprof deviceatlas
MyMobileWeb implements an AJAX-based Identification
mechanism devoted to notify the server
when a (dynamic) property changes at
client (device) side during a session.
— For example the screen orientation
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 29. Mobile AJAX Framework Forms Delivery
Context
Enables rich interactions in different
Javascript-enabled browsers. XForms
Engine
Provides (cross-browser)
convenience methods for:
— asynchronous HTTP requests Form
DCCI
— insertion of server-side generated Autocompletion
markup fragments
— DOM manipulation (adding elements,
hiding, showing, enabling, disabling
…) Core
— advanced UI components (calendar,
slider, tabs, …) UI
Commons
Controls
— XForms client-side bindings
JS is always sent compressed and
minimized in order to save bandwidth AJAX Debug
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 30. SCXML
State Chart XML (SCXML) is a W3C
standard
— General purpose language for
describing state machines
— Based on Harel States Tables c
c
c
c
— Used to specify MyMobileWeb’s Machine State – User 1
c
application flows Control + Event
Model
HTTP
Application Flows describe the
behavior to be performed in reaction HTTP c
c
c
to the interaction of the user with the c
c
system. Machine State – User N
Controller View
— The set of actions to be performed by
Application Server
an application flow does not only
depend on the events raised by the
user interface but also on the
application state.
– For example, the next page to be loaded
when a link is activated could depend
not only on the activated link per se, but
also on the user profile.
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 31. SCXML Example
Statistics Rounds
Statistics.barchar Rounds.round
entry / executeOA (‘StandingsOA’’)
entry / executeOA (‘GamesOA’’)
init.activate
init.activate [option == ‘rounds’]
[option == ‘statistics’]
Club
Club.clubSelection
InitialMenu entry / executeOA (‘ClubsOA’)
init.activate
[option == ‘club’]
InitialMenu.index
clubSelection.activate
Club.clubDetail
entry / executeOA (‘ClubNameOA’’)
init.activate
[option == ‘news’]
club.activate
News [option == ‘news’] club.activate / propageVar()
[option == ‘gallery’]
News.newsList
entry / executeOA (‘NewsListOA’’)
Gallery
Gallery.gallery
read.activate entry / executeOA (‘GalleryOA’’)
News.newsDetail
myCarousel.activate
entry / executeOA (‘NewsDetailOA’)
Gallery.photo
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 35. MyMobileWeb downloads per month
(last 30 months)
600
500 483
470
391
400
364 366 361
329
317 321 311
Downloads
295
300
267 262 260
241
232 235 downloads
200 190 175 171
188
162 169 162
143 150 138
132 134
100
0
/07
/08
/08
/09
/09
/07
/01
/07
/01
/07
31
31
31
31
31
Month
November 25th: 9812 Average: 255 per month
Total: 8711, 17th August 2009
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 36. MyMobileWeb mailing list traffic per Month
(last 30 months)
140
123
120
105
100
Message Count
80
69
60 posts
51
questions
40 37
34 35
32
28
26 26 26
23 24 23 22
19 20
20 17 17
13 12 13
11 10 10 10
8
6
0
/0 7
/0 8
/0 8
/0 9
/0 9
/0 7
/0 1
/0 7
/0 1
/0 7
31
31
31
31
31
Month
Average: 12 questions per month Average: 30 posts per month
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 38. MyMobileWeb Training
A free Certification Course is run twice a year
— More than 40 developers already certified in Spain
— We are starting to define a certification program for certification
authorities
– Interest from Indian companies in becoming certification authorities in
Asia
Books
— Mobile Web Development (2008)
– Author: Nirhav Mihta. Publisher: Packt Publishing
– A section entirely dedicated to MyMobileWeb
— Mobile Web 2.0: Developing and Delivering Services to Mobile
Phones (To appear on 2010)
– Authors: Syed A. Ahson; Mohammad Ilyas (Microsoft)
– It will include an specific chapter on MyMobileWeb
— MyMobileWeb in Action (to appear in 2010)
– A proposal has been made to Manning Publications and Packt
Publishing
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 39. Remarkable External References
http://www.meicom.hku.hk/CPD/CPD_SummerSem_2008-09.doc Summer Course at the University of Hong
Kong
http://www.javahispano.org/contenidos/archivo/393231/DesarrolloW Tutorial de Desarrollo Web para
ebDispositivosMoviles.pdf Dispositivos Móviles (JavaHispano)
http://comunicacio.barcelonamedia.org/Recull/2009_01_22/Ciberpai Diario El Pais, 22 Enero 2009
s.pdf
http://www.publico.es/ciencias/229464/internet/carta/abierto?orden= Dario Público, 2 Junio 2009
VALORACION&asc=&aleatorio=0.5
http://research.nokia.com/files/Haumont-dotMobi.pdf DotMobi a key enabler for the mobile
internet
http://vettrend.polito.it/sito/common-folder/wp2/o2-2.3/a2-2-3.2/r2-2- State of the Art mobile web development
3.2/P1%20-%20P10%20%20R2.2.3.2%20.doc (University of Torino)
http://www.infolancer.net/freelance/Isaac_Lopez_Pena/12afzub42kc CV of a freelance consultor
e66yap8x
http://pc.dev.mobi/?q=node/208 dev.mobi mobile web developers reference
http://dev.mobi/node/83 site
W3C MobileOK standard http://www.w3.org/2008/06/mobileok- W3C standards-compliant frameworks
implementation-report
DDR Simple API
http://www.w3.org/2005/MWI/DDWG/drafts/api/test-report.html
Mobile Developer’s Guide to the Galaxy Mobile Developer’s Guide published at
http://www1.j2mepolish.org/downloads/MobileDevelopersGuideToTh OSIM Conference
eGalaxy.pdf
http://www.developershome.com/books/mwd/other-tools.asp Developers Home for Mobile Technologies
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 41. Success Stories
GAOM
GAOM - Gestión de Actividad de
Operación y Mantenimiento de
Telefónica de España
Developer: TI+D
Functionalities:
— Field Workers (GMOs) can query the
tasks they have to complete
— Task workflow
TELEFÓNICA I+D
41
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 42. Success Stories
Caixa Galicia
Caixa Galicia’s mobile web portal
Developer: Caixa Galicia in house
Functionalities:
— Information about the services
offered:
– Premises, ATMs
– Products
– Alerts
– Promotions
– …
TELEFÓNICA I+D
42
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 43. Success Stories
andalucia.mobi
andalucia.mobi is the mobile-optimized
version of andalucia.org (web portal
about tourism in Andalucia)
Developer: Yaco Sistemas (SME)
Functionalities:
— Information about beaches
— Golf
— Accommodation (hotels,…)
A new version is on development
TELEFÓNICA I+D
43
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 44. Success Stories
Lérida’s Council
paeria.mobi is the mobile web channel
for the 010 service (information for
citizens)
Developer: iWS (SME)
Functionalities:
— Local information
— Telephones
— Agenda
TELEFÓNICA I+D
44
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 45. Success Stories
EducaMadrid
educamadrid.mobi: mobile portal owned
by Consejería de Educación de la
Comunidad de Madrid
Developer: Germinus
Functionalities:
— News
— Events
TELEFÓNICA I+D
45
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 46. Other Sites and Applications
Client / Project & URL Use
IWS own mobile portal A fully working and usable proof of concept using MMW, showing our clients
http://m.iws.es our products, services and news.
Sabadell City Council This mobile site shows thousands of differents informations from the city council
http://m.sabadell.cat to his citizens.
Feria de Teatro en la calle Spain’s largest theater market shows to people attending the event many kinds
http://mobi.Firatarrega.com of news, information and timetables .
LleidaLanParty (not in use at this time)
http://mobi.lleidalanparty.com Mobile portal information for Spain’s fourth in size Lan Party, mainly news.
Lleida Cine Movie showtimes and information for all the theaters in Lleida’s province.
http://mobi.lleida.com Updated weekly.
WebXpress Mobile Simple web portal for SMB’s, containing info, news, location and contact form.
Many
Sevi.mobi Provides different informations about Seville’s local council services, such as
http://sevi.mobi bycicle renting.
PortalMobil (not finished)Site with two goals, give a useful listing of .mobi url’s to visit,
http://Portalmobil.mobi continuosly updated by our editors, and as promotion for our mobile
products and services.
Hospital de Fuenlabrada This project is a quality service and assistance process set-up at the Hospital
for the remote control of babies born with low weight and recovering at
home, following the established medical protocol.
murciaturistica.mobi In development. Mobile tourism portal for Murcia’s region
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 48. MyMobileWeb Roadmap
Next Milestone:
— Version 4.0 (to be released on 21st December 2009)
New components planned for 2010
— Evolve the AJAX framework and the UI components
– HTTP server-sent events for push applications
– Animations / Transitions to improve the user experience on adaptation
– New UI components
– Maps
– Improved iPhone rendering possibly based on SVG
— IDEAL2
– Better support of multimedia content
– New statistical graphics
– SVG-Based rendering engine
— Remove WURFL dependencies from the DDR Service
— Framework for offline applications compliant with the HTML5 offline capabilities
— Declarative development of context-aware mobile apps while respecting
privacy and security policies
– Compliant with W3C DAP / OMTP-Specifications
— Enabling the development of Adaptive Mobile Widgets
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 51. How to install the development environment (I)
http://forge.morfeo-project.org/wiki_en/index.php/MyMobileWeb_Getting_Started_4.0
Install the DDR REST Service which provides information
about the static characteristics of a delivery context
— Download the software Device Information Simple API and
uncompress the tar.gz
— Deploy the service in your Server
copy
— Run the Service (on Apache Tomcat)
– JVM parameters ‘-Xms512m -Xmx512m ’
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 52. How to install the development environment (II)
Install MyMobileWeb SDK 4
— Download the software and uncompress the tar.gz
Install MyMobileWeb Eclipse Plugin
— Download the plugin, uncompress and install
copy
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 53. MyMobileWeb Eclipse Plugin Configuration
Setting the MyMobileWeb SDK path…
— Go to Window > Preferences > MyMobileWeb
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 54. Creating a new MyMobileWeb Project (I)
New Project Examples developed
with MyMobileWeb
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 55. Creating a new MyMobileWeb Project (II)
Project
name
Define a new installed
server runtime
environment for the
application
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 56. Creating a new MyMobileWeb Project (III)
Choose the flow
Control (by default
SCXML)
It’s available only if
the flow is defined
using Java classes
Create the initial
case use
Generate the empty project…
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 57. MyMobileWeb Project Structure
Source code (Java classes, e.g. OAs)
W-CSS
Device Clustering
Configuration & DC Cache
ActiveX and RDF
Multi-Language Flow definition by means of SCXML
(literals & messages)
Use cases (OP) and presentations
Platform images
(pagination, range, etc) AJAX Framework & Validation JS
MyMobileWeb Configuration
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 59. Soccer Portal “La Liga”
TELEFÓNICA I+D
© 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
- 60. © 2009 Telefónica Investigación y Desarrollo, S.A. Unipersonal
TELEFÓNICA I+D
>etats/<
>etats/<
>/ "scit sitatS"=te grat "}'scitsitats' == n oitp o{$"= d n oc " eta vitca.tini"=tneve noitisnart<
>/ " sd n uo R"=te gr at "}'sd n u or' == n oitp o{$"= d n oc " eta vitca.tini"=tneve noitisnart<
>/ "n oitcel eS b ulc.b ulC"=te grat "}'b ulc' == n oitp o{$"= d n oc " eta vitca.tini"=tneve noitisnart<
>/ "sw e N"=te grat "}'sw e n' == n oitp o{$"= d n oc " eta vitca.tini"=tneve noitisnart<
> "w ei V"= yro g eta c:wm ym "xe d ni.u n e Mlaiti nI"=di
etats<
> "xe d ni.un e Ml aiti nI"=l aiti ni "e sa CesU"= yro g eta c:wm ym "u n e Ml aitinI"= di
etats<
SCXML excerpts
>etats/<
>etats/<
>etats/<
>etats/<
>etats/<
>etats/<
>etats/<
>etats/<
>/
>/
>/
>/ "yrella g.yrell aG"=te grat "etavitca.kca bl"=tneve no t snart<
noiiiitiiiisnart<
no t snart<
no t snart<
>
>
>
> "w eiV"=yro g etac:w mym " oto h p.yrell aG"=di etats<
etats<
etats<
etats<
>etats/<
>etats/<
>etats/<
>etats/<
>/
>/
>/
>/ "b ul C"=te grat "etavitca.kca bl"=tneve no t snart<
noiiiitiiiisnart<
no t snart<
no t snart<
>/
>/
>/
>/ " oto h p.yrell a G"=te grat " eta vitca.l esu ora Cym"=tneve no t snart<
noiiiitiiiisnart<
no t snart<
no t snart<
>yrtneno/<
>yrtneno/<
>yrtneno/<
>yrtneno/<
>/
>/
>/
>/ "AOyrell aG"=AO di AOetucexe:wmym<
AOetucexe:wmym<
AOetucexe:wmym<
AOetucexe:wmym<
>yrtneno<
>yrtneno<
>yrtneno<
>yrtneno<
>
>
>
> "w eiV"=yr og eta c:wmym "yrell a g.yrell aG"=di etats<
etats<
etats<
etats<
yrell ag.yrellaG"=l aiti ni "esa C esU"=yr og eta c:wm ym "yrell aG"= di etats<
etats<
etats<
etats<
Application Flow as a finite state machine