Human APIs

Human APIs
expanding the mobile web
RiaWorld 2010
Nikolai Onken
uxebu
Wednesday, November 17, 2010

@nonken

We open the mobile web.

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

The Plan
• A little bit of history
• Lets build a mobile app

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

Dec, 2009
1,802 millions
26.6 %

The mobile web
Jan. 2008 Mar. 2010
0
5000000000
10000000000
15000000000
20000000000
AdMob Requests

The reality
•Internet is growing (fast)
•Mobile is growing (fast)
•Mobile internet is growing (fast!)

The browser is the
central piece

The browser is the
interface to the
internet

71% of all modern
phones have a
browser
Tomi Ahonen

IPv6
2128

There will be a lot of
things we should talk to :)
(using a browser)

Is JavaScript good
enough?

Flash with
JavaScript?

http://github.com/tobeytailor/gordon

HTML5 Apps
or web apps as we know them

New HTML Elements

<input type="speech" grammar="grammar-nav-en.grxml" onchange="handleSpeechInput">
http://bit.ly/audio-api

High performance
graphics
WebGL

Media

What more do we need?

JavaScript HTTP

JavaScript HTTP
Accelerometer
Camera
...

JavaScript HTTP
Accelerometer
Camera
...
Bluetooth
RFID

JavaScript
CSS
HTML
HTTP
Accelerometer
Camera
...
Bluetooth
RFID

The Hype

o
The Hype

o
The cloud
The Hype

o
The cloud Location, etc.
The Hype

o
The Potential

o
Hardware
The Potential

Use cases

Transportation

Home automation

http://digitalstrom.org

http://home-pad.com

Health

3311 Health/Fitness
Apps in Apple app store

HumanAPI

How can we do this?

Mobile SDKs

Mobile SDKs
Objective-C

Mobile SDKs
Objective-C Java

Mobile SDKs
Objective-C Java ...

How the magic happens

Low level APIs
Camera Accelerometer Push Notiﬁcations

Low level APIs
Chromeless Browser

Low level APIs
Chromeless Browser
browserInstance.eval(“alert(1);”)

PhoneGap

Low level APIs
Camera Accelerometer Push Notiﬁcations...
Chromeless Browser
PhoneGap
browser.eval(“document.geolocation...”)
Android, iPhone, iPad, Nokia S60, Blackberry

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

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

Lowlevel APIs
The browser
For things you can’t do in the browser (yet)
For anything else :)

Enough talking, lets
see some hardware

ArduinoJS

ArduinoJS Stack
• Arduino (http://arduino.cc/)
• Node-Serial (Chris Williams)
• Node
• Websockets (Socket.io)
http://github.com/nonken/arduinojs

Node
ArduinoJS
Websockets
Arduino
Browser
Serial connection
Light Motors Robots
OneAPItorulethemall

available APIs
• digitalWrite(pin, val)
• digitalRead(pin, val)
• analogWrite(pin, val)
• analogRead(pin, val)
http://github.com/nonken/arduinojs

Try it out
• 10.0.2.1:8888

Only the beginning

Serverside JS

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

Raphaël can do this!

Getting started
•ArduinoJS - http://github.com/nonken/arduinojs
•PhoneGap - http://phonegap.com
•http://blog.uxebu.com
•http://www.humanapi.org

Thank you
@nonken

Human APIs

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie Human APIs

Ähnlich wie Human APIs (20)

Mehr von Nikolai Onken

Mehr von Nikolai Onken (14)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Human APIs