This document discusses mobile widgets and their development. Mobile widgets are offline-capable mobile applications that appear as icons in the device's apps menu and are built using HTML, CSS, JavaScript and AJAX. They are supported on platforms like WebOS and Android. The document outlines the benefits and challenges of mobile widgets, compares different widget platforms, and discusses how to build cross-platform mobile widgets.

1. Mobile Widget Development
Maximiliano Firtman!
Firt! Firt.mobi!

2. Inside Mobile July, 27th 2009
San José, CA
twi%er.com/firt
www.firt.mobi
www.mobile0nyurl.com
www.widgen.com
Maximiliano Firtman!
Firt! Firt.mobi!

3. What
Mobile Widgets

4. What
Offline capable mobile applica0ons
Icon in the apps menu
HTML, CSS, JavaScript, AJAX
Invisible to the user
Meaning in WebOS and Android
Mobile Widgets

5. Why
Vendors Roadmap
Device fragmenta0on is increasing
We need to be fast
“… is the future of mobile applica0ons”,
Google, July, 16th 2009
InsideMobile
Non
Related
30%
Related
70%

6. Positive
Well‐known technologies
Tools, Frameworks, IDEs
Web APIs
Low 0me‐to‐market
Por0ng
Applica0on Stores!
Only a few UI rendering engines
Easy to port from/to desktop

7. Negative
We s0ll need por0ng
Debugging
Standards
It's not na0ve, we know that..
Performance
Not for all kind of apps

8. Can Can’t
Applica0ons 2D games*
Web Mashups 3D games
Mobile Clients High CPU apps
Casual games Background apps*

9. Architecture

10. Architecture

11. Architecture

12. Cross Platform Standards

13. Cross Platform Standards
For packaging
W3C Widget
Apple Widget
For Mobile Pla4orm Access
W3C Geoloca0on & MWI
BONDI
HTML 5
Google Gears
Nokia Plaform Services 2.0
ad.ag/jgwajg

14. Tools
For coding
Aptana / Eclipse
Adobe Dreamweaver
Visual Studio
For packaging / signing
Nokia WRT plugins
Motodev.UI
Mojo SDK
PhoneGap Projects
Any ZIP packager!

15. Let’s talk about platforms!

16. Symbian Foundation!
Web Run0me
First class ci0zen
Available Today
Versions
WRT 1.0
WRT 1.1 [MiniView]
Plaform Services 2.0

17. iPhone OS!
WebClip with icon
Available Today
Versions
Webapps for iPhone 2.0
Webapps for iPhone 3.0
Hybrid

18. Palm WebOS!
Available Today
Unique developer plaform
Mojo Framework
Versions
Full feature apps
Browser based

19. Windows Mobile!
Since 6.5
Uses Internet Explorer
Versions
Widget
Hybrid (< 6.5)
BONDI Ac0veX (< 6.5)

20. Android!
Widget / AppWidget
Versions:
Hybrid
Offline webapp

21. BlackBerry!
Widget Plaform Announced
Private tes0ng right now
Will be first class ci0zen as COD files
Versions
Widget
Hybrid

22. Motorola WebUI!
Available Today
Future?
Versions
WebUI Widgets
Full feature Widget apps

23. LG Widget Platform!
Plaform announced
SDK available
Based on BONDI 1.0

24. Samsung Widgets!
Cross Plaform
Available at the Home Screen
WRT available in Symbian
Resizable
In Symbian, two plaforms

25. Opera Widgets!
Cross Plaform
Available for many operators

26. JIL – Joint Innovation Lab!
Cross Plaform
Future devices
SDK Available
Billing inside

27. Just for the record…!
• HTML based
– ACCESS NetFront Widgets
• Adobe Flash based
– Sony Ericsson’s Capuchin Project
– Nokia Flash (NFL Format) for S40
– Flash Mobile Packager
• XML and some script based
– Prosciu%o Project (Java ME)
– Yahoo! Blueprint
– Orange Djinngo
– Sun Java On Device Portal

28. Let’s talk about !
challenges!

29. UI Challenges
UI Frameworks
HTML / CSS
Mojo
WRTKit
iUI
Na0ve menus
Interac0on Mode
View only
(mul0) Touch
Pointer
Focus

30. UI Challenges
Mul0ple views
Links
Sta0c DIVs
Dynamic DIVs
AJAX DIVs
Layout
Fixed
Liquid

31. Code Challenges
Performance
Dynamic app update
Pushing data
Por0ng
Using body class pa%ern
Using one CSS and JS per plaform
Data Storage
SQL
Key/Value

32. Comparison
Available Today
Browser Engine
WebKit IE WebKit Opera WebKit
Package Type
Signing
Standards
Bondi
Distribution Channel
OTA / Offline Installation

33. Privacy and Security
If a widget is a ZIP
…
can I unzip it?

34. Can we create a one cross
platform code?

35. I think YES!
Define the UI
Define the app logic
Create the device detec0on framework
Port the logic and UI
Test & Debug
Package for every plaform
For OTA
Device Detec0on
Show Webapp or package delivery

36. To Read…

37. THANK YOU!
Twi%er.com/firt
www.firt.mobi
www.mobile0nyurl.com
www.widgen.com
Pictures from freedigitalphotos.net