Mobile AppsCross Platform
HTML5 AppsWolfram Kriesing
uxebu
Mittwoch, 12. Mai 2010
We open the mobile web.
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Landscapehttp://www.flickr.com/photos/tillwe/146242691/
Mittwoch, 12. Mai 2010
Landscapehttp://www.flickr.com/photos/tillwe/146242691/
Mittwoch, 12. Mai 2010
http://bit.ly/distimo-appstores
30th July 200914 Stores23rd September 2009
23 Stores2nd December 2009
26 Stores
Mittwoch, 12. Mai 2010
Cross Platform
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Objective-C JavaSymbian C
.NETJava ...
Mittwoch, 12. Mai 2010
HTML
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/robadob/88901885/
Engine of the web
Mittwoch, 12. Mai 2010
Why HTML?
•lot of devs
•easy to write
•common
•easy to test
•stable standard
•widely spread
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/chris_radcli!/2947219465/
iPhone - First usable mobile browser
Mittwoch, 12. Mai 2010
http://bit.ly/tomiahonen-2010-almanac
71% of all phoneshave a modern!xTML web browser.
Mittwoch, 12. Mai 2010
App Store without Apple!
Mittwoch, 12. Mai 2010
HTML works everywhere!
all the (smart)phones have browsers
low hanging fruit
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/halfbisqued/2353845688
=W3C Widget,
Vodafone360 App
Mittwoch, 12. Mai 2010
What is a Widget?
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
}?
Mittwoch, 12. Mai 2010
Types of "Apps"
• Preinstalled
• Native App (from "some" app store)
• Websitelimited access to phone resources
• W3C Widgetaccess by widget runtime
• Wrapped W3C Widgetaccess depends on it's runtime
Mittwoch, 12. Mai 2010
Types of "Apps"
• Preinstalled
• Native App (from "some" app store)
• Websitelimited access to phone resources
• W3C Widgetaccess by widget runtime
• Wrapped W3C Widgetaccess depends on it's runtime
Mittwoch, 12. Mai 2010
Database
Designstyle.css
Layoutindex.html
AJAX Library
Mittwoch, 12. Mai 2010
Layoutindex.html
Designstyle.css
Database
AJAX LibraryConfiguration
config.xml
W3C Widget =Icon
Mittwoch, 12. Mai 2010
What is a W3C Widget?
•HTML
•CSS
•JavaScript
•config.xml
•zip it
• rename to *.wgt
Mittwoch, 12. Mai 2010
DONE!http://www.flickr.com/photos/sundazed/2704578067/
Mittwoch, 12. Mai 2010
On any phone?
Mittwoch, 12. Mai 2010
HTML
native
Mittwoch, 12. Mai 2010
HTML
native
W3C Widgets
native
Mittwoch, 12. Mai 2010
...yes
W3C Widgets
not purely
but greatHTML
support
Mittwoch, 12. Mai 2010
Almost for free
•Facebook widget
•Dashboard widget
•Website widget
•TV Widget
• ...
Mittwoch, 12. Mai 2010
A Phone is ...
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/kratz/1984004945/
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/mbiddulph/3087388964/
Mittwoch, 12. Mai 2010
http://www.flickr.com/photos/redstamp/4222841946/
Mittwoch, 12. Mai 2010
• Camera
• Compass
• GPS
• Accelerometer
• Calendar
• Address book
• Watch
• Alarm clock
• ...
Mittwoch, 12. Mai 2010
Multiple Ways
• W3C Spechttp://w3.org/2009/dap/
• JIL Spechttp://www.jil.org/
• BONDI Spechttp://bondi.omtp.org/
Mittwoch, 12. Mai 2010
Multiple Ways
•JIL Spec http://www.jil.org/
•BONDI Spec http://bondi.omtp.org/
•W3C Spec http://w3.org/2009/dap/
•PhoneGap http://phonegap.pbworks.com/
•Nokia WRT http://bit.ly/nokia-WRT-APIs
•Appcelerator http://www.codestrong.com/timobile/api/
Mittwoch, 12. Mai 2010
Runtimes
•JIL Spec http://www.jil.org/
•BONDI Spec http://bondi.omtp.org/
•W3C Spec http://w3.org/2009/dap/
•PhoneGap http://phonegap.pbworks.com/
•Nokia WRT http://bit.ly/nokia-WRT-APIs
•Appcelerator http://www.codestrong.com/timobile/api/
Nokia S60
iPhone
Android
Blackberry
WindowsMobile
Mittwoch, 12. Mai 2010
PhoneGap"An express goal of the PhoneGap project
is for the project to not exist."
Open Source
Mittwoch, 12. Mai 2010
http://phonegap.pbworks.com/Roadmap
Mittwoch, 12. Mai 2010
Some numbers
Mittwoch, 12. Mai 2010
Some numbers
•iPhone App = 364 kB
•JavaScript, HTML, CSS, media = 124 kB
• that means PhoneGap+SDK foot print = 240 kB
Mittwoch, 12. Mai 2010
Native Look
vs.
One style cross platform
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
EventNinja
Mittwoch, 12. Mai 2010
Database
Layoutindex.html
Designstyle.css
AJAX LibraryConfiguration
config.xml
Icon
Events,a Calendar
Mittwoch, 12. Mai 2010
http://bit.ly/webdev-events
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
Mittwoch, 12. Mai 2010
http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/
Mittwoch, 12. Mai 2010
Want to see it in action?
Download it from your store.
Contact us.
Mittwoch, 12. Mai 2010
thx
http://uxebu.com
Wolfram Kriesing, uxebu
[email protected]://twitter.com/uxebu
http://twitter.com/wolframkriesing
Mittwoch, 12. Mai 2010