User Experience Design - James' cooking App


Published on

Quiz James about his interests and find a problem that could be solved with a simple mobile app. Design an app that solves the problem simply and effectively.

Student project for User Experience Design Immersive, General Assembly, Summer Sydney 2014

1 week

POP App, pencils and paper.

Published in: Design, Self Improvement

User Experience Design - James' cooking App

  1. 1. Mobile Application User  Experience  Design:   UXDi:  Project  1   SARA MICHELAZZ0 Needfinding,  Scenarios,  Rapid  Prototyping  (POP)  
  2. 2. Statment of the problem Solution James wishes he were a better cook. He enjoys cooking, but doesn’t have much time for it. He looks for recipes online and makes up his own, but usually cooks the same 5 basic recipes. When he cooks, he tends to modify recipes on the fly without keeping track of the changes. This makes it difficult to reproduce the same recipes in the future. I designed an app to make James a better cook. It helps him keep track of successful recipe alterations and build his own recipe collection. The app also gives James inspiration to continue cooking his favourite recipes and to add more variety to his repertoire.
  3. 3. How do I get it?
  4. 4. Needfinding
  5. 5. Needfinding The first step of the project involved focusing on the problems. Needfinding included: -  getting ready for the interview, -  conducting the interview, -  audio recording the interview and taking notes. Then going through all of the materials again.
  6. 6. When the results are not as I expected I get a bit frustrated. “ “ Me: “Great … there is a little problem I can work on!”
  7. 7. Key findings James  enjoys  cooking;  he  used  to  cook  every   day  before  he  got  married  9  months  ago.  Now   he  cooks  2/3  +mes  a  month  and  someLmes   during  the  weekend  with  his  wife.  James  tends   to  prepare  basic  meals,  usually  with  the  same   5  recipes.  SomeLmes  he  looks  for  recipes   online  and  he  makes  his  choice  based  on  the   pictures  and  the  ingredients.     He  usually  changes  recipes  to  suit  his  taste   but  he  doesn’t  keep  track  of  the  changes  he   makes.  The  result  is  that  he  oPen  gets   frustrated  because  the  recipes  don’t  always   taste  the  same  every  Lme.  
  8. 8. I look for recipes online and I make my choice based on the pictures and the ingredients. “ “ Me: “Yep he is used to browse the web for recipes ! ”
  9. 9. During the downtimes while cooking I read news on my iPhone. “ “ Me: “He has an iPhone and he uses it while cooking!
  10. 10. I am willing to learn because I really enjoy the process. “ “ Me: “He wants to improve so he will be willing to invest some time to become a better cook!
  11. 11. The solution
  12. 12. Goals: •  Help James to remember successful changes to recipes. •  Collect his recipes.
  13. 13. How do I get there?
  14. 14. Brainstorming I  have  sketched  new   ideas  on  paper  to  keep   track  of  them  but  I  didn’t   read  them  back  unLl  I   had  finished  analyzing   the  problem  and  the   user’s  needs.  Usually,   new  ideas  become  a   great  source  of   innovaLon  later  on  in   the  process.  
  15. 15. User flow In  order  to  define  the   main  flow  I  sketched   the  whole  process,   underlining  the   decision  points  and   the  interacLon  with   external  resources.  
  16. 16. Site Map Designing  the  site  map  helped  me  to   understand  the  hierarchy  of  pages  
  17. 17. Improving design through validated scenarios. When you sketch a scenarios ask yourself if it is plausible. Tell a story, but tell a plausible one. I had the chance to validate these scenarios with James. Every scenario leaded me to very interesting features driven by the user need.
  18. 18. Usually  before  James   create  a  new  recipe   he  goes  to  the  market   for  inspiraLon  and  to   buy  ingredients.     APer  he  eats  if  the   dish  looks  good  he   takes  a  picture.   Scenario 1 Very  frequent  
  19. 19. Scenario 1 Very  Frequent   Usually  people   who  are  cooking   have  dirty  hands.   This  is  why:     -­‐  the  main   informaLon  should   fit  on  one  page,  so   there  is  no  need  to   scroll.   -­‐  the  iPhone   shouldn’t  turn  the   screen  off  while  on   the  recipe  page.  
  20. 20. Scenario 2  Frequent   James  wants  to   cook  a  recipe  he   made  a  few  months   ago.  He  can’t   remember  the   ingredients  and  he   looks  them  up  on   the  app.  He  decides   to  modify  the   recipe  on  the  fly   and  the  result  is   awesome:  it  tastes   much  beer  this   way.  
  21. 21. Scenario 2  Frequent   James  likes  to  alter   recipes  but  usually   the  changes  are   small.  This  is  why  I   should:     -­‐  insert  a  clone   bu?on  so  James   doesn’t  have  to  fill   the  new  recipe   form  from  scratch   and  he  can  save   Lme.  
  22. 22. Scenario 3  Less  frequent   James  prefers  to   look  for  new   recipes  online   using  his  desktop   because  he  finds   the  bigger  screen   more  convenient.   This  is  why  he   needs  a  tool  that   synchronizes  his   desktop  with  his   phone.  
  23. 23. Scenario 3b  Less  frequent   The  sync  applicaLon   should  include  the   following  features:     •  Send  a  link.   •  Send  notes.   •  Select  a  picture   from  the  url.  
  24. 24. Rough scketches
  25. 25. User Feedback
  26. 26. Rough scketches
  27. 27. User Feedback
  28. 28. “Fixed” scketches
  29. 29. Usability testing
  30. 30. POP Prototype Click  to  try  the   interacLons  on   POP  website   WATCH  IT  LIVE   Link:   hps://!/projects/ 52cd332fde3003842e000370/ preview   The  prototype  is  at  a  very  early   stage  and  was  created  with  a   POP  app.  The  main  goal  was  to   understand  if  the  app  could   meet  James’  needs.     InteracLon  with  the  camera  and   the  photo  stream  haven’t  been   explored.  
  31. 31. Design iteration & user feedback Usability  tesLng  the  prototype  helped   me  to  fix  layout  problems  and   interacLons:     Key  findings:   •  Refine  the  home  page.   •  Modify  sync  page.   •  Add  back  buons  to  navigaLon.   •  Refine  the  recipe  page.   Thanks  to  James  feedback  I  was  able  to   improve  some  pages  and  add  new  ones.     Key  findings:     •  the  sync  with  the  desktop  is  now  on  the   home  page   •  in  the  recipe  page  the  main  content  fits   on  one  page   •  the  image  on  the  recipe  page  can  be   enlarged   •  the  "edit  recipe  page"  now  follows  the   design  paern  of  the  recipe  page  
  32. 32. Thank you Special  thanks  to  James,  Cheryl,   Karen  and  Mitch.   SARA MICHELAZZ0