dion almaer & ben galbraith - build once, deploy everywhere

craigslist

Apple

Nokia

Palm

Sony

RIMHTC

LG Motorola

1,500,000,000+

Chrome’s V8 Safari’s SquirrelFish Extreme Firefox’s TraceMonkey Opera's Carakan

2.01.0 1.0

Alpha

100x

User Interface

BackgroundThread

2X

Browser

1

Web Workers

HTML5

Web Apps Packaged Apps

Web deployment model✓Use HTML5 app featuresfor caching + integration

✓Package applications✓Deploy to “store”✓

Client Server

HTML / CSS / A little JavaScript

All Business LogicNearly 100% Application Logic

Dumb Forms

Client Server

HTML / CSS / JavaScript

Some Business LogicSome Application LogicSome Application Logic

Data (e.g., JSON)

Some Business Logic

“Web Services”

Client Server

Some Business LogicAll Application LogicSome Business Logic

“Web Services”

Data (e.g., JSON)

Fluid

Appcelerator Titanium

PhoneGap

Palm webOS

Embedded WebKitInstance

+ JS runtime (e.g., V8)

Device-native Application Shell

Titanium Desktop

supports php, Python, Ruby, and Javascript

Titanium Mobile

“We started developing it on Saturday and finished on Monday for both iPhone and Android.

Without Titanium, we would not have been able to get it done.”

• Device

• Notification

• Media

• GeoLocation

• Accelerometer

• Contact

• Camera

PhoneGap

function watchAccel() {

var win = function(a) {

document.getElementById('x').innerHTML = a.x;

document.getElementById('y').innerHTML = a.y;

document.getElementById('z').innerHTML = a.z;

};

var fail = function(){};

var opt = { frequency: 100 };

watchId =

navigator.accelerometer.watchAcceleration(win, fail,

opt);

}

PhoneGap

// watch for swiping

$('#swipeme').bind('swipe', function(event, info) {

console.log(info.direction);

});

// orientation changes

$('body').bind('turn', function(event, info) {

console.log(info.orientation); // landscape/profile

});

// animations

$('#portfolio').bind('pageAnimationEnd',

function(event, info) {

if (info.direction == 'in') loadWorks();

})

Getting Touchy

Tweetie 2Feel the refresh

Palm PreGesture back

Haptics are coming :)

Software keyboard Hardware keyboard

NewsroomViewport on a world

Shake Shake ShakeDefining the new Ctrl-C’s

What does the user want?

Physics Matters