EECE  418  Assignment  1  –  Pre-­‐proposal    Adjusting  Color  Settings  on  an  LG  LCD  Monitor    Raymond  Huang  -­‐  12ay.huang@gmail.com    

   1)  Problem  Description  The  fundamental  interaction  between  users  and  computers  are  interacting  with  displays.  They  are  ubiquitous:  televisions,  laptops,  mobile  phones,  etc.  And  for  the  most  part,  they  function  well:  vibrant  colours,  great  viewing  angles,  and  fast  response  times.  For  a  certain  subset  of  users,  color  accuracy  is  a  critical  feature.  Artists,  photographers  who  work  with  monitors  need  to  calibrate  monitors  to  get  an  accurate  color  representation.  Most  monitors  have  a  few  discretely  placed  buttons  to  adjust  these  settings.      

 Example  of  poorly  corrected  monitors    

 In  our  LG  monitor,  there  are  usually  four  buttons:  Menu,  Left,  Right,  Set/Auto,  Power.  The  first  four  buttons  are  used  to  navigate  the  menus  and  set  the  various  options  available  on  the  display.      

 Buttons  available  to  the  user  

2)  Functionality    The  function  of  these  buttons  is  to  control  various  monitor  settings  to  adjust  the  colour  settings.  The  Menu  Button  initiates  the  menu  to  adjust  settings,  and  also  works  as  a  back  button  once  in  the  menus.  The  “Volume  Down”  and  “Volume  Up”  buttons  are  used  to  navigate  the  submenus  and  also  to  set  the  values  of  options.  The  Auto/Set  button  is  used  to  confirm  actions,  and  to  navigate  between  different  options  in  the  submenu.      The  main  users  interested  in  using  a  system  like  this  would  be  artistically  technical  users,  for  example:  photographers  or  digital  artists  interested  in  getting  the  most  accurate  color  representation  out  of  their  displays.  Color  accuracy  is  important  because  it  is  easy  for  tones  to  warp  slightly,  especially  if  human  skin  tones  have  color  casting.  Another  case  would  be  the  contrast  levels,  because  if  your  display  may  wash  colors  or  hide  detail  due  for  different  curves.      The  physical  requirements  of  this  system  are  firstly:  controls  are  placed  discreetly,  but  obvious.  When  we  are  looking  at  monitors,  we  want  to  focus  on  the  display  itself  and  not  distracting  buttons  placed  along  the  screen.  With  this  constraint,  we  want  to  have  an  intuitive  interface  to  adjust  the  display  properties.  Physical  buttons  are  used  and  they  should  have  good:  visual  affordances,  mapping,  and  positive  transfer  effects  to  minimize  human  error.  Additionally,  we  must  have  responsive  feedback  to  fine-­‐tuning  the  display.  We  want  the  display  to  automatically  refresh  the  content  and  show  us  the  instantaneous  values  of  the  current  color  settings.  There  are  myriads  of  display  options  available,  and  ideally  there    should  be  some  mechanism  to  save  states  or  presets  so  that  users  can  easily  compare  different  settings  or  to  go  back  incase  undesirable  changes  are  made.      The  user  experience  should  focus  on  ease  of  use.  Users  do  not  adjust  their  display  settings  very  often,  so  there  are  no  strong  learning  effects  for  remembering  how  to  use  the  buttons  or  On  Screen  Display.  Essentially,  every  time  we  dive  into  the  settings,  we  are  re-­‐learning  the  buttons  as  we  go  along.  Because  of  this,  I  think  the  two  usability  requirements  are:  straight  forward  controls  to  prevent  pressing  error,  easy  to  navigate  menus  so  that  we  don’t  waste  time  going  through  menus,  and  fast  feedback  to  evaluate  changes.      This  leads  to  the  following  questions:  Are  the  controls  intuitive  and  error-­‐prone-­‐free?  Can  I  easily  find  what  I  am  looking  for?  Can  I  easily  see  the  changes  I  made  to  the  display?  Can  I  easily  recover  if  I  make  a  mistake?  With  regards  to  these  three  questions,  a  few  problems  were  raised.      My  three  main  issues  with  the  current  designs  are  the  following:  ambiguous  functions  of  physical  button,  poor-­‐flow  of  menu  navigation,  and  the  inability  to  recover  gracefully  from  value  change  error.    Firstly,  the  four  buttons  for  menu  navigation  are  very  ambiguous.  To  instantiate  the  menu,  you  press  the  “Menu”  button.  Because  you  press  the  Menu  button  to  bring  up  the  menu,  our  minds  are  mapping  the  “Menu”  button  to  positive  actions,  

such  as  advancing  into  menus.  It  becomes  awkward  once  you  enter  the  menu,  because  the  “Menu”  button  suddenly  becomes  back/exit.  In  fact,  now  the  navigation  is  done  either  by  the  “Volume”  buttons  or  by  the  “Auto/Set”  buttons  depending  whether  it’s  surfing  through  categories  or  submenus.  This  makes  it  all  the  more  confusing  because  the  “Volume”  labels  give  the  notion  of  navigation.  The  menus  are  placed  horizontally,  so  there  is  a  visual  cue  to  use  the  Up/Down  buttons  to  navigate  between  options.  Futhermore  it  makes  no  sense  how  “Auto/Set”  should  be  used  to  navigate.  This  is  a  poor  design  choice  because  the  buttons  take  on  too  many  different  mappings,  and  it  is  not  straightforward  when  the  context  should  change.      

 The  left  vertical  menu  uses  “Volume  Keys”  while  the  middle  menu  uses  “set”  

 Secondly,  there  is  a  problem  with  the  menu’s  coherency.  Under  “f-­‐Engine”,  if  the  options  are  not  set  to  “User”,  then  all  the  other  options  are  un-­‐selectable.  However,  f-­‐Engine  is  nestled  in  other  menus,  so  the  cause  à  effect  relationship  is  not  obvious  to  the  user.  Another  problem  with  the  menu  is  the  incoherency  of  the  splash  screen.  It  adds  no  additional  features  to  the  menu.  Once  in  the  submenus,  we  never  returns  back  to  this  splash  screen.  Thirdly,  one  of  the  menus  have  double  the  number  of  options,  requiring  you  to  scroll.  However,  there  is  very  weak  indicators  to  show  this  is  possible,  and  you  are  not  aware  of  it  unless  you  press  “Auto/Set”  enough  times  to  reach  the  bottom.      

 If  f-­‐Engine  is  not  set  to  ‘User’,  all  the  other  options  in  the  left  menu  are  grayed  out,  even  though  you  

can  access  them.    Thirdly,  there  is  no  way  of  un-­‐doing  changes.  In  the  menus,  I  was  unable  to  find  a  “Restore  to  Default”  option.  If  we  want  more  granularity,  for  example,  to  undo  

the  most  recent  action,  that  does  not  exist  either.  For  each  option,  there  are  no  visual  indicators  to  show  what  its  default  value  is,  so  we  are  left  to  guess.      3)  Design  Goals  and  Evaluations    For  the  first  two  problems  stated,  I  wanted  to  improve  the  UI  by  1)  reducing  the  various  mappings  in  the  buttons  because  they’re  prohibitively  difficult  to  reinforce,  and  also  to  make  menus  non-­‐ambiguous  about  navigation,  especially  the  cues.    To  facilitate  these  changes,  I  wanted  to  keep  the  number  of  buttons  the  same  but  wanted  to  show  there  are  better  mappings.  If  we  take  advantage  of  the  “4:3  in  Wide”  button  to  help  navigate  the  menu,  we  can  use  Up/Down/Left/Right  and  Menu.  In  this  mapping,  we  do  not  need  any  button  to  take  on  multiple-­‐mappings.    Most  monitors  built  today  by  LG  are  large  high-­‐resolution  displays.  It  would  make  sense  to  make  use  of  this  real  estate.  The  existing  On-­‐Screen-­‐Display  only  uses  a  small  fraction  of  the  screen.  If  we  expand  the  menu  both  vertically,  so  that  all  the  items  are  placed  in  a  long  list,  it  would  be  much  easier  to  navigate.  We  can  keep  categories  separated  by  sub-­‐headings  and  by  using  colours  and  shapes.  We  can  also  place  the  “f-­‐Engine”,  or  newbie-­‐friendly  controls  on  the  top,  so  it  logically  shows  why  all  the  other  menu  options  are  disabled.      

 Proposed  Idea:  F-­‐Engine  is  logically  placed,  one  large  menu  taking  up  the  vertical  space  with  

grouped  categories    

Now,  the  Up/Down  keys  are  solely  used  for  navigating  between  different  options.  The  Left/Right  keys  are  used  solely  for  adjusting  parameters,  and  the  Menu  key  is  only  used  to  toggle  the  menu  on/off.    All  button  ambiguity  is  removed.  If  additional  functions  are  added,  we  can  still  stick  to  the  vertical  navigation  by  creating  expanding  blocks.    To  solve  problem  number  3,  something  interesting  occurred.  I  realized  that  this  feature  existed,  but  on  a  second  screen  in  the  same  menu.  I  feel  this  is  very  poorly  placed.  Even  so,    “Factory  Default”  resets  all  the  display  settings.    If  we  do  not  want  to  implement  an  undo-­‐button,  what  we  can  do  is  place  an  indicator  

along  the  slider  and  flash  a  different  colour  when  we  have  the  default  value  i.e.  “Brightness:  100,  Contrast:  70,  Gamma:  0”.    To  facilitate  these  changes,  I  specifically  wanted  to  keep  the  buttoned  interface  the  same.  Therefore,  these  changes  are  mostly  software  based.  In  fact,  none  of  the  changes  I  requested  require  any  sharply  new  functionality.  All  that  changed  are  the  button  mappings  and  the  layout  of  the  On  Screen  Display.      If  we  were  to  talk  to  the  engineers  at  LG  that  implemented  the  interface,  it  probably  would  take  at  most  10  hours  of  coding  at  max  to  facilitate  these  changes.  At  a  cost  of  53$  an  hour  for  a  consultant  (most  common  via  Peak  Usability  for  2004),  this  project  would  cost  between  $500  to  $1000.  However,  I  imagine  that  LG  uses  a  consistent  UI  across  many  product  lines,  so  money  would  have  to  be  spent  optimizing  the  code,  and  making  sure  it  works  among  all  their  product  lines.  I  cannot  estimate  that  aspect.