Knowsy: Applying Agile UX Methods to iPad Game Design


Published on

Presented at the Agile Experience Design Meetup at Pivotal NYC, May 5, 2011.

Published in: Technology, Education, Design
1 Comment
No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Knowsy: Applying Agile UX Methods to iPad Game Design

  1. 1. KNOWSY  Applying  Agile  UX  Methods    to  iPad  Game  Development  Agile  User  Experience  Meetup  May  5,  2011  Lane  Halley    @thinknow  
  2. 2. Who’s  here  tonight?     What  role(s)  do  you  fill?     What  kind  of  products  do  you  work  on?     What  kind  of  company  do  you  work  for?   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   2   3.0  United  States  
  3. 3. About  me     Freelance  product  designer     Agile  /  UX  Coach     20+  years  in  SW  development     Cooper  Fellow  (Goal-­‐Directed   Design©,  Personas)     Co-­‐director,  NYC  LUXr  program   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   3   3.0  United  States  
  4. 4. What  are  agile  UX  methods?   User  experience  pracRces  support  an  agile   development  framework  when  they  are:     Quick     Visual     CollaboraRve     ConRnuous   Working  this  way  benefits  the  product  and  the  team   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   4   3.0  United  States  
  5. 5. What’s  a  serious  game?   A  serious  game  is  a  game  designed  for  a  primary   purpose  other  than  pure  entertainment.     Innova4on  Games:  Crea4ng   Breakthrough  Products  Through   Collabora4ve  Play   Luke  Hohmann   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   5   3.0  United  States  
  6. 6. Speedboat   Speedboat   Spider  web   Product  Box   Remember    the  future   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   6   3.0  United  States  
  7. 7. Knowsy™  is  [an  iPad]  game  where  you,  your   friends,  family  and  co-­‐workers  get  a   chance  to  find  out  how  well  you  know   each  other.  How?  By  guessing  each  others   favorite  items  in  a  host  of  categories.   hPp://   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   7   3.0  United  States  
  8. 8. What’s  the  game  like?     It’s  easier  to  demonstrate  than  explain.     Let’s  play  a  game!   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   8   3.0  United  States  
  9. 9. Geong  ready   Form  groups   of  three  people.   Each  person  gets   a  set  of  six  ice   cream  flavor   cards.   Pick  the  first  VIP   (Very  InteresRng   Person).   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   9   3.0  United  States  
  10. 10. Remove  one  flavor   The  VIP  removes   their  least  favorite   flavor  of  the  six.   Show  the  other     players  the  flavor   that’s  “out.”   All  players  remove   that  flavor  from   the  cards  for     this  turn.   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   10   3.0  United  States  
  11. 11. VIP  orders  cards   The  VIP  arranges     1 Most  Favorite   the  five  flavors   from  most  favorite   2 to  least  favorite.   3 4 Keep  your  cards   hidden  from  the     5 Least  Favorite   other  players   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   11   3.0  United  States  
  12. 12. VIP  done,  other  players  order  cards   The  VIP  puts  the   1 cards  face-­‐down   on  a  surface  (or   2 just  holds  them).   3 The  other  players   4 arrange  their   cards,  in  an  order   5 they    think  will   match  the  VIP’s   favorite  flavors.   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   12   3.0  United  States  
  13. 13. Other  players  order  cards   When  the  other   1 players  are  done,   they  put  their     2 cards  down  next   3 to  the  VIP’s  cards,   face-­‐up.     4 5 (or  just  hold  them)   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   13   3.0  United  States  
  14. 14. Score  the  round   5 0 #1  =  5  points   4 4 #2  =  4  points   #3  =  3  points   3 3 #4  =  2  points   2 2 #5  =  1  point   1 0 9   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   14   3.0  United  States  
  15. 15. Repeat  with  next  VIP   The  next  VIP   removes  their   least  favorite  flavor.   Show  the  other     players  the  flavor   that’s  “out.”   All  players  remove   that  flavor  from  the   cards  for  this  turn.   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   15   3.0  United  States  
  16. 16. Let’s  get  started!   1.  VIP  picks  five  flavors   2.  VIP  orders  the  flavors  (hidden)   3.  Other  players  order  flavors  (hidden),   try  to  match  VIP’s  order   4.  VIP  shows  choices,  players  show   choices,  score  round,  record  scores   5.  ConRnue  with  new  player  as  VIP   The  game  ends  when  all  players  have  been  VIP   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   16   3.0  United  States  
  17. 17. Turning  an  idea  into  an  iPad  game     How  could  we  translate  the  experience  of  this   game  into  an  iPad  applicaRon?     Here’s  a  behind-­‐the-­‐scenes  look  at  the  making     of  Knowsy   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   17   3.0  United  States  
  18. 18. Our  objecRves     Build  MVP  version  of  new  game  plavorm     Learn  iPad  programming     Introduce  UX  methods  to  an  agile  team     Ship  to  Apple  store  quickly  (~1  month)   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   18   3.0  United  States  
  19. 19. We  all  sat  together  in  one  room   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   19   3.0  United  States  
  20. 20. We  had  story  cards   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   20   3.0  United  States  
  21. 21. We  had  screen  designs   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   21   3.0  United  States  
  22. 22. We  even  had  a  persona  We  even  had  a  persona   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   22   3.0  United  States  
  23. 23. But,  there  were  a  few  sRcky  spots     We  argued  about  what  was  important     It  didn’t  feel  like  we  were  all  working  on     the  same  thing     We  worried  about  finishing  on  Rme     The  designer  ley  the  project   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   23   3.0  United  States  
  24. 24. What  was  wrong?     The  team  didn’t  have  a  shared  vision  of  what   we  were  building     Here  are  some  different  things  I  tried  to  help   fix  this   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   24   3.0  United  States  
  25. 25. Experiment  1:  collaboraRve  sketching   Ask  the  front-­‐end  developer  to  draw  me  a  picture  of   the  game  screen  flow   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   25   3.0  United  States  
  26. 26. This  helped  us  develop  a  shared  understanding   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   26   3.0  United  States  
  27. 27. Experiment  2:  context  scenario   Create  a  context  scenario  to  help  us  imagine  the   specific  contents  of  each  screen  during  each  step   of  the  game   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   27   3.0  United  States  
  28. 28. The  team  was  interested,  but  not  inspired   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hGp://   3.0  United  States   28  
  29. 29. Experiment  3:  low-­‐fi  screen  layouts     Using  Omnigraffle,  create  screen  layouts  to   illustrate  each  of  the  the  scenario  steps     I  worked  on  it  all  weekend,  and  presented  it   to  the  team  Monday  morning   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   29   3.0  United  States  
  30. 30. This  generated  lots  of  conversaRon  and  ideas   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   30   3.0  United  States  
  31. 31. Experiment  4:  paper  prototype   Make  a  paper  prototype  of  the  whole  game  to   quickly  capture  what  the  team  had  just  decided   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   31   3.0  United  States  
  32. 32. Who’s  in  the  game?   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   32   3.0  United  States  
  33. 33. Who’s  the  first  VIP?   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   33   3.0  United  States  
  34. 34. VIP  picks  a  topic   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   34   3.0  United  States  
  35. 35. VIP  orders  the  list   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   35   3.0  United  States  
  36. 36. Who’s  the  first  player?   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   36   3.0  United  States  
  37. 37. Player  one,  are  you  ready?   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   37   3.0  United  States  
  38. 38. Player  one’s  turn   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   38   3.0  United  States  
  39. 39. We  were  now  back  on  track     Playing  the  game  together  using  the  paper   prototype  created  a  shared  experience  for  the   team     Everyone  was  having  fun  again  and  we  all   understood  what  we  were  building   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   39   3.0  United  States  
  40. 40. We  added  scenario  steps  (ley)  and  annotaRons  (right)   License:  CreaRve  Commons  APribuRon-­‐Share  Alike   hPp://   40   3.0  United  States  
  41. 41. Experiment  5:  prototype  as  spec   Create  a  new  low-­‐fidelity  electronic  prototype  in   Balsamiq,  based  on  paper  prototype.  This  became   the  product  specificaRon   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   41   3.0  United  States  
  42. 42. Knowsy  was  accepted  to  the  iPhone  store   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   42   3.0  United  States  
  43. 43. The  plavorm  conRnues  to  evolve   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   43   3.0  United  States  
  44. 44. Lessons  learned     Build  shared  physical  arRfacts       Incorporate  other  team  members’  mental  models     Lead  with  conversaRon,  trail  with  documentaRon     Use  personas  and  scenarios  as  backstory,     not  as  deliverables     Associate  user  stories  with  pictures  and   scenario  steps   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   44   3.0  United  States  
  45. 45. Summary  of  UX  methods  tried     Using  digital  tools  too  early  (fail)       CollaboraRve  sketching  (win)     Persona  and  context  scenario  (meh)     Low-­‐fi  screen  layouts  (meh)     Paper  prototype  (win)     Prototype-­‐as-­‐spec  (win)   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   45   3.0  United  States  
  46. 46. Thanks!   Lane  Halley   twiPer:  thinknow   License:  CreaRve  Commons  APribuRon-­‐Share  Alike  hPp://   46   3.0  United  States