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

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (18)

Similar to Maximiliano's Gearing Up With Google Glass Development

Similar to Maximiliano's Gearing Up With Google Glass Development (15)

More from Maximiliano Firtman

More from Maximiliano Firtman (20)

Recently uploaded

Recently uploaded (20)

Maximiliano's Gearing Up With Google Glass Development