Transitioning from android to glass

GGDevCon
Luis de la Rosa

Luis de la rosa


Lead App Developer

Capital One

Download latest slides and code at:

http://luisdelarosa.com/glass

my background


Java since beta

Explorer since Nov 2013

EclipseCon

DevIgnition, WearablesDevCon, AnDevCon

Android+Glass

overview


Design

Architecture

Implementation

web -> phone

Bring over whole thing

Create subset of UI

Surface functionality via APIs (web services)

Design for smaller screen

Phone -> tablet


Scale it up

Utilize additional space better

phone -> glass


???

Profit

android




Glass

android vs glass: fight!


Display

Battery

Touch

glanceable ui


Fundamentally different from phone and tablet UI

Less content

Quicker

Bigger

Now

glass vs wear: UI

Head vs Wrist

Private vs Semi-private

Back
swipe down vs swipe right

Speaker vs Vibration

Camera

terminology


Glassware
XE
MyGlass
GDK
Mirror API
Static Card
Live Card
Immersion
Tuggable

gdk is in preview


Be prepared for change

Glass is auto-updated

Less need for backwards compatibility

glass history


XE 4 - April 2014: Glass hardware debut

(XE 10-11) - November 2014: GDK Sneak Peek (4.0.3)

XE 12 - December 2013: Static Cards, LiveCard publishing



glass history part 2


Glass hardware 2.0 - December 2013

XE 16 - April 2014: GDK Preview (4.4.3),
Breaking changes in Card,
removal of Static Cards, LiveCard, stricter Voice Triggers

XE 21 - September 2014: CardBuilder, Studio native

XE 22 - October 2014: Notification Sync

GDK vs android sdk


7 new packages

15 new classes

No emulator

Activities + Services play special roles

Gdk vs wear sdk

Currently separate but both target wearables

Data Layer API
https://code.google.com/p/google-glass-api/issues/detail?id=395

Standalone vs paired with device

synergy

“The API surface of GDK Glassware is not limited to the classes contained in the GDK Add-on. The GDK Add-on merely closes the gaps between the Android SDK and features that are unique to Glass. This means, in general, given a problem that isn't covered by the GDK library directly, just attempt the Android solution.”
- Jenny Murphy
Staff Developer Programs Engineer on Google Glass
on Stack Overflow

timeline









Immersions exist outside

home card


Voice Launcher

Tap Launcher

Contrast with Home Screen

ongoing task pattern


Start a task

Have it run for a long time

Still visible in timeline

Implemented via Live Cards

cards


Like Google Now

Horizontal rather than vertical

Main UI metaphor for Glass

640x360

menus


Viewed as another level of Cards

Keep wording short

Icon: 50x50

Important: Must have Stop menu item in LiveCard menu

use the templates

layouts


Main
560px wide with 40px margin
240px tall main area
40px tall footer area

Left
240px wide left area
400px wide right area with 40x margin

glass theme


Roboto

White on black

Color sparingly

No action bar or status bar

Implemented via: No theme

images required


White on transparent

Logo Icon
150x150, 80x80, 50x50, 40x40, 30x30, 20x20

Menu Icon
50x50

Tile Icon
640x360 (can be colorful)

static cards


No longer in GDK as of XE 16

Use Mirror API

notification sync


New in XE 22

Backgrounds fit with Glass theme

Can not pair both Glass and Wear at same time

Some overlap with Glassware

any questions so far?

developer setup


Android Studio

SDK 4.4.2 + Glass Development Kit Preview

Turn on USB debugging in Settings > Device Info

Authorize computer on Glass
after connecting via USB

Gdk setup

importing sample code


Clone

Import project by selecting build.gradle

android studio tidbits


Edit configuration to not Launch Activity

Tools > Android > Sync Project with Gradle Files

build.gradle should have
compileSdkVersion "Google Inc.:Glass Development Kit Preview:19" 

Title

Hello android world


Activity

TextView

hello glass world


https://github.com/luisdelarosa/HelloGlass

Immersion

Voice Trigger

Theme

Glass Library

voice trigger


Different from standard MAIN/LAUNCHER intent filter

Custom needs permission
 <uses-permission android:name="com.google.android.glass.permission.DEVELOPMENT"/>

Standard ones
VoiceTriggers.Command

LIVE CARDS


Constantly updated to stay fresh

Difference in update intervals: low vs high frequency

LOW-FREQUENCY LIVE CARDS


Greater than a few seconds between updates

Use RemoteViews

Must call setViews to update

HIGH-FREQUENCY LIVE CARDS


Near real-time updating

Surface

Callbacks

SERVICES + LIVE CARDS


Integral

Handles lifecycle

MENUS IN LIVE CARDS


PendingIntent as Action

Activity hosts menu items

Gotchas:
- Register the Activity in AndroidManifest.xml
- onAttachedToWindow
- Transparency via style
- Must have at least Stop menu item

LIVE CARD LIFECYCLE


Service starts via Voice Trigger
onStartCommand() {    liveCardInstance = new LiveCard(context, LIVE_CARD_TAG);    liveCardInstance.setAction(menuActivityPendingIntent);    // set up UI for LiveCard and then...
    liveCardInstance.publish(SILENT or REVEAL);    return START_STICKY;}

Service stops via stopService from menu item
onDestroy() {    liveCardInstance.unpublish();}

PROJECT: STACKOVERFLOW PROFILE


Useful to see inbox and also track score

Stack Overflow rep changes relatively infrequently

Lots of data

ANDROID VERSION


Lot of room

Can show most of the data

Many tap targets

ALTERNATIVE ANDROID VERSION


Home screen widget

RemoteViews

App Widgets

Cousin to Live Card

GLASS VERSION


Simplified

Glanceable

Low frequency Live Card

Menu for actions

TOURING THE GDK EXAMPLES


Compass

Stopwatch

Timer

Questions?

immersions


Repurposed Activity

Full control over Glass hardware

Exist outside of Timeline

Be careful of Glassing-out

project: reddit viewer


List the posts in a subreddit

Common list-based app UI

android version


Activity

Vertical scrolling

Row-based

ListView


glass version


Immersion

Horizontal scrolling / paging of cards

CardScrollAdapter

CardScrollView

https://github.com/luisdelarosa/RedditViewerGlass

alternate android version


Horizontal scrolling / paging

Fragment-based

ViewPager

menus in immersions


Show when tapped

openOptionsMenu()  

Ordinary Android menu methods

onCreateOptionsMenu()
onOptionsItemSelected()
onOptionsMenuClosed() 

cardbuilder

Factory for cards that conform to templates

Layouts:
- TEXT and TEXT_FIXED
- COLUMNS and COLUMNS_FIXED
- CAPTION
- AUTHOR
- MENU
- ALERT

custom layouts


Can still use regular XML layouts

gdk api demo


https://github.com/googleglass/gdk-apidemo-sample

Demonstrates:
CardBuilder
CardScrollView
Contextual Voice Commands
OpenGL
Custom Layouts

touch


Default: D-Pad events

Timeline consumes some for non-Immersions

Swipe down is like Back button

Two finger swipe down is sleep


more touch


GestureDetector

Swipe up/down/left/right + TwoSwipe
Tap / TwoTap / ThreeTap
LongPress / TwoLongPress / ThreeLongPress

Finger count change

Scroll listener
Two finger scroll listener

voice control


Voice Trigger

Voice Prompt

Speech Recognizer

contextual voice menus


aka "ok glass"

WindowUtils.FEATURE_VOICE_COMMANDS

ex: VoiceMenuActivity

getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); 

ContextualMenus.Command enum

head movement

Unique way to get user input

Not eye tracking

Accelerometer

Unknown ergonomic impact

Built-in Glass gestures

getWindow().addFlags(WindowUtils.FLAG_DISABLE_HEAD_GESTURES); 

location


No Google Play Services yet

Old school Location

Iterate over all providers, including remote (tethered)

sensors


Accelerometer

Gyroscope

Magnetometer

Relative to "optics pod" aka prism

Light

camera


Capture image:
Intent intent = new Intent(MediaStore.ACTION_IMAGE_CAPTURE);
startActivityForResult(intent, MY_REQUEST_ID); 
Capture video:
Intent intent = new Intent(MediaStore.ACTION_VIDEO_CAPTURE);
startActivityForResult(intent, MY_REQUEST_ID); 
Can capture hardware button in Immersion
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
    if (keyCode == KeyEvent.KEYCODE_CAMERA) {

battery


Video

Sensors

navigation

Driving
Intent intent = new Intent(android.content.Intent.ACTION_VIEW,   Uri.parse("google.navigation:q=your+address"));
startActivity(intent); 
Walking
Intent intent = new Intent(android.content.Intent.ACTION_VIEW,  Uri.parse("google.navigation:q=your+address&mode=w"));
startActivity(intent); 

show settings


startActivity(new Intent(Settings.ACTION_SOUND_SETTINGS)); 

ACTION_WIFI_SETTINGS
ACTION_BLUETOOTH_SETTINGS
ACTION_SOUND_SETTINGS

authentication


QR code

AccountManager

Official flow available after upload to MyGlass

open source libraries


glass-progress-bar

GlassSettings

glass-head-gesture-detector

next steps

https://developers.google.com/glass/community
https://github.com/googleglass

Tag [google-gdk] on Stack Overflow

File Bugs / Feature requests

Join local Glass meetups

Please give feedback via the app or via paper

any last questions?


Thanks!


Luis de la Rosa
@louielouie

Made with Slides.com