The Glass Class: Lecture 6 – Interface Guidelines

Feb 17th – 21st 2014

Mark Billinghurst, Gun Lee HIT Lab NZ

University of Canterbury

THE GLASS CLASS

Glass Philosophy

THE GLASS CLASS

"Computing should just be more comfortable"

"Google should do the hard work, and you should have a chance to live, have a good life, and get on with it."

THE GLASS CLASS

As technology becomes more personal and immediate, it can start to disappear.

Distant Intimate

THE GLASS CLASS

Last year Last week Now Forever

The Now machine Focus on location, contextual and timely information, and communication.

Interface Guidelines

THE GLASS CLASS

The Timeline

  Controls most of the User Experience   Standard way to present static/live cards   System wide voice commands  Way to launch Glassware applications

THE GLASS CLASS

Types of Cards   Static Cards

  Text, HTML, images, video

  Live Cards   Important now, rendered at high frequency   Access to low level sensor data, run in timeline

  Immersion   Android activities taking over timeline

THE GLASS CLASS

Static Cards

THE GLASS CLASS

Special Properties (Mirror API)   Paginated

  Spread across several cards, Read more

  Bundled  Group together similar content

THE GLASS CLASS

Live Cards

  Access to low level sensor data   Don’t remain on timeline

THE GLASS CLASS

Immersions

  Take over user experience

THE GLASS CLASS

When to Use   Static

  Periodic notifications

  Live Cards  Ongoing tasks that user jumps in and out of

  Immersions  Need full control over user experience

THE GLASS CLASS

Menus

  Way to invoke actions on a card   Tap card to show menu

THE GLASS CLASS

Input   Voice

 Main, Contextual, Free form

  Touch Gestures   Tap, swipe left/right

  Head Gestures  Head tracking, look-up, nudge

THE GLASS CLASS

UX Design Patterns   Types of UX Patterns

  Periodic notifications  Ongoing task   Immersion

THE GLASS CLASS

Static - Periodic Notifications

THE GLASS CLASS

Some time later..

THE GLASS CLASS

Live Card - Ongoing Task

  Long-running cards that users come back to

THE GLASS CLASS

Eg Strava

  Inserts live card for current run

THE GLASS CLASS

Immersion – take over timeline

Style Guidelines

THE GLASS CLASS

Style – Card Regions

THE GLASS CLASS

Example Layouts

THE GLASS CLASS

Icons

THE GLASS CLASS

Typography - Roboto

THE GLASS CLASS

Text Resizing

THE GLASS CLASS

Colour

THE GLASS CLASS

Best Practices   Don’t use pinned timeline item as launcher   Follow standard card design   Don’t use Mirror API for immediate interactivity   Follow standard menu design   Create content appropriately   Bundle and paginate appropriately

THE GLASS CLASS

Lessons Learned from Using Glass

THE GLASS CLASS

Transparent  displays  are  tricky  

 Colors  are  funny  and  inconsistent.    You  can  only  add  light  to  a  scene,  not  cover  anything  up.  

 Mo;on  can  be  disorien;ng.  Clarity,  contrast,  brightness,  visual  field  and  a>en;on  are  important.  

THE GLASS CLASS

THE GLASS CLASS

Reading  Some  things  don’t  work  

THE GLASS CLASS ImmersionSome  things  don’t  work  

THE GLASS CLASS DetailsSome  things  don’t  work  

THE GLASS CLASS

The  world  is  the  experience  

Get  the  interface  and  interac;ons  out  of  the  way.  

THE GLASS CLASS

THE GLASS CLASS

Micro  Interac;ons  

The  posi;on  of  the  display  and  limited  input  ability  makes  longer  interac;ons  less  comfortable.  

Using  it  shouldn’t  take  longer  than  taking  out  your  phone.  

THE GLASS CLASS

THE GLASS CLASS

It's  like  a  rear  view  mirror    

Don't  overload  the  user.  S;ck  to  the  absolutely  essen;al,  avoid  long  

interac;ons.  Be  explicit.      

THE GLASS CLASS

THE GLASS CLASS

As personal as it gets Glass  is  the  most  personal  device  you  own.  It  should  recognize and adapt to you… not the other way around.

THE GLASS CLASS

For  the  closest  people  and  most  important  moments    Glass  should  be  for  priori;zing  your  closest  people  and  crea;ng  value  for  the  whole  group,  not  just  the  wearer.          

THE GLASS CLASS

Our tools are becoming more intimate and immediate. We can craft a future of learning, creative expression and empathy.

Distant Intimate