UX: What Not to Do   Common user experience mistakes              May 22nd, 2012
Who are weRob Surrency                     Max MinerUser Experience Designer, AKQA   Associate User Experience Designer, A...
What is User Experience?                           May 22nd, 2012
UX designers work to createexperiences that are “useful,usable, desirable, anddifferentiated.”                            ...
What not to do
1.0   Don’t make      me think
Example          May 22nd, 2012
1.0      Don’t make me think•	 Provide clear calls to action•	 Give easy to understand instructions•	 Keep options focused...
Example          May 22nd, 2012
Example          May 22nd, 2012
2.0   Don’t overload      content
Example          May 22nd, 2012
2.0      Don’t overload content•	Provide a clear hierarchy•	Make content easy to scan and digest•	Only show what’s needed•...
Example          May 22nd, 2012
3.0   Don’t confuse      the navigation
Example          May 22nd, 2012
3.0      Don’t confuse the navigation•	 Make labels clear and distinct•	 Limit the number of navigational items•	 Structur...
Example          May 22nd, 2012
Example          May 22nd, 2012
4.0   Don’t complicate      workflows
4.0      Don’t complicate workflows•	 Limit the number of steps•	 Show the steps•	 Indicate user progress•	 Make it easy t...
Example          May 22nd, 2012
Example          May 22nd, 2012
5.0   Don’t forget      user feedback
Example          May 22nd, 2012
5.0      Don’t forget user feedback•	 Always provide users a way to give feedback•	 Make it persistent and easy to access•...
Example          May 22nd, 2012
Example          May 22nd, 2012
6.0   Don’t hide Help      & Contact
6.0      Don’t hide Help & Contact•	 Provide multiple help & contact calls-to-action•	 Make them persistent and easy to fi...
Example          May 22nd, 2012
Example          May 22nd, 2012
7.0   Don’t deceive      your users
Example          May 22nd, 2012
7.0      Don’t deceive your users•	 Be ethical - don’t use ‘dark patterns’•	 Be transparent•	 Explain why user information...
Example          May 22nd, 2012
Example          May 22nd, 2012
8.0   Don’t forget      design basics
Example          May 22nd, 2012
8.0      Don’t forget design basics•	 Structure your design with grids•	 Know your color theory•	 Design with affordances•...
Example          May 22nd, 2012
Example          May 22nd, 2012
9.0   Don’t overuse      features
Example          May 22nd, 2012
9.0      Don’t overuse features•	 ‘Flashy’ doesn’t always mean functional•	 Define the end goal•	 Make sure each feature h...
Example          May 22nd, 2012
UX: What not to do                            RecapDon’t...1. Make me think                    6. Hide help & contact2. Ov...
Workshop
The Set Up    10 Groups3 People per group                     May 22nd, 2012
The Task:Now, knowing what not to do -how would you improve these       experiences?                           May 22nd, 2...
The Scenarios:1. eBay product detail page       (groups 1 & 2)2. Hulu video page   (groups 3 & 4)3.  myspace profile page ...
Questions?             May 22nd, 2012
Thank You.Rob Surrency                     Max MinerUser Experience Designer, AKQA   Associate User Experience Designer, A...
Upcoming SlideShare
Loading in …5
×

UX: What Not to Do

1,372 views

Published on

5/22/12 SkillShare Class

Published in: Technology, Business
  • Be the first to comment

  • Be the first to like this

UX: What Not to Do

  1. 1. UX: What Not to Do Common user experience mistakes May 22nd, 2012
  2. 2. Who are weRob Surrency Max MinerUser Experience Designer, AKQA Associate User Experience Designer, AKQA@robsurrency @MxMnrhello@rsurrency.com Maxwell.Miner@gmail.com May 22nd, 2012
  3. 3. What is User Experience? May 22nd, 2012
  4. 4. UX designers work to createexperiences that are “useful,usable, desirable, anddifferentiated.” May 22nd, 2012
  5. 5. What not to do
  6. 6. 1.0 Don’t make me think
  7. 7. Example May 22nd, 2012
  8. 8. 1.0 Don’t make me think• Provide clear calls to action• Give easy to understand instructions• Keep options focused• Do the heavy lifting for the user May 22nd, 2012
  9. 9. Example May 22nd, 2012
  10. 10. Example May 22nd, 2012
  11. 11. 2.0 Don’t overload content
  12. 12. Example May 22nd, 2012
  13. 13. 2.0 Don’t overload content• Provide a clear hierarchy• Make content easy to scan and digest• Only show what’s needed• Let the users have control May 22nd, 2012
  14. 14. Example May 22nd, 2012
  15. 15. 3.0 Don’t confuse the navigation
  16. 16. Example May 22nd, 2012
  17. 17. 3.0 Don’t confuse the navigation• Make labels clear and distinct• Limit the number of navigational items• Structure navigation based on the user’s needs• Keep interactions subtle May 22nd, 2012
  18. 18. Example May 22nd, 2012
  19. 19. Example May 22nd, 2012
  20. 20. 4.0 Don’t complicate workflows
  21. 21. 4.0 Don’t complicate workflows• Limit the number of steps• Show the steps• Indicate user progress• Make it easy to go back May 22nd, 2012
  22. 22. Example May 22nd, 2012
  23. 23. Example May 22nd, 2012
  24. 24. 5.0 Don’t forget user feedback
  25. 25. Example May 22nd, 2012
  26. 26. 5.0 Don’t forget user feedback• Always provide users a way to give feedback• Make it persistent and easy to access• Be proactive - ask for it• Listen and respond May 22nd, 2012
  27. 27. Example May 22nd, 2012
  28. 28. Example May 22nd, 2012
  29. 29. 6.0 Don’t hide Help & Contact
  30. 30. 6.0 Don’t hide Help & Contact• Provide multiple help & contact calls-to-action• Make them persistent and easy to find• Provide a robust support center• Give several ways to get in touch May 22nd, 2012
  31. 31. Example May 22nd, 2012
  32. 32. Example May 22nd, 2012
  33. 33. 7.0 Don’t deceive your users
  34. 34. Example May 22nd, 2012
  35. 35. 7.0 Don’t deceive your users• Be ethical - don’t use ‘dark patterns’• Be transparent• Explain why user information is needed• Remember the Golden Rule May 22nd, 2012
  36. 36. Example May 22nd, 2012
  37. 37. Example May 22nd, 2012
  38. 38. 8.0 Don’t forget design basics
  39. 39. Example May 22nd, 2012
  40. 40. 8.0 Don’t forget design basics• Structure your design with grids• Know your color theory• Design with affordances• Take care with your typography May 22nd, 2012
  41. 41. Example May 22nd, 2012
  42. 42. Example May 22nd, 2012
  43. 43. 9.0 Don’t overuse features
  44. 44. Example May 22nd, 2012
  45. 45. 9.0 Don’t overuse features• ‘Flashy’ doesn’t always mean functional• Define the end goal• Make sure each feature has a purpose• Understand each feature and it’s implications May 22nd, 2012
  46. 46. Example May 22nd, 2012
  47. 47. UX: What not to do RecapDon’t...1. Make me think 6. Hide help & contact2. Overload content 7. Deceive your users3. Confuse the navigation 8. Forget design basics4. Complicate workflows 9. Overuse features5. Forget user feedback May 22nd, 2012
  48. 48. Workshop
  49. 49. The Set Up 10 Groups3 People per group May 22nd, 2012
  50. 50. The Task:Now, knowing what not to do -how would you improve these experiences? May 22nd, 2012
  51. 51. The Scenarios:1. eBay product detail page (groups 1 & 2)2. Hulu video page (groups 3 & 4)3. myspace profile page (groups 5 & 6)4. Huffington Post home page (groups 7 & 8)5. Facebook search (groups 9 & 10) May 22nd, 2012
  52. 52. Questions? May 22nd, 2012
  53. 53. Thank You.Rob Surrency Max MinerUser Experience Designer, AKQA Associate User Experience Designer, AKQA@robsurrency @MxMnrhello@rsurrency.com Maxwell.Miner@gmail.com May 22nd, 2012

×