81
Human APIs expanding the mobile web SWDC - June 3rd 2010 Nikolai Onken uxebu Thursday, June 3, 2010

Human APIs, the future of mobile

Embed Size (px)

DESCRIPTION

In this talk I am looking at the potential of the browser, how we already today can expose custom APIs to mobile devices. Topics include Audio APIs, accessing Bluetooth from the browser, the browser in transportation and more.

Citation preview

Page 1: Human APIs, the future of mobile

Human APIsexpanding the mobile web

SWDC - June 3rd 2010

Nikolai Onkenuxebu

Thursday, June 3, 2010

Page 2: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 3: Human APIs, the future of mobile

We open the mobile web.

Thursday, June 3, 2010

Page 4: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 5: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 6: Human APIs, the future of mobile

JavaScript AJAX

CSS

dojoBrowser

OpenSourceWeb2.0

FrontEnd

Usability UserExperience

mobile

TouchScroll

Thursday, June 3, 2010

Page 7: Human APIs, the future of mobile

http://news.bbc.co.uk/2/hi/technology/8552410.stm

Remember Risk?

Thursday, June 3, 2010

Page 8: Human APIs, the future of mobile

http://news.bbc.co.uk/2/hi/technology/8552410.stm

Remember Risk?

Thursday, June 3, 2010

Page 9: Human APIs, the future of mobile

Dec, 20091,802 millions

26.6 %

Thursday, June 3, 2010

Page 10: Human APIs, the future of mobile

The mobile web

Jan. 2008 Mar. 20100

5000000000

10000000000

15000000000

20000000000

AdMob Requests

Thursday, June 3, 2010

Page 11: Human APIs, the future of mobile

The mobile web

Jan. 2008 Mar. 20100

5000000000

10000000000

15000000000

20000000000

AdMob Requests

Thursday, June 3, 2010

Page 12: Human APIs, the future of mobile

The mobile web

Jan. 2008 Mar. 20100

5000000000

10000000000

15000000000

20000000000

AdMob Requests

Thursday, June 3, 2010

Page 13: Human APIs, the future of mobile

The reality

• Internet is growing (fast)

•Mobile is growing (fast)

•Mobile internet is growing (fast!)

Thursday, June 3, 2010

Page 14: Human APIs, the future of mobile

The browser is the central piece

Thursday, June 3, 2010

Page 15: Human APIs, the future of mobile

The browser is the interface to the

internet

Thursday, June 3, 2010

Page 16: Human APIs, the future of mobile

71% of all modern phones have a

browser

Tomi Ahonen

Thursday, June 3, 2010

Page 17: Human APIs, the future of mobile

IPv6

2128

Thursday, June 3, 2010

Page 18: Human APIs, the future of mobile

There will be a lot of things we can talk to :)

(using a browser)

Thursday, June 3, 2010

Page 19: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 20: Human APIs, the future of mobile

Is JavaScript good enough?

Thursday, June 3, 2010

Page 21: Human APIs, the future of mobile

Flash with JavaScript?

Thursday, June 3, 2010

Page 22: Human APIs, the future of mobile

http://github.com/tobeytailor/gordon

Thursday, June 3, 2010

Page 23: Human APIs, the future of mobile

HTML5 Appsor web apps as we know them

Thursday, June 3, 2010

Page 24: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 25: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 26: Human APIs, the future of mobile

New HTML Elements

Thursday, June 3, 2010

Page 27: Human APIs, the future of mobile

<input type="speech" grammar="grammar-nav-en.grxml" onchange="handleSpeechInput">

http://bit.ly/audio-api

Thursday, June 3, 2010

Page 28: Human APIs, the future of mobile

High performance graphics

WebGL

Thursday, June 3, 2010

Page 29: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 30: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 31: Human APIs, the future of mobile

Media

Thursday, June 3, 2010

Page 32: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 33: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 34: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 35: Human APIs, the future of mobile

JavaScript HTTP

Thursday, June 3, 2010

Page 36: Human APIs, the future of mobile

JavaScript HTTP

Accelerometer

Camera

...Thursday, June 3, 2010

Page 37: Human APIs, the future of mobile

JavaScript HTTP

Accelerometer

Camera

...

Bluetooth

RFID

Thursday, June 3, 2010

Page 38: Human APIs, the future of mobile

JavaScript

CSS

HTML

HTTP

Accelerometer

Camera

...

Bluetooth

RFID

Thursday, June 3, 2010

Page 39: Human APIs, the future of mobile

JavaScript

CSS

HTML

HTTP

Accelerometer

Camera

...

Bluetooth

RFID

Thursday, June 3, 2010

Page 40: Human APIs, the future of mobile

The Hype

Thursday, June 3, 2010

Page 41: Human APIs, the future of mobile

o

The Hype

Thursday, June 3, 2010

Page 42: Human APIs, the future of mobile

oThe cloud

The Hype

Thursday, June 3, 2010

Page 43: Human APIs, the future of mobile

oThe cloud Location, etc.

The Hype

Thursday, June 3, 2010

Page 44: Human APIs, the future of mobile

oThe cloud Location, etc.

The Potential

Thursday, June 3, 2010

Page 45: Human APIs, the future of mobile

oThe cloud Location, etc.

Hardware

The Potential

Thursday, June 3, 2010

Page 46: Human APIs, the future of mobile

Use cases

Thursday, June 3, 2010

Page 47: Human APIs, the future of mobile

Transportation

Thursday, June 3, 2010

Page 48: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 49: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 50: Human APIs, the future of mobile

Health

Thursday, June 3, 2010

Page 51: Human APIs, the future of mobile

3311 Health/Fitness Apps in Apple app store

Thursday, June 3, 2010

Page 52: Human APIs, the future of mobile

HumanAPI

Thursday, June 3, 2010

Page 53: Human APIs, the future of mobile

HumanAPI

Thursday, June 3, 2010

Page 54: Human APIs, the future of mobile

Home automation

Thursday, June 3, 2010

Page 55: Human APIs, the future of mobile

http://digitalstrom.org

Thursday, June 3, 2010

Page 56: Human APIs, the future of mobile

http://home-pad.com

Thursday, June 3, 2010

Page 57: Human APIs, the future of mobile

How can we do this?

Thursday, June 3, 2010

Page 58: Human APIs, the future of mobile

Mobile SDKs

Thursday, June 3, 2010

Page 59: Human APIs, the future of mobile

Mobile SDKs

Objective-C

Thursday, June 3, 2010

Page 60: Human APIs, the future of mobile

Mobile SDKs

Objective-C Java

Thursday, June 3, 2010

Page 61: Human APIs, the future of mobile

Mobile SDKs

Objective-C Java ...

Thursday, June 3, 2010

Page 62: Human APIs, the future of mobile

How the magic happens

Thursday, June 3, 2010

Page 63: Human APIs, the future of mobile

Low level APIs

Camera Accelerometer Push Notifications

How the magic happens

Thursday, June 3, 2010

Page 64: Human APIs, the future of mobile

Low level APIs

Camera Accelerometer Push Notifications

Chromeless Browser

How the magic happens

Thursday, June 3, 2010

Page 65: Human APIs, the future of mobile

Low level APIs

Camera Accelerometer Push Notifications

Chromeless Browser

How the magic happens

browser.eval(“alert(1);”)

Thursday, June 3, 2010

Page 66: Human APIs, the future of mobile

PhoneGap

Thursday, June 3, 2010

Page 67: Human APIs, the future of mobile

Low level APIs

Camera Accelerometer Push Notifications...

Chromeless Browser

PhoneGap

browser.eval(“document.geolocation...”)

Android, iPhone, iPad, Nokia S60, BlackberryThursday, June 3, 2010

Page 68: Human APIs, the future of mobile

Low level APIs

Camera Accelerometer Push Notifications...

Chromeless Browser

PhoneGap

browser.eval(“document.geolocation...”)

Android, iPhone, iPad, Nokia S60, BlackberryThursday, June 3, 2010

Page 69: Human APIs, the future of mobile

mAppView.loadUrl("javascript:navigator.compass.setHeading(" + heading + ")");

Android

Thursday, June 3, 2010

Page 70: Human APIs, the future of mobile

jsCallBack = [[NSString alloc] initWithFormat:@"navigator. accelerometer._onAccelUpdate(%f,%f,%f);", acceleration.x, acceleration.y, acceleration.z];

[webView stringByEvaluatingJavaScriptFromString:jsCallBack];

iPhone/iPad

Thursday, June 3, 2010

Page 71: Human APIs, the future of mobile

Example

Thursday, June 3, 2010

Page 72: Human APIs, the future of mobile

Thursday, June 3, 2010

Page 73: Human APIs, the future of mobile

Lowlevel APIs

The browser

For things you can’t do in the browser (yet)

For anything else :)

Thursday, June 3, 2010

Page 74: Human APIs, the future of mobile

Check this out

Thursday, June 3, 2010

Page 75: Human APIs, the future of mobile

Serverside JS

Thursday, June 3, 2010

Page 76: Human APIs, the future of mobile

http://groups.google.com/group/nodejs/browse_thread/thread/ee11c077e5f89f7a?hl=en

$(".living-room").delegate(".motion-sensor", "onmotion", function(){   $(".living-room .lights").css("intensity", 0.75) });

Your house == DOM

Thursday, June 3, 2010

Page 77: Human APIs, the future of mobile

Air Quality in Beijing via Twitter:

https://twitter.com/beijingair

Thursday, June 3, 2010

Page 78: Human APIs, the future of mobile

Challenge

Thursday, June 3, 2010

Page 79: Human APIs, the future of mobile

Raphaël could do this!

Thursday, June 3, 2010

Page 80: Human APIs, the future of mobile

Getting started

•PhoneGap - http://phonegap.com

•http://blog.uxebu.com

•http://www.humanapi.org

Thursday, June 3, 2010

Page 81: Human APIs, the future of mobile

Questions?

@nonken

Thursday, June 3, 2010