Search

User Experience Best Practices

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

3 comments

Comments 1 - 3 of 3 previous next Post a comment

Post a comment
Embed Video
Edit your comment Cancel

Notes on slide 1

117 Favorites & 1 Event

User Experience Best Practices - Presentation Transcript

  1. WebVisions 2008 Nick Finck May 22nd, 2008 WebVisions, Portland UX Best Practices 1
  2. WebVisions 2008 Who the hell is this guy? • Blue Flavor Director of User Experience, co-founder, partner http://www.blueflavor.com • Digital Web Magazine Publisher and founder http://www.digital-web.com • User Experience Network Seattle Local Ambassador http://www.uxnet.org • My Personal Site http://www.nickfinck.com 2
  3. WebVisions 2008 What I am going to be talking about • Overview of UX • The Criteria • The Sites • Key Takeaways • Questions • Audience Submissions 3
  4. WebVisions 2008 What is User Experience? 4
  5. WebVisions 2008 UX Defined “User Experience (abbreviated: UX) is the quality of experience a person has when interacting with a specific design. is can range from a specific artifact, such as a cup, toy or website, up to larger, integrated experiences such as a museum or an airport.” - User Experience Network (www.uxnet.org) 5
  6. WebVisions 2008 What things factor in to the ideal user experience? Bu s ine sd ss ee N Co er n str Us ain s t Technical Requirements 6
  7. WebVisions 2008 Who controls the User Experience? 7
  8. WebVisions 2008 Who controls the User Experience? 8
  9. WebVisions 2008 Who controls the User Experience? Usability Information Information Web Interaction Specialist Designer Architect Designer Designer 9
  10. WebVisions 2008 Who controls the User Experience? Usability Information Information Web Interaction Specialist Designer Architect Designer Designer Content Human Factors Identity Taxonomist Interactive Specialist Expert Designer Marketer 10
  11. WebVisions 2008 Who controls the User Experience? Usability Information Information Web Interaction Specialist Designer Architect Designer Designer Content Human Factors Identity Taxonomist Interactive Specialist Expert Designer Marketer UX Lead 11
  12. WebVisions 2008 Criteria 12
  13. WebVisions 2008 The Criteria I Used 13
  14. WebVisions 2008 The Criteria I Used • Ease of Use (Usability) Usability Specialist 14
  15. WebVisions 2008 The Criteria I Used • Ease of Use (Usability) • Intuitiveness (Information Design) Usability Information Specialist Designer 15
  16. WebVisions 2008 The Criteria I Used • Ease of Use (Usability) • Intuitiveness (Information Design) • Structure (Information Architecture) Usability Information Information Specialist Designer Architect 16
  17. WebVisions 2008 The Criteria I Used • Ease of Use (Usability) • Intuitiveness (Information Design) • Structure (Information Architecture) • Visual Aesthetic (Visual Design) Usability Information Information Web Specialist Designer Architect Designer 17
  18. WebVisions 2008 The Criteria I Used • Ease of Use (Usability) • Intuitiveness (Information Design) • Structure (Information Architecture) • Visual Aesthetic (Visual Design) • Functionality (Interaction Design) Usability Information Information Web Interaction Specialist Designer Architect Designer Designer 18
  19. WebVisions 2008 The Sites 19
  20. WebVisions 2008 The sites I looked at: • Amazon • eBay • Flickr • Netflix • Target • Toyota • Twitter • Zillow 20
  21. WebVisions 2008 Amazon.com 21
  22. WebVisions 2008 Amazon.com 22
  23. WebVisions 2008 Amazon.com Nice! 23
  24. WebVisions 2008 Amazon.com Umm? 24
  25. WebVisions 2008 Amazon.com Eek! 25
  26. WebVisions 2008 Amazon.com Which button do I click to add it to my wishlist?! 26
  27. WebVisions 2008 Some of the key problems: • Data Driven User experience driven mostly by data analysis (quantitative) and not user input (qualitative) • Improper Functionality Navigational functionality should always properly support the level of information on a site • Business Trumping Business drivers and business decisions should never over power the user’s needs, it should be a balance 27
  28. WebVisions 2008 eBay.com 28
  29. WebVisions 2008 eBay.com 29
  30. WebVisions 2008 eBay.com Ok, a lot of information but not a bad start. 30
  31. WebVisions 2008 eBay.com Wow, ok, way too many links to possibly read through at once! 31
  32. WebVisions 2008 eBay.com Exceptionally well designed! 32
  33. WebVisions 2008 eBay.com Exceptionally poorly designed! 33
  34. WebVisions 2008 Some of the key problems: • Data Driven User experience driven mostly by user input (qualitative) and not data analysis (quantitative) • Design Details Always give every page of a site as much attention as the next when designing. All pages added up make up the user experience. • Navigation Breath Navigation should cover breadth and depth equally, it should never lean on one more than the other. 34
  35. WebVisions 2008 Flickr.com 35
  36. WebVisions 2008 Flickr.com 36
  37. WebVisions 2008 Flickr.com Good break down of information in navigation 37
  38. WebVisions 2008 Flickr.com Overwhelming and incomplete information 38
  39. WebVisions 2008 Flickr.com Properly customized search results 39
  40. WebVisions 2008 Flickr.com Clearly thought through on all aspects of UX 40
  41. WebVisions 2008 Some of the key problems: • Community Driving Architecture Community functionality (Folksonomies) should never drive a site’s architecture and navigation, it should be a supplement • Browse & Search Websites should never rely on search as primary navigation • By Popularity vs. See All If you show part of a set of information you should always allow access to the remainder of that set of information 41
  42. WebVisions 2008 Netflix.com 42
  43. WebVisions 2008 Netflix.com 43
  44. WebVisions 2008 Netflix.com A bit too many options but not too bad! 44
  45. WebVisions 2008 Netflix.com Wait, how do I browse genres again?? 45
  46. WebVisions 2008 Netflix.com Nicely done, but how do I instantly play movies? 46
  47. WebVisions 2008 Netflix.com Ok, no, I just want to add this one move to my Queue! 47
  48. WebVisions 2008 Netflix.com Ok, there is my Queue, but whatʼs this Instant tab for? 48
  49. WebVisions 2008 Some of the key problems: • Alternative Facets of Information Allow users to clearly see the primary information on a given screen, don’t overwhelm the user with other facets of that information • Add vs. Play If your product has two ways of purchasing, make it inherent in the existing architecture • Don’t Distract Do not disrupt a user trying to complete their task with upsells, calls to action, or other disruptive information 49
  50. WebVisions 2008 Target.com 50
  51. WebVisions 2008 Target.com 51
  52. WebVisions 2008 Target.com Very nice! 52
  53. WebVisions 2008 Target.com Not bad, could be a little more refined. 53
  54. WebVisions 2008 Target.com Excellent work but clean up that whitespace. 54
  55. WebVisions 2008 Target.com Using pop-ups here is not such a good idea. 55
  56. WebVisions 2008 Target.com Great work! 56
  57. WebVisions 2008 Some of the key problems: • Restricting Features Technology and features should never limit or restrict users and systems from accessing them • Simplify Navigation The amount of options and paths in a navigation should never overwhelm the user • Design Refinement When enough changes occur in a page its important to look at the design and consider redesigning or tweaking the design when needed 57
  58. WebVisions 2008 Toyota.com 58
  59. WebVisions 2008 Toyota.com 59
  60. WebVisions 2008 Toyota.com Well done, good visuals! 60
  61. WebVisions 2008 Toyota.com Pretty good execution tho a bit gratuitous. 61
  62. WebVisions 2008 Toyota.com Products as navigation, nicely done. 62
  63. WebVisions 2008 Toyota.com Good product comparison, but what about the competitors? 63
  64. WebVisions 2008 Some of the key problems: • Unnecessary Pages Don’t make users click through extra pages when they don’t need to. • Over use of technology Keep pages accessible don’t use limiting technology if its not absolutely needed. • Restricted comparison Allow users to compare not just products in a given line but all of your products side by side. 64
  65. WebVisions 2008 Twitter.com 65
  66. WebVisions 2008 Twitter.com 66
  67. WebVisions 2008 Twitter.com Where did the thread go? 67
  68. WebVisions 2008 Twitter.com They replied, but to what message? 68
  69. WebVisions 2008 Twitter.com Well this page was hard to find! 69
  70. WebVisions 2008 Twitter.com I am following them, but are they following me? 70
  71. WebVisions 2008 Some of the key problems: • Threading Site-based messaging systems should always be threaded. • My Profile Make the user profile or “my page” easy to find and globally accessible • Show relevant information Always display the information directly relevant to the task the user may be trying to accomplish on that page 71
  72. WebVisions 2008 Key Takeaways 72
  73. WebVisions 2008 Key takeaways: • Good UX involves a proper balance of needs between the user, the business, and technology • Keep things simple, don’t get in the user’s way, allow them to complete their task with ease • Don’t short change a good UX by only paying attention to only the most critical parts, the UX is made up of the sum of all parts • Good UX involves listening to users on both a qualitative and quantitive level, but don’t over do it • UX is not implemented, it is adopted as a philosophy by the entire organization 73
  74. WebVisions 2008 Thank you. Questions? nick@blueflavor.com blueflavor.com nickfinck.com 74
  75. WebVisions 2008 Audience Submissions • Twitter: nickf • AIM/iChat: dm5o3 75

Nick FinckNick Finck, 2 years ago

custom

13088 views, 117 favs, 20 embeds more stats

Nick will explore the best practices of user experi more

More Info

© All Rights Reserved

Go to text version
  • Total Views 13088
    • 11335 on SlideShare
    • 1753 from embeds
  • Comments 3
  • Favorites 117
  • Downloads 1241
Most viewed embeds
  • 1313 views on http://komunitasweb.com
  • 202 views on http://uxfactory.com
  • 76 views on http://www.uxfactory.com
  • 50 views on http://www.usability.by
  • 31 views on http://nickfinck.com

more

All embeds
  • 1313 views on http://komunitasweb.com
  • 202 views on http://uxfactory.com
  • 76 views on http://www.uxfactory.com
  • 50 views on http://www.usability.by
  • 31 views on http://nickfinck.com
  • 30 views on http://www.hanrss.com
  • 20 views on http://www.jaykay.pe.kr
  • 10 views on http://givemecake.dev-work.com
  • 5 views on http://www.userfree.cn
  • 3 views on file://
  • 2 views on http://xss.yandex.net
  • 2 views on http://jaykay.pe.kr
  • 2 views on http://uxfactory.tistory.com
  • 1 views on http://static.slideshare.net
  • 1 views on http://silveryu.tumblr.com
  • 1 views on http://mail74.paran.com
  • 1 views on http://blog.naver.com
  • 1 views on http://surf.googlemashups.com
  • 1 views on http://blogpolls.net
  • 1 views on http://localhost

less

Flagged as inappropriate Flag as inappropriate
Flag as innappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel

Categories

Tags

more

Groups / Events

Search
RSS Feed
What's new?

© 2009 SlideShare Inc. All Rights Reserved