Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Micro	
  interac+ons	
  and	
  Mul+	
  dimensional	
  
Graphical	
  User	
  Interfaces	
  in	
  the	
  Design	
  of	
  
Wr...
2	
  
Advantages	
  
•  Mount	
  locaEon	
  
•  ConEnuous	
  skin	
  contact	
  
•  One	
  hand	
  interacEon	
  
[Rawassizadeh,...
Wrist	
  Worn	
  Devices	
  
•  Popular	
  
•  ConvenEonal	
  locaEon	
  
•  accessible	
  
•  Blend	
  in	
  to	
  users’...
5	
  
Wearable	
  InteracEon	
  
•  Design	
  challenges	
  
•  Limited	
  resources	
  
•  Users	
  in	
  dynamic	
  contexts	
...
Resources	
  
•  ConnecEvity	
  
•  Power	
  
•  InteracEve	
  Surfaces	
  
•  Sensors	
  &	
  Actuators	
  
•  Display	
 ...
Challenges	
  
‘Small	
   screen	
   size	
   results	
   in	
   restricted	
   I/O	
   and	
  
their	
   small	
   hardwa...
Dynamic	
  Contexts	
  
•  SituaEonal	
  Impairments	
  
•  Transient	
  Requirements	
  
•  Dynamic	
  Constraints	
  
9	...
Lack	
  of	
  Support	
  
•  Guidelines	
  
•  HeurisEcs	
  
•  User	
  centered	
  design	
  methods	
  
•  EvaluaEon	
  ...
ParadigmaEc	
  Shi_s	
  
•  Gesture	
  based	
  interacEon	
  
•  VibrotacEle	
  output	
  responses	
  
•  MulEmodaliEes	...
Wearable	
  CompuEng	
  
•  Faced	
  significant	
  improvements	
  in	
  past	
  
decades	
  
•  Power,	
  form	
  factors...
MoEvaEon	
  
‘The	
  screen	
  restricEon	
  requires	
  fresh	
  thinking	
  on	
  
user	
  interface	
  (UI)	
  designs	...
Approach	
  
•  Empirical	
  analysis	
  of	
  wearable	
  interacEon	
  
•  IdenEficaEon	
  and	
  definiEon	
  of	
  inter...
Related	
  Work	
  
•  Industrial	
  guidelines	
  
•  ScienEfic	
  research:	
  focused	
  
•  One	
  interacEon	
  modali...
Design	
  Guidelines	
  
•  Industry	
  
•  Generic:	
  suit	
  different	
  applicaEons	
  
•  Company-­‐oriented	
  
•  A...
Gesture-­‐Based	
  Interac+on	
  
[Bernaerts	
  et	
  al.	
  2014.	
  The	
  office	
  smartwatch:	
  development	
  and	
  ...
Cross-­‐Device	
  Interac+on	
  
[Houben,	
  S.,	
  Brudy,	
  F.,	
  and	
  Marquardt,	
  N.	
  2015.	
  Challenges	
  in	...
EdgeTouch	
  
[Oakley,	
  I.	
  and	
  Lee,	
  D.	
  InteracEon	
  on	
  the	
  Edge:	
  Offset	
  Sensing	
  for	
  Small	...
Shimmering	
  SmartWatches	
  
[Xu,	
  C.,	
  Lyons,	
  K.,	
  and	
  Ave,	
  F.	
  Shimmering	
  Smartwatches	
  :	
  Exp...
WatchIt	
  
•  Gestures	
  
•  Hands	
  free	
  interacEon	
  
[Simon	
  T.	
  Perrault,	
  Eric	
  Lecolinet,	
  James	
 ...
Drawbacks	
  
•  Small	
  interacEve	
  surfaces	
  
•  Fat	
  fingers	
  
•  Incidental	
  input	
  
•  Midas	
  gestures	...
23	
  
Drawbacks	
  
•  Small	
  interacEve	
  surfaces	
  
•  Fat	
  fingers	
  
•  Incidental	
  input	
  
•  Midas	
  gestures	...
Wearable	
  User	
  
•  Moving	
  
•  MulEtasking	
  
•  Unplanned	
  InteracEon	
  
•  One	
  hand	
  
•  Short	
  Eme	
 ...
Context	
  
•  Sitng,	
  standing,	
  walking	
  
•  Driving,	
  Working,	
  Running	
  
•  Watching	
  TV,	
  EaEng	
  
•...
27	
  
Vision	
  
•  Design	
  interacEon	
  to	
  maximize	
  
the	
  device	
  strengths	
  and	
  
minimize	
  its	
  drawback...
Novel	
  InteracEon	
  Paradigms	
  
•  Requirements	
  
•  Generic	
  to	
  suit	
  different	
  use	
  case	
  scenarios	...
Wrist	
  worn	
  InteracEon	
  
Paradigms	
  
•  Micro	
  Interac+ons	
  
•  IntuiEve,	
  efficient,	
  energy-­‐efficient	
  ...
Micro	
  InteracEons	
  
•  Limited	
  to	
  
•  Short	
  duraEon:	
  <	
  4	
  seconds	
  
•  One	
  subtask	
  at	
  a	
...
32	
  
Micro	
  InteracEons	
  
•  InteracEons	
  with	
  a	
  device	
  that	
  take	
  less	
  than	
  
four	
  seconds	
  to	
...
Examples	
  
Modality	
   Type	
  
Audio	
   Beeps	
  
Gestures	
  
1D	
  
2D	
  
3D	
  
	
  
Tap,	
  touch,	
  hold,	
  p...
UI	
  CharacterisEcs	
  
•  Glanceable	
  
•  Relevant	
  
•  Explicit	
  
•  EssenEal	
  
•  Simple	
  
35	
  
UI	
  RecommendaEons	
  
•  Text	
  content:	
  very	
  brief	
  
•  Display	
  content	
  or	
  navigaEon	
  
•  Just	
  ...
MulEdimensional	
  User	
  
Interfaces	
  	
  
•  Virtual	
  extensions	
  for	
  a	
  graphic	
  UI	
  
•  Linear	
  navi...
38	
  
SpaEal	
  Display	
  Metaphor	
  
[Am_,	
  Oliver,	
  and	
  Paul	
  Lukowicz.	
  "From	
  backpacks	
  to	
  smartphones:...
Facet	
  
[Lyons,	
  K.,	
  Nguyen,	
  D.,	
  Ashbrook,	
  D.,	
  and	
  White,	
  S.	
  Facet:	
  A	
  MulE-­‐Segment	
  ...
Peeble	
  -­‐	
  Timeline	
  
41	
  
Usability	
  vs.	
  AestheEcs	
  
IntenEon	
  to	
  use	
  on-­‐body	
  products	
  will	
  be	
  greater	
  
if	
  good	
...
InteracEvity	
  
How	
  the	
  product	
  informs	
  the	
  user	
  about	
  its	
  
usage	
  and	
  how	
  the	
  user	
 ...
Conclusion	
  
•  Micro	
  interacEons	
  and	
  mulE	
  dimensional	
  
interfaces	
  fulfill	
  major	
  requirements	
  ...
Acknowledgment	
  
This	
  material	
  is	
  based	
  upon	
  work	
  supported	
  by	
  
the	
  NaEonal	
  Science	
  Fou...
Q&A	
  
46	
  
References	
  
•  Lyons,	
  K.,	
  and	
  Profita,	
  H.,	
  (2014).	
  The	
  MulEple	
  DisposiEons	
  of	
  On-­‐Body	
 ...
Upcoming SlideShare
Loading in …5
×

Micro interactions and multi dimensional graphical user interfaces in the design of wrist worn wearables

446 views

Published on

Wearables have a large potential to support diverse applications. However designing their interfaces is challenging. Limited resources, dynamic constraints and situational impairments add more challenges to the UI design for wearable devices. To support stakeholders in this activity, in this presentation we discuss two design paradigms for wrist worn devices: micro interactions and multi dimensional UIs. Slides presented at the HFES Annual Meeting in 2015.

Published in: Technology
  • Be the first to comment

Micro interactions and multi dimensional graphical user interfaces in the design of wrist worn wearables

  1. 1. Micro  interac+ons  and  Mul+  dimensional   Graphical  User  Interfaces  in  the  Design  of   Wrist  Worn  Wearables   Prof.  Vivian  Genaro  Mo?   Prof.  Kelly  Caine   Clemson  University   Los  Angeles  CA,  October  29th,  2015   Human  Centered  CompuEng  Division     School  of  CompuEng    
  2. 2. 2  
  3. 3. Advantages   •  Mount  locaEon   •  ConEnuous  skin  contact   •  One  hand  interacEon   [Rawassizadeh,  R.,  Price,  B.  a.,  and  Petre,  M.  Wearables:  Has  the  Age  of  Smartwatches   Finally  Arrived?  CommunicaEons  of  the  ACM  58,  1  (2014),  45–47.]   3  
  4. 4. Wrist  Worn  Devices   •  Popular   •  ConvenEonal  locaEon   •  accessible   •  Blend  in  to  users’  ouits   4  
  5. 5. 5  
  6. 6. Wearable  InteracEon   •  Design  challenges   •  Limited  resources   •  Users  in  dynamic  contexts   •  Lack  of  support   •  ParadigmaEc  shi_s   6  
  7. 7. Resources   •  ConnecEvity   •  Power   •  InteracEve  Surfaces   •  Sensors  &  Actuators   •  Display   7  
  8. 8. Challenges   ‘Small   screen   size   results   in   restricted   I/O   and   their   small   hardware   results   in   weaker   compuEng   capability   and   especially   limited   bacery  capacity  in  comparison  larger  devices’   [Rawassizadeh,  R.,  Price,  B.  a.,  and  Petre,  M.  Wearables:  Has  the  Age  of  Smartwatches   Finally  Arrived?  CommunicaEons  of  the  ACM  58,  1  (2014),  45–47.]   8  
  9. 9. Dynamic  Contexts   •  SituaEonal  Impairments   •  Transient  Requirements   •  Dynamic  Constraints   9  
  10. 10. Lack  of  Support   •  Guidelines   •  HeurisEcs   •  User  centered  design  methods   •  EvaluaEon  techniques  and  tools   10  
  11. 11. ParadigmaEc  Shi_s   •  Gesture  based  interacEon   •  VibrotacEle  output  responses   •  MulEmodaliEes   •  Augmented  reality   11  
  12. 12. Wearable  CompuEng   •  Faced  significant  improvements  in  past   decades   •  Power,  form  factors,  connecEvity   •  InteracEon  design  is  sEll  challenging   •  New  interacEon  paradigms  are  needed   12  
  13. 13. MoEvaEon   ‘The  screen  restricEon  requires  fresh  thinking  on   user  interface  (UI)  designs  and  new  interac+on   techniques’   [Rawassizadeh,  R.,  Price,  B.  a.,  and  Petre,  M.  Wearables:  Has  the  Age  of  Smartwatches   Finally  Arrived?  CommunicaEons  of  the  ACM  58,  1  (2014),  45–47.]   13  
  14. 14. Approach   •  Empirical  analysis  of  wearable  interacEon   •  IdenEficaEon  and  definiEon  of  interacEon   paradigms  for  wearable  computers   •  Wrist  worn  devices   •  Cross-­‐validaEon   14  
  15. 15. Related  Work   •  Industrial  guidelines   •  ScienEfic  research:  focused   •  One  interacEon  modality   •  Either  input  or  output   15  
  16. 16. Design  Guidelines   •  Industry   •  Generic:  suit  different  applicaEons   •  Company-­‐oriented   •  Academia   •  Specific:  modality,  I/O,  form  factor,  use  case   scenario,  user  populaEon   16  
  17. 17. Gesture-­‐Based  Interac+on   [Bernaerts  et  al.  2014.  The  office  smartwatch:  development  and  design  of  a  smartwatch   app  to  digitally  augment  interacEons  in  an  office  environment.  In  DIS'14.  ACM,  New  York,   NY,  USA,  41-­‐44.]   17  
  18. 18. Cross-­‐Device  Interac+on   [Houben,  S.,  Brudy,  F.,  and  Marquardt,  N.  2015.  Challenges  in  Watch-­‐Centric  Cross-­‐Device   ApplicaEons.  Mobile  Co-­‐Located  InteracEons  Workshop.  CHI’2015.  1–4.]   18  
  19. 19. EdgeTouch   [Oakley,  I.  and  Lee,  D.  InteracEon  on  the  Edge:  Offset  Sensing  for  Small  Devices.  CHI  ’14,   (2014),  169–178.]   19  
  20. 20. Shimmering  SmartWatches   [Xu,  C.,  Lyons,  K.,  and  Ave,  F.  Shimmering  Smartwatches  :  Exploring  the  Smartwatch  Design   Space.  TEI,  (2015).]   20  
  21. 21. WatchIt   •  Gestures   •  Hands  free  interacEon   [Simon  T.  Perrault,  Eric  Lecolinet,  James  Eagan,  and  Yves  Guiard.  2013.  Watchit:  simple   gestures  and  eyes-­‐free  interacEon  for  wristwatches  and  bracelets.  In  CHI  '13.  ACM,  New  York,   NY,  USA,  1451-­‐1460.  DOI=10.1145/2470654.2466192]   21  
  22. 22. Drawbacks   •  Small  interacEve  surfaces   •  Fat  fingers   •  Incidental  input   •  Midas  gestures   •  Change  the  wrist  posiEon   •  Interrupts  main  task   22  
  23. 23. 23  
  24. 24. Drawbacks   •  Small  interacEve  surfaces   •  Fat  fingers   •  Incidental  input   •  Midas  gestures   •  Change  the  wrist  posiEon   •  Interrupts  main  task   24  
  25. 25. Wearable  User   •  Moving   •  MulEtasking   •  Unplanned  InteracEon   •  One  hand   •  Short  Eme   •  Outdoor  and  indoor   25  
  26. 26. Context   •  Sitng,  standing,  walking   •  Driving,  Working,  Running   •  Watching  TV,  EaEng   •  Sleeping   26  
  27. 27. 27  
  28. 28. Vision   •  Design  interacEon  to  maximize   the  device  strengths  and   minimize  its  drawbacks   28  
  29. 29. Novel  InteracEon  Paradigms   •  Requirements   •  Generic  to  suit  different  use  case  scenarios   •  User-­‐centric  soluEon   •  Quick,  dynamic  interacEon   •  IntuiEve   •  MulEmodal   •  Context-­‐sensiEve   •  Energy-­‐efficient   29  
  30. 30. Wrist  worn  InteracEon   Paradigms   •  Micro  Interac+ons   •  IntuiEve,  efficient,  energy-­‐efficient   •  Mul+dimensional  User  Interfaces   •  Overcome  display  limitaEons  in  graphic  user   interfaces   30  
  31. 31. Micro  InteracEons   •  Limited  to   •  Short  duraEon:  <  4  seconds   •  One  subtask  at  a  Eme   •  Either  display  content  or  provide  navigaEon  features   •  In  graphic  user  interfaces   •  For  both  input  and  output   31  
  32. 32. 32  
  33. 33. Micro  InteracEons   •  InteracEons  with  a  device  that  take  less  than   four  seconds  to  iniEate  and  complete   •  Enable  users  to  safely  split  their  acenEon  span   between  a  wearable  display  and  the  real  world   •  non-­‐main  task  interacEons   •  performed  on  the  go     •  without  distracEon  from  the  main  task   [Ivan  Golod,  Felix  Heidrich,  ChrisEan  Möllering,  and  MarEna  Ziefle.  2013.  Design  principles  of   hand  gesture  interfaces  for  microinteracEons.  In  DPPI  '13.  ACM,  New  York,  NY,  USA,  11-­‐20.]  33  
  34. 34. Examples   Modality   Type   Audio   Beeps   Gestures   1D   2D   3D     Tap,  touch,  hold,  press,  release   Slide,  pinch,  scroll   Move,  act   Graphics   Blink,  light,  display   Tac+le   Drag,  slide,  touch,  press   Vibra+on   Buzz   34  
  35. 35. UI  CharacterisEcs   •  Glanceable   •  Relevant   •  Explicit   •  EssenEal   •  Simple   35  
  36. 36. UI  RecommendaEons   •  Text  content:  very  brief   •  Display  content  or  navigaEon   •  Just  a  few  acEons  at  a  Eme   •  they  remain  consistent  throughout  the  app  to   prevent  confusion   36  
  37. 37. MulEdimensional  User   Interfaces     •  Virtual  extensions  for  a  graphic  UI   •  Linear  navigaEon  in  mulEdimensional  direcEons   •  Suitable  for  different  form  factors   •  But  limited  to  GUIs     37  
  38. 38. 38  
  39. 39. SpaEal  Display  Metaphor   [Am_,  Oliver,  and  Paul  Lukowicz.  "From  backpacks  to  smartphones:  Past,  present,  and  future     of  wearable  computers."  IEEE  Pervasive  CompuEng  3  (2009):  8-­‐13.]   39  
  40. 40. Facet   [Lyons,  K.,  Nguyen,  D.,  Ashbrook,  D.,  and  White,  S.  Facet:  A  MulE-­‐Segment  Wrist  Worn   System.  UIST  ’12,  (2012),  123–130.]   40  
  41. 41. Peeble  -­‐  Timeline   41  
  42. 42. Usability  vs.  AestheEcs   IntenEon  to  use  on-­‐body  products  will  be  greater   if  good  usability  is  perceived  in  conjuncEon  with   good  percepEon  of  visual  appearance  rather  than   good  visual  appearance  exclusively     [Kuru,  A.  and  Erbuğ,  C.  ExploraEons  of  perceived  qualiEes  of  on-­‐body  interacEve  products.     Ergonomics  56,  May  (2013),  906–21.]   42  
  43. 43. InteracEvity   How  the  product  informs  the  user  about  its   usage  and  how  the  user  receives  feedback  from   the  product  are  powerful  determinants  of   perceived  interacEvity       [Kuru,  A.  and  Erbuğ,  C.  ExploraEons  of  perceived  qualiEes  of  on-­‐body  interacEve  products.     Ergonomics  56,  May  (2013),  906–21.]   43  
  44. 44. Conclusion   •  Micro  interacEons  and  mulE  dimensional   interfaces  fulfill  major  requirements  for   graphic  interfaces  in  wrist  worn  wearables   •  Enabling  quick  interacEon  and  requiring  low   cogniEve  efforts  and  acenEon  from  end  users   44  
  45. 45. Acknowledgment   This  material  is  based  upon  work  supported  by   the  NaEonal  Science  FoundaEon  under  Grant  No.   1314342.  Any  opinions,  findings,  and  conclusions   or  recommendaEons  expressed  in  this  material   are  those  of  the  author(s)  and  do  not  necessarily   reflect  the  views  of  the  NaEonal  Science   FoundaEon.   45  
  46. 46. Q&A   46  
  47. 47. References   •  Lyons,  K.,  and  Profita,  H.,  (2014).  The  MulEple  DisposiEons  of  On-­‐Body   and  Wearable  Devices,  Pervasive  CompuEng,  IEEE,  vol.  13,  no.  4,  pp.  24,   31,  Oct.-­‐Dec.  2014  doi:  10.1109/MPRV.2014.79   •  Mot,  V.  G.,  and  Caine,  K.  (2014).  Human  Factors  ConsideraEons  in  the   Design  of  Wearable  Devices.  In  Proceedings  of  the  Human  Factors  and   Ergonomics  Society  Annual  MeeEng  (Vol.  58,  No.  1,  pp.  205-­‐209).  SAGE   PublicaEons.   •  Oakley,  I.  and  Lee,  D.  (2014).  InteracEon  on  the  Edge:  Offset  Sensing  for   Small  Devices.  Proceedings  of  the  32nd  annual  ACM  conference  on   Human  factors  in  compuEng  systems  -­‐  CHI  ’14,  (2014),  169–178.   •  Rawassizadeh,  R.,  Price,  B.  A.,  and  Petre,  M.  (2014).  Wearables:  Has  the   Age  of  Smartwatches  Finally  Arrived?.  CommunicaEons  of  the  ACM  58,  1,   45–47.   47  

×