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.

#4_web_ux_wakizaka

3,321 views

Published on

Published in: Design
  • Be the first to comment

#4_web_ux_wakizaka

  1. 1. UX4th June 2011 Yoshinori Wakizaka
  2. 2. ✤ UX ✤ 2011 ✤ ✤ ✤4th June 2011 Yoshinori Wakizaka
  3. 3.
  4. 4. Introduction Yoshinori Wakizaka Facebook yoshinori wakizaka Twitter @wackiesrock →IT role UX→ for4th June 2011 Yoshinori Wakizaka
  5. 5. 2000 ✤4th June 2011 Yoshinori Wakizaka
  6. 6. Internet Web Access Messaging Sync Sync4th June 2011 Yoshinori Wakizaka
  7. 7. 20104th June 2011 Yoshinori Wakizaka
  8. 8. ✤ ✤ ✤4th June 2011 Yoshinori Wakizaka
  9. 9. Internet Search, Share, SNS, Storage Access Access Access Sync Sync4th June 2011 Yoshinori Wakizaka
  10. 10. ✤ PC Intel+MS ✤ CPU MW PC ✤ PC PC PC PC OS OS Windows CPU CPU CPU Vendor Vendor Intel4th June 2011 Yoshinori Wakizaka
  11. 11. I/F
  12. 12. 4th June 2011 Yoshinori Wakizaka
  13. 13. UX PC TV4th June 2011 Yoshinori Wakizaka
  14. 14. More users will connect to the Internet over mobile devices than desktop PCs http://gigaom.com/2010/04/12/mary-meeker-mobile-internet-will-soon-overtake-fixed-internet/4th June 2011 Yoshinori Wakizaka
  15. 15. 4th June 2011 Yoshinori Wakizaka
  16. 16. 4th June 2011 Yoshinori Wakizaka
  17. 17. G Wifi
  18. 18. http://www2.parc.com/csl/members/weiser/4th June 2011 Yoshinori Wakizaka
  19. 19. 3 basic form for ubiquitous computing ✤ Tab: wearable centimetre sized devices. ✤ Pad: hand-held decimetre-sized devices. ✤ Boards: metre sized interactive display devices. Topic Statement Purpose Inch-scale computers, embedded into the Identification/tracking and computer Tab everyday world, limited display capabilities. management (applications/memory). Foot-scale computers, moderate display, “Leave-behind” devices, used anywhere Pad basic input techniques, advanced (scrap-paper computers). communication techs (100 dev/room). Yard-scale computers, abundant display, Discussion area, storage mechanism Board basic input techniques (“chalk-stylus”) . (downloadable pad-shelf).4th June 2011 Yoshinori Wakizaka
  20. 20. 4th June 2011 Yoshinori Wakizaka
  21. 21. Current status ✤ Tab ✤ Pad PC ✤ Boards TV IT4th June 2011 Yoshinori Wakizaka
  22. 22. Big brother is watching you ✤ http://www.flickr.com/photos/timrich26/3048134488/4th June 2011 Yoshinori Wakizaka
  23. 23. Extending the platform beyond mobile to other appliances4th June 2011 Yoshinori Wakizaka
  24. 24. OS ✤ OS App App App App App App TV4th June 2011 Yoshinori Wakizaka
  25. 25. ✤ × ×OSService SerBrowser App Browser OS PC Mobile4th June 2011 Yoshinori Wakizaka
  26. 26. ✤ / Web App PC PC website RIA Smartphone Smartphone Smartphone App Optimized site Ke-tai Mobile site Mobile App4th June 2011 Yoshinori Wakizaka
  27. 27. ✤ × PC website Smartphone app 3rd party client4th June 2011 Yoshinori Wakizaka
  28. 28. UX
  29. 29. ✤ ✤ ✤ UCD
  30. 30. ✤ ✤4th June 2011 Yoshinori Wakizaka
  31. 31. ✤ ✤ ✤4th June 2011 Yoshinori Wakizaka
  32. 32. ✤ Context of use ✤4th June 2011 Yoshinori Wakizaka
  33. 33. User Segmentation Fact Persona Scenario Fact Observation Interview4th June 2011 Yoshinori Wakizaka
  34. 34. User ’ Segmentation Fact Persona Scenario Fact Observation Interview ’4th June 2011 Yoshinori Wakizaka
  35. 35. User ✤ Segmentation ✤ Fact Fact Persona Scenario Fact Observation Anecdote Scenario Interview4th June 2011 Yoshinori Wakizaka
  36. 36. 104th June 2011 Yoshinori Wakizaka
  37. 37. 4th June 2011 Yoshinori Wakizaka
  38. 38. ✤ UX 1. UI Design Scenario 2. UX Design Break down Integration >> Designing >> Designing User Interface. User Experience.4th June 2011 Yoshinori Wakizaka
  39. 39. 2. UX Design 1. UI Design Story Wire Interaction Framing Scenario Scenario✤✤ Scenario✤ 4th June 2011 Yoshinori Wakizaka
  40. 40. 1 UI design ✤ Service Scenario ✤ Scenario Scenario Scenario ✤ ✤ Task Task Task ✤ ✤ WF ✤ Prototyping4th June 2011 Yoshinori Wakizaka
  41. 41. 1 UI design WF ✤ service .......scenario activity ....... iPhone ○○scenario ....... 4th June 2011 Yoshinori Wakizaka
  42. 42. UX Design ✤ ✤ ✤ UI/UX Story Scenario Scenario Scenario4th June 2011 Yoshinori Wakizaka
  43. 43. Design process and approach Heuristics Prototyping UT Interaction scenario UI Fact Persona Service Survey Heuristics Story UX Interview Interview Observation4th June 2011 Yoshinori Wakizaka
  44. 44. UX ✤ Story UI/UX UI/UX UI/UX UI/UX design design design design Web App Web App Device Device Device4th June 2011 Yoshinori Wakizaka
  45. 45. ✤ Starbucks Experience Map http://www.littlespringsdesign.com/wp-content/themes/LSD%20theme/images/experiencemap1.pdf4th June 2011 Yoshinori Wakizaka
  46. 46. ✤ : Grow! http://chopicto.visualthinking.jp/archives/5584th June 2011 Yoshinori Wakizaka
  47. 47. ✤ Flickr User Model, v0.2 http://www.flickr.com/photos/bryce/56404690/in/photostream/4th June 2011 Yoshinori Wakizaka
  48. 48. Visualize user experience (e.g. Concept diagram..) Story (Whole user experience) Scenario ScenarioVisualize interaction (e.g. Experience map) Scenario (Series of tasks) Task Task Task Ix Ix Ix Ix Ix Ix Ix Ix Ix4th June 2011 Yoshinori Wakizaka
  49. 49. ✤ ✤ ✤ ✤ ✤ ✤4th June 2011 Yoshinori Wakizaka
  50. 50. ✤ ✤ ✤ ✤4th June 2011 Yoshinori Wakizaka

×