HTML5 Apps - Mobile Developer Summit Bangalore

HTML5 Apps
The mobile web taking over!
@wolframkriesing
@uxebu
Donnerstag, 11. November 2010

We open the mobile web.
@wolframkriesing

http://www.flickr.com/photos/andresrueda/2276197032/

http://www.ﬂickr.com/photos/cmoi/760513848/

JavaScript AJAX
CSS
dojo
Browser
OpenSource
Web2.0
FrontEnd
Usability UserExperience
mobile
TouchScroll

HTML5 Apps
W3C Widgets
universal apps
Hybrid Apps
Mobile Web Apps
anyware
WebWorks
360 Apps
Cross Platform
Mobile Apps
Opera Widgets

Landscape
http://www.ﬂickr.com/photos/tillwe/146242691/

http://bit.ly/distimo-appstores
30th July 2009
14 Stores23rd September 2009
23 Stores
2nd December 2009
26 Stores

Objective-C JavaSymbian C
.NETJava ...

€
€
€
€
€
€€€...

HTML

http://www.ﬂickr.com/photos/robadob/88901885/
Engine of the web

€

€Web Technologies

App Store
without Apple!
App Store
without Apple!

Real Use Case:
EventNinja

http://bit.ly/webdev-events

•CSS
•Help Button
•Back Button
•Next Page Arrow
•Scrolling Area
iPhone vs. WebOS

Facts
• 3 Months Investigation
• 6 SDKs (10GB?, VMs, ...)
• 6 ways to find bugs
• 6 App Stores (Account, Submit, Review, ...)

A Phone is ...

http://www.ﬂickr.com/photos/kratz/1984004945/

http://www.ﬂickr.com/photos/mbiddulph/3087388964/

http://www.ﬂickr.com/photos/redstamp/4222841946/

• Camera
• Compass
• GPS
• Accelerometer
• Calendar
• Email
• Address book
• Watch
• Alarm clock
• ...

Multiple Ways
• W3C Spec
http://w3.org/2009/dap/
• JIL Spec / WAC
http://www.jil.org
http://www.wholesaleappcommunity.com
• BONDI Spec
http://bondi.omtp.org/

http://bit.ly/vf-jil-docs
System Info
Network Info
Phone Info
File
GPS
Contacts
Camera
Audio
SMS, MMS, ...

if (Widget.Device.PowerInfo.isCharging){
alert("Battery is charging");
}
var player = Widget.Multimedia.AudioPlayer;
player.open("myAudioFile.mp3");
player.play(1);
if (Widget.Device.RadioInfo.isRoaming){
alert("Money Money Money");
}

PhoneGap
"An express goal of the PhoneGap project
is for the project to not exist."
Open Source

http://phonegap.pbworks.com/Roadmap

Platform adaptations
Business and
Application logic
conﬁg.xm
l
PhoneGap
info.plist
Android
iP****
Nokia WRT
pure W3C
Widgets
kinda W3C
Widgets

Some numbers
240 kB
124 kB
JavaScript, HTML, CSS, etc.
PhoneGap
native App = 364 kB

EmbedJS

The Supported Devices
... and there will be more
to embed JavaScript on

http://www.ﬂickr.com/photos/tacoekkel/25538919/

http://www.ﬂickr.com/photos/hugo90/3916794427/

Shrink Your API
20kB 8kB

vs.
Simple queries > simple library function
Only ".class" and "#id" queries
Full fledged queries > Full blown library function

vs.
Simple queries > simple library function
Only ".class" and "#id" queries
Full fledged queries > Full blown library function
13 LOC
~200 LOC

At Runtime
At Build Time

dojo-blackberry.js
dojo-blackberry46.js
dojo-nokia-wrt.js
dojo-opera.js
dojo-webkit-mobile.js
dojo-windows-mobile.js

Wolfram Kriesing
http://apparat.io
http://embedjs.org
Thank you

HTML5 Apps - Mobile Developer Summit Bangalore

More Related Content

Similar to HTML5 Apps - Mobile Developer Summit Bangalore (20)

More from wolframkriesing (20)

Recently uploaded (20)

HTML5 Apps - Mobile Developer Summit Bangalore