Web Widgets on Android MobileMonday Developer Day, Dusseldorf, 23 February 2010
Status Quo: Ecosystem View <ul><li>Android is  not  YAMP!  (Yet Another Mobile Platform) </li></ul><ul><li>Pervasive, rich...
Status Quo: Developer View <ul><li>Android  is  YAMP in their portfolio! </li></ul><ul><li>Requires new porting efforts, k...
Q: What happens in 2-5 years?
Hopefully not! Source: abcnews.go.com
Can web apps help?
Mobile Web App Ecosystem Browser Web Server Web Server Web Server
Traditional Approach to Mobile Web Apps <ul><li>Advantages: </li></ul><ul><li>Easy, easy, easy! </li></ul><ul><li>Common w...
How about  web   widgets ?
Web Widgets (for Mobile) <ul><li>Define  web widget : </li></ul><ul><li>Application, written using common  web technologie...
Web Widget Anatomy <ul><li>Packaging format: single zip file, .wgt extension </li></ul><ul><li>Mime type: application/widg...
Web Widget Ecosystem Browser Widget Web Server Web Service xyz Server
Web Widgets (for Mobile) <ul><li>Advantages: </li></ul><ul><li>Easy, easy, easy! </li></ul><ul><li>Common web technologies...
What about JIL/BONDI/WAC?
Beyond W3C Widgets <ul><li>BONDI   “uses web technologies and builds upon them to provide new APIs to the key mobile phone...
Use Cases <ul><li>Social Address Book </li></ul><ul><ul><li>Contact list from the native address book </li></ul></ul><ul><...
Enriched Web Widget Ecosystem Browser Widget Messaging Location PIM Gallery Camera File Web Server Web Service xyz Server
Why Should You Care? <ul><li>Too many BIG players pushing for it! </li></ul><ul><li>JIL devices shipped in 2009 </li></ul>...
Beyond JIL/BONDI/WAC (Problem solved! What else can we ask for?)
Beyond JIL/BONDI/WAC Wouldn’t you like to: …  expose your own services to widgets? …  write business logic in Java rather ...
Mobile OSGi <ul><li>But there are efforts in that direction based on  mobile OSGi : </li></ul><ul><li>OSGi used on mobile,...
Mobile OSGi + Web Widgets Mobile OSGi Browser Widget Messaging Location PIM Gallery Camera File Web Server Web Server App ...
Remote OSGi Services Mobile OSGi and Web Widgets? So, how does it work: <ul><ul><li>Step 1:  Design and implement your ser...
Using Services from Widgets <ul><ul><li>Step 3:  Use Remote Service Registry JS API to bind services </li></ul></ul><ul><u...
Conclusion <ul><li>Web Widgets increasingly seen as a  cross-platform  app model with huge market potential </li></ul><ul>...
Additional resources: www.prosyst.com dz.prosyst.com mobileosgi.blogspot.com Thanks Sinisha Djukic [email_address]
Upcoming SlideShare
Loading in …5
×

Web Widgets on Android MobileMonday Developer Day, Dusseldorf ...

1,601 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,601
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
29
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Web Widgets on Android MobileMonday Developer Day, Dusseldorf ...

  1. 1. Web Widgets on Android MobileMonday Developer Day, Dusseldorf, 23 February 2010
  2. 2. Status Quo: Ecosystem View <ul><li>Android is not YAMP! (Yet Another Mobile Platform) </li></ul><ul><li>Pervasive, rich, attractive, (mostly) open </li></ul><ul><li>Enjoys wide industry support </li></ul><ul><li>Shipping 60,000 cell phones per day (but still competing for market share) </li></ul><ul><li>Used increasingly in non-mobile verticals, such as smart home </li></ul><ul><li>Paradigm shift for mobile Java </li></ul>
  3. 3. Status Quo: Developer View <ul><li>Android is YAMP in their portfolio! </li></ul><ul><li>Requires new porting efforts, knowledge, testing, devices, marketing </li></ul><ul><li>Avalanche of versions (1.0-2.1) in just two years! </li></ul><ul><li>OEMs & operators customize UI, features, APIs to bring value and differentiate </li></ul><ul><li>Different features and screen sizes to be addressed </li></ul>Porting for and within Android ecosystem is a full time job!
  4. 4. Q: What happens in 2-5 years?
  5. 5. Hopefully not! Source: abcnews.go.com
  6. 6. Can web apps help?
  7. 7. Mobile Web App Ecosystem Browser Web Server Web Server Web Server
  8. 8. Traditional Approach to Mobile Web Apps <ul><li>Advantages: </li></ul><ul><li>Easy, easy, easy! </li></ul><ul><li>Common web technologies, portable, variety of tools </li></ul><ul><li>Lots of web developers  </li></ul><ul><li>Apps in the cloud easy to update </li></ul><ul><li>Disadvantages: </li></ul><ul><li>No integration with phone functions, like location, messaging, PIM, address book, etc. </li></ul><ul><li>Data bandwidth </li></ul><ul><li>No offline mode </li></ul><ul><li>Web page lifecycle doesn’t feel like native app </li></ul>
  9. 9. How about web widgets ?
  10. 10. Web Widgets (for Mobile) <ul><li>Define web widget : </li></ul><ul><li>Application, written using common web technologies (HTML, JS, SVG, Flash, etc.) </li></ul><ul><li>Deployed as a single package file into the end user's browser </li></ul><ul><li>Processed and interpreted as a set of locally-hosted web pages </li></ul><ul><li>Obeying lifecycle, security and networking requirements </li></ul><ul><li>Lifecycle feels like a native app </li></ul><ul><li>Originally developed by Opera and called Opera Widgets: http:// widgets.opera.com </li></ul><ul><li>Evolved further into W3C Widget specification: http://www.w3.org/TR/widgets/ </li></ul>
  11. 11. Web Widget Anatomy <ul><li>Packaging format: single zip file, .wgt extension </li></ul><ul><li>Mime type: application/widget </li></ul><ul><li>Configuration (manifest) file: config.xml </li></ul><ul><li>Entry point: index.html or custom file </li></ul><ul><li>Content: HTML, JS, any resource, any mime type recognized by the browser (Flash, SVG, video, etc.) </li></ul><ul><li>Security and networking enforcement </li></ul><ul><li>Signing </li></ul><?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?> <widget version=&quot;1.0“ xmlns=&quot;http://www.w3.org/ns/widgets&quot; id=&quot;http://acme.com/MyFancyWidget&quot; width=&quot;240&quot; height=&quot;320&quot;> <name>My Fancy Widget</name> <icon src=&quot;icons/icon.png&quot;/> <content src=&quot;index.html&quot;/> </widget> Example: config.xml
  12. 12. Web Widget Ecosystem Browser Widget Web Server Web Service xyz Server
  13. 13. Web Widgets (for Mobile) <ul><li>Advantages: </li></ul><ul><li>Easy, easy, easy! </li></ul><ul><li>Common web technologies, portable, several SDKs </li></ul><ul><li>Lots of web developers  </li></ul><ul><li>Works in offline mode </li></ul><ul><li>Lifecycle feels like a native app </li></ul><ul><li>Disadvantages: </li></ul><ul><li>No integration with phone functions, like location, messaging, PIM, address book, etc. </li></ul>
  14. 14. What about JIL/BONDI/WAC?
  15. 15. Beyond W3C Widgets <ul><li>BONDI “uses web technologies and builds upon them to provide new APIs to the key mobile phone functionality like Contacts, Calendar, Messaging & Location” </li></ul><ul><li>JIL will “enable different widgets and applications to run seamlessly on different handset platforms and operating systems across different mobile operators, while safeguarding customer security, data privacy and billing systems” </li></ul><ul><li>Wholesale Applications Community (WAC) “aims to unite a fragmented marketplace by involving players from all related industries to create a community based on openness and transparency to the benefit of all” </li></ul><ul><li>Translation please: cross-platform app model, based on W3C Widgets, extended by built-in JavaScript APIs for device access </li></ul>
  16. 16. Use Cases <ul><li>Social Address Book </li></ul><ul><ul><li>Contact list from the native address book </li></ul></ul><ul><ul><li>Existing Facebook friends automatically detected </li></ul></ul><ul><ul><li>Direct access to the friend’s wall </li></ul></ul><ul><ul><li>Messaging editor with merged SMS and Facebook history </li></ul></ul><ul><ul><li>Buttons to initiate a voice/video call </li></ul></ul><ul><li>Sticky GeoNotes </li></ul><ul><ul><li>Paper notes are so lame  </li></ul></ul><ul><ul><li>Leave a text/voice/video message for your family and colleagues </li></ul></ul><ul><ul><li>Based on your current location </li></ul></ul>
  17. 17. Enriched Web Widget Ecosystem Browser Widget Messaging Location PIM Gallery Camera File Web Server Web Service xyz Server
  18. 18. Why Should You Care? <ul><li>Too many BIG players pushing for it! </li></ul><ul><li>JIL devices shipped in 2009 </li></ul><ul><li>BONDI devices shipping in 2010 </li></ul><ul><li>Cross-platform apps easier to develop! </li></ul><ul><li>But beware of these pitfalls: </li></ul><ul><li>Browser-specific workarounds </li></ul><ul><li>Screen sizes and orientation </li></ul><ul><li>Large amounts of business logic and networking code in JS may not be too much fun </li></ul>
  19. 19. Beyond JIL/BONDI/WAC (Problem solved! What else can we ask for?)
  20. 20. Beyond JIL/BONDI/WAC Wouldn’t you like to: … expose your own services to widgets? … write business logic in Java rather than JavaScript? … write networking code in Java rather than JavaScript? … leave the widget code to UI designers and developers? You’d be out of luck nowadays: current implementations don’t provide means to extend the device APIs
  21. 21. Mobile OSGi <ul><li>But there are efforts in that direction based on mobile OSGi : </li></ul><ul><li>OSGi used on mobile, embedded, smart home, enterprise platforms, and spreading </li></ul><ul><li>Mobile OSGi (JSR 232) deployed on a wide variety of mobile platforms (Android, Symbian, WM, BREW) </li></ul><ul><li>Enables dynamic code deployment and update, dynamic service wiring, code reuse, versioning and more: </li></ul><ul><ul><li>http:// www.osgi.org/About/WhyOSGi </li></ul></ul><ul><li>OSGi complements , not replaces Android platform </li></ul><ul><ul><li>http:// www.osgi.org /About/Technology </li></ul></ul>
  22. 22. Mobile OSGi + Web Widgets Mobile OSGi Browser Widget Messaging Location PIM Gallery Camera File Web Server Web Server App Service Web Service xyz Server
  23. 23. Remote OSGi Services Mobile OSGi and Web Widgets? So, how does it work: <ul><ul><li>Step 1: Design and implement your service in Java </li></ul></ul><ul><ul><li>public interface MyService { </li></ul></ul><ul><ul><li>public void doSomething(String param); </li></ul></ul><ul><ul><li>} </li></ul></ul><ul><ul><li>Step 2: Register in OSGi as “remotable” service </li></ul></ul><ul><ul><li>MyService instance = new MyServiceImpl(); </li></ul></ul><ul><ul><li>Properties props = new Properties(); </li></ul></ul><ul><ul><li>props.put(&quot;org.osgi.remote.publish&quot;, Boolean.TRUE); </li></ul></ul><ul><ul><li>bundleContext.registerService(MyService.class.getName(), </li></ul></ul><ul><ul><li>instance, props); </li></ul></ul>
  24. 24. Using Services from Widgets <ul><ul><li>Step 3: Use Remote Service Registry JS API to bind services </li></ul></ul><ul><ul><ul><ul><li>and get a proxy service object </li></ul></ul></ul></ul><ul><ul><li>var so = RSR.bind(“MyService”); </li></ul></ul><ul><ul><li>Step 4: Invoke a function on the proxy service object </li></ul></ul><ul><ul><li>so.doSomething(“param”); </li></ul></ul>Easy enough!
  25. 25. Conclusion <ul><li>Web Widgets increasingly seen as a cross-platform app model with huge market potential </li></ul><ul><li>Android-based devices supporting Web Widgets are shipping now </li></ul><ul><li>Web Widgets are empowered with rich device access capabilities </li></ul><ul><li>Mobile OSGi offers a middleware solution to allow dynamic APIs for Widgets </li></ul>
  26. 26. Additional resources: www.prosyst.com dz.prosyst.com mobileosgi.blogspot.com Thanks Sinisha Djukic [email_address]

×