mobile-times 2010: cross platform apps

48
Mobile Apps Cross Platform Wolfram Kriesing uxebu Donnerstag, 4. März 2010

Upload: wolframkriesing

Post on 28-Nov-2014

3.058 views

Category:

Technology


0 download

DESCRIPTION

The base of cross platform is HTML, which exists on every phone with a browser. Slides show how W3C widgets are the center for our cross platform approach.

TRANSCRIPT

Page 1: Mobile-Times 2010: Cross Platform Apps

Mobile AppsCross Platform

Wolfram Kriesinguxebu

Donnerstag, 4. März 2010

Page 2: Mobile-Times 2010: Cross Platform Apps

We open the mobile web.

Donnerstag, 4. März 2010

Page 3: Mobile-Times 2010: Cross Platform Apps

Donnerstag, 4. März 2010

Page 4: Mobile-Times 2010: Cross Platform Apps

Landscapehttp://www.flickr.com/photos/tillwe/146242691/

Donnerstag, 4. März 2010

Page 5: Mobile-Times 2010: Cross Platform Apps

Landscapehttp://www.flickr.com/photos/tillwe/146242691/

Donnerstag, 4. März 2010

Page 6: Mobile-Times 2010: Cross Platform Apps

http://bit.ly/distimo-appstores

30th July 200914 Stores23rd September 2009

23 Stores2nd December 2009

26 Stores

Donnerstag, 4. März 2010

Page 7: Mobile-Times 2010: Cross Platform Apps

Cross Platform

Donnerstag, 4. März 2010

Page 8: Mobile-Times 2010: Cross Platform Apps

Objective-C JavaSymbian C

.NETJava ...

Donnerstag, 4. März 2010

Page 9: Mobile-Times 2010: Cross Platform Apps

HTML

Donnerstag, 4. März 2010

Page 10: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/robadob/88901885/

Engine of the web

Donnerstag, 4. März 2010

Page 11: Mobile-Times 2010: Cross Platform Apps

Why HTML?

•lot of devs

•easy to write

•common

•easy to test

•stable standard

•widely spread

Donnerstag, 4. März 2010

Page 12: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/chris_radcli!/2947219465/

iPhone - First usable mobile browser

Donnerstag, 4. März 2010

Page 13: Mobile-Times 2010: Cross Platform Apps

http://bit.ly/tomiahonen-2010-almanac

71% of all phoneshave a modern!xTML web browser.

Donnerstag, 4. März 2010

Page 14: Mobile-Times 2010: Cross Platform Apps

App Store without Apple!

Donnerstag, 4. März 2010

Page 15: Mobile-Times 2010: Cross Platform Apps

HTML works everywhere!

all the (smart)phones have browsers

low hanging fruit

Donnerstag, 4. März 2010

Page 16: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/halfbisqued/2353845688

=W3C Widget,

Vodafone360 App

Donnerstag, 4. März 2010

Page 17: Mobile-Times 2010: Cross Platform Apps

What is a Widget?

Donnerstag, 4. März 2010

Page 18: Mobile-Times 2010: Cross Platform Apps

Donnerstag, 4. März 2010

Page 19: Mobile-Times 2010: Cross Platform Apps

}?

Donnerstag, 4. März 2010

Page 20: Mobile-Times 2010: Cross Platform Apps

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

Donnerstag, 4. März 2010

Page 21: Mobile-Times 2010: Cross Platform Apps

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

Donnerstag, 4. März 2010

Page 22: Mobile-Times 2010: Cross Platform Apps

Database

Designstyle.css

Layoutindex.html

AJAX Library

Donnerstag, 4. März 2010

Page 23: Mobile-Times 2010: Cross Platform Apps

Layoutindex.html

Designstyle.css

Database

AJAX LibraryConfiguration

config.xml

W3C Widget =Icon

Donnerstag, 4. März 2010

Page 24: Mobile-Times 2010: Cross Platform Apps

What is a W3C Widget?

•HTML

•CSS

•JavaScript

•config.xml

•zip it

• rename to *.wgt

Donnerstag, 4. März 2010

Page 25: Mobile-Times 2010: Cross Platform Apps

DONE!http://www.flickr.com/photos/sundazed/2704578067/

Donnerstag, 4. März 2010

Page 26: Mobile-Times 2010: Cross Platform Apps

On any phone?

Donnerstag, 4. März 2010

Page 27: Mobile-Times 2010: Cross Platform Apps

HTML

native

Donnerstag, 4. März 2010

Page 28: Mobile-Times 2010: Cross Platform Apps

HTML

native

W3C Widgets

native

Donnerstag, 4. März 2010

Page 29: Mobile-Times 2010: Cross Platform Apps

...yes

W3C Widgets

not purely

but greatHTML

support

Donnerstag, 4. März 2010

Page 30: Mobile-Times 2010: Cross Platform Apps

Almost for free

•Facebook widget

•Dashboard widget

•Website widget

•TV Widget

• ...

Donnerstag, 4. März 2010

Page 31: Mobile-Times 2010: Cross Platform Apps

A Phone is ...

Donnerstag, 4. März 2010

Page 32: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/kratz/1984004945/

Donnerstag, 4. März 2010

Page 33: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/mbiddulph/3087388964/

Donnerstag, 4. März 2010

Page 34: Mobile-Times 2010: Cross Platform Apps

http://www.flickr.com/photos/redstamp/4222841946/

Donnerstag, 4. März 2010

Page 35: Mobile-Times 2010: Cross Platform Apps

• Camera

• Compass

• GPS

• Accelerometer

• Calendar

• Email

• Address book

• Watch

• Alarm clock

• ...

Donnerstag, 4. März 2010

Page 36: Mobile-Times 2010: Cross Platform Apps

Multiple Ways

• W3C Spechttp://w3.org/2009/dap/

• JIL Spechttp://www.jil.org/

• BONDI Spechttp://bondi.omtp.org/

Donnerstag, 4. März 2010

Page 38: Mobile-Times 2010: Cross Platform Apps

PhoneGap"An express goal of the PhoneGap project

is for the project to not exist."

Open Source

Donnerstag, 4. März 2010

Page 39: Mobile-Times 2010: Cross Platform Apps

http://phonegap.pbworks.com/Roadmap

Donnerstag, 4. März 2010

Page 40: Mobile-Times 2010: Cross Platform Apps

Some numbers

•iPhone App = 364 kB

•JavaScript, HTML, CSS, media = 124 kB

• that means PhoneGap+SDK foot print = 240 kB

Donnerstag, 4. März 2010

Page 41: Mobile-Times 2010: Cross Platform Apps

EventNinja

Donnerstag, 4. März 2010

Page 42: Mobile-Times 2010: Cross Platform Apps

Database

Layoutindex.html

Designstyle.css

AJAX LibraryConfiguration

config.xml

Icon

Events,a Calendar

Donnerstag, 4. März 2010

Page 43: Mobile-Times 2010: Cross Platform Apps

http://bit.ly/webdev-events

Donnerstag, 4. März 2010

Page 44: Mobile-Times 2010: Cross Platform Apps

Donnerstag, 4. März 2010

Page 45: Mobile-Times 2010: Cross Platform Apps

Donnerstag, 4. März 2010

Page 46: Mobile-Times 2010: Cross Platform Apps

Donnerstag, 4. März 2010

Page 47: Mobile-Times 2010: Cross Platform Apps

http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/

Donnerstag, 4. März 2010

Page 48: Mobile-Times 2010: Cross Platform Apps

thx

http://uxebu.com

Wolfram Kriesing, uxebu

[email protected]://twitter.com/uxebu

http://twitter.com/wolframkriesing

Donnerstag, 4. März 2010