UI for UX_Aug2011

0 views
1,672 views

Published on

User interface design in TUAD 2011

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
0
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
26
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

UI for UX_Aug2011

  1. 1. UI for UX Designing UX to design user interface Yoshinori Wakizaka | 2nd Aug 2011 at TUAD11 8 4
  2. 2. Yoshinori Wakizaka yoshinori wakizaka @wackiesrock Project manager on UI/UX and marketing11 8 4
  3. 3. Key message UI11 8 4
  4. 4. Agenda • UI What UI design mean? • A definition of Design is changing • UI 50min + 30min Role and responsibility workshop • UI UI Design and evaluation methods • UI A new paradigm of UI design11 8 4
  5. 5. User Interface Design11 8 4
  6. 6. [wikipedia ] Interface User Interface (UI) User Interface Design (UID)11 8 4
  7. 7. 11 8 4
  8. 8. User Experience (UX)11 8 4
  9. 9. 11 8 4
  10. 10. 11 8 4
  11. 11. 11 8 4
  12. 12. 11 8 4
  13. 13. 11 8 4
  14. 14. 11 8 4
  15. 15. 11 8 4
  16. 16. 11 8 4
  17. 17. Sony Digital Camera Interaction flow (c)axis11 8 4
  18. 18. Unbox the digital camera to take picture Start Start User experience11 8 4
  19. 19. 11 8 4
  20. 20. http://www.kickerstudio.com/blog/2008/12/the-disciplines-of-user-experience/11 8 4
  21. 21. 11 8 4
  22. 22. 11 8 4
  23. 23. 80 90 UI 00 UX UX 10 UI11 8 4
  24. 24. 1970’s Word processor11 8 4
  25. 25. 1980’s Personal computer The Xerox Star 8010 (1981) The Xerox Star 8010 "Dandelion" http://www.digibarn.com/collections/systems/xerox-8010/index.html11 8 4
  26. 26. 1990‘s Graphical User Interface11 8 4
  27. 27. 2000’s-2010: web & mobile11 8 4
  28. 28. 11 8 4
  29. 29. • UI11 8 4
  30. 30. Software product design: NOKIA N911 8 4
  31. 31. NOKIA N9 UI design guideline !"#$%&()*%+$, -#*./*$,)010 2&*,).+%#3$4)*,)")-"4&(*$-)+5)4&+#-&4,)"$.),#--,4*+$,)5+()4&)%("4*+$)+5)%+$,*,4$4)"$.) 6"/"$%.)2++/6"()78+)*%+$,1)2&)9:)+6;%4*<)+5)4&*,).+%#3$4)*,)4+)-#*.)"$.)",,*,4=)$+4) 4+)4//)"$.).3"$.1) (*-&4)(,#/4,1 >#$)?@0011 8 4
  32. 32. •11 8 4
  33. 33. Hardware Hardware Software Software Service11 8 4
  34. 34. Online to Offline →Goodzer →Shazam11 8 4
  35. 35. Googzer Google Maps http://svlifelog.blogspot.com/2011/06/o2o-commerce-now-and-future.html11 8 4
  36. 36. Shazam http://itomasahiro.arrow.jp/?p=42511 8 4
  37. 37. 11 8 4
  38. 38. 11 8 4
  39. 39. TV Everywhere – Thoughts on designing for multiple devices http://sherylyulin.com11 8 4
  40. 40. 11 8 4
  41. 41. 11 8 4
  42. 42. 11 8 4
  43. 43. Case study: Rakuten - - - - - SEO11 8 4
  44. 44. Case study: Facebook - - - UI - -11 8 4
  45. 45. • • UI • • UX •11 8 4
  46. 46. 11 8 4
  47. 47. 11 8 4
  48. 48. SHERMAN UX11 8 4
  49. 49. 11 8 4
  50. 50. • • •11 8 4
  51. 51. 11 8 4
  52. 52. • UI • UX UI • •11 8 4
  53. 53. Workshop11 8 4
  54. 54. - -11 8 4
  55. 55. 11 8 4
  56. 56. • • • •11 8 4
  57. 57. 11 8 4
  58. 58. TV YouTube web + TV Twitter11 8 4
  59. 59. 11 8 4

×