Maximiliano's Gearing Up With Google Glass Development

max(imiliano) (@ﬁrt)man
GEARING UP
WITH GOOGLE GLASS
DEVELOPMENT
Zürich,Aug 29th, 2013
¡-‐)
Thursday, August 29, 13

mobile+web developer
maximiliano
@ﬁrt

we’ll talk about glass
1- Experience
2- Glassware
3- Timeline
4- Browser
5- Code!

questions
yes, please
At the end or
during the conference

DISCLAIMER

1- glass experience

quick video( )

Notifications on
your head

Your content is
not so important

specs
nHD transparent
640x360
25" - 2.5m / 8  away

specs
Sensors

specs
Camera

specs
Multi-touch panel

specs
wifi
bluetooth

specs
Android 4.0

specs
bone conduction
transducer

quick demo( )

the experience
- diﬀerent device
- not transparent apps
- limited AR

2- glassware

native
vs
web

today =
cloud

today =
cloud
Mirror API

tomorrow =
native
vs
cloud

tomorrow =
native GDK
vs
cloud Mirror API

httpscontent

httpscontent
actions

https
http(s)
content
actions

glassware

glassware
- today vs tomorrow
- Mirror API
- GDK
- create a new architecture

3- timeline

timeline
past, now, future

timeline
timeline items = card

timeline
card

timeline
standard card
pinned card
system card past
past
future

it's probable that the
user will never see our
card
(
)

timeline
content type

timeline
textcontent type

timeline
image
video
content type

timeline
htmlcontent type

timeline
card actions = menu items

timeline
menu items 101
1 or 2 words & icon
no arguments
system vs custom

How can I listen to
actions?

http(s)actions

How to reply?

timeline
contextual events
geolocation

timeline
contextual events
geolocation
share

timeline
contextual events
geolocation
share
launch "ok glass" menu

timeline
Invocation voice commands
take a note
post an update

timeline
- card is the king
- menu items <> endpoint
- contextual events
- server-side intelligence

4- the browser

browser
invocation
google search
card's action

browser
interaction
scroll
point and click

browser
responsive web design
mobile user agent
width: 427px
pixel ratio: 1.5

browser
html5
video, audio
devicemotion
scroll and touch events
no geo, speech, camera yet

browser
- better than it looks like
- experimental
- new ideas will come
- card + html5

5- code!

code!
Mirror API
OAuth 2.0
RESTful services
JSON

code!
1- Use HTTP
2- Use oﬃcial APIs

new card
POST /mirror/v1/timeline HTTP/1.1
Host: www.googleapis.com
Authorization: Bearer {auth token}
Content-Type: application/json
Content-Length: 26
{ "text": "Hello world" }
HTTP
code!

new card
$card = new Google_TimelineItem();
$card->setText("Hello World");
$parameters = array();
$service->timeline
->insert($card, $parameters);
PHP
code!

new card
{
"kind": "glass#timelineItem",
"id": "1234567890",
"created": "2012-09-25",
"updated": "2012-09-25",
"text": "Hello world"
}
(just an example)
code!

html!
{
"html": "<h1>Hello world<h1>
<p>Sorry, no marquee support</p>
"
}
JSON
code!

code!
static content
all semantic containers
tables, lists
custom css
no <script> <link> <iframe>
html5 on cards

map images
{
"html": "<h1>Your wife's location<h1>
<img src='glass://map?
w=240&h=360&marker=0;42.369590,-71.107132&m
arker=1;42.36254,-71.08726 height=360
width=240>"
}
JSON
code!

menu items
{ "text": "Hello world",
"menuItems": [
{
"action": "REPLY"
}
]
}
JSON
code!

code!
built-in menu items

code!
built-in menu items
share

code!
built-in menu items
share
navigate to

code!
built-in menu items
share
navigate to
read aloud

code!
built-in menu items
share
navigate to
read aloud
delete

code!
built-in menu items
share
navigate to
read aloud
delete
voice call

code!
built-in menu items
share
navigate to
read aloud
delete
voice call
reply

code!
built-in menu items
share
navigate to
read aloud
delete
voice call
reply
toggle pin

code!
built-in menu items
share
navigate to
read aloud
delete
voice call
reply
toggle pin
view website

voice call
reply
toggle pin
view website
code!
built-in menu items
share
navigate to
read aloud
deleteYOU CAN CHANGE TITLE AND ICON

code!
bundles
Multi-page card
Diﬀerent cards over time

I don't have a Glass!!!

Don't steal one

Playground (oﬃcial)

Glasssim.com

Xenologer for Android
Mirror API Emulator by Scarygami

At the end, you will need one
google.com/glass

code!
- mirror API: HTTP & JSON
- cards, menu items
- experimental emulation

6- what's next

what's next
- GDK
- Localization
- More Invocation Voice commands
For Glass

what's next
- developers.google.com/glass
- youtube.com/user/GoogleDevelopers
For You

wrapping up

glass
- understand the experience
- mirror api vs gdk vs browser
- Glassware cloud-based
- it's just the beginning

you can reach a good
experience
Pictures)from)freedigitalphotos.net)
Thanks!
firtman@gmail.com
@firt
firt.mobi/pmw
¡-‐)
Ask me for 50% oﬀ

Maximiliano's Gearing Up With Google Glass Development

Recommandé

Recommandé

Contenu connexe

En vedette

En vedette (18)

Similaire à Maximiliano's Gearing Up With Google Glass Development

Similaire à Maximiliano's Gearing Up With Google Glass Development (17)

Plus de Maximiliano Firtman

Plus de Maximiliano Firtman (20)

Dernier

Dernier (20)

Maximiliano's Gearing Up With Google Glass Development