Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Web Usability on a Budget (Øredev 2014)

Af7acd01448753af3dfd648c3f5ea287?s=47 timgthomas
November 05, 2014

Web Usability on a Budget (Øredev 2014)

No budget to hire a number of usability experts? Crafting a great user experience is easier than you think! In this session, you'll learn some easy tricks to make your sites more approachable, discover ways to help develop an emotional connection between your apps and your users, and see some tools that can assist you with planning and designing your next masterpiece of usability.

Af7acd01448753af3dfd648c3f5ea287?s=128

timgthomas

November 05, 2014
Tweet

Transcript

  1. Web Usability on a Budget Photo Source: flickr user frankenstein

  2. Tim G. Thomas Photo Source: flickr user frankenstein

  3. @timgthomas timgthomas.com Photo Source: flickr user frankenstein

  4. frogdesign.com

  5. Austin, Texas Photo Source: flickr user stuseeger

  6. #budgetux Photo Source: flickr user frankenstein

  7. What is “usability”? Photo Source: flickr user antekno

  8. What isn’t “usable”? Photo Source: flickr.com/photos/32687125@N05/

  9. Frustrating Photo Source: flickr.com/photos/32687125@N05/

  10. Intimidating Photo Source: flickr.com/photos/32687125@N05/

  11. Confusing Photo Source: flickr.com/photos/32687125@N05/

  12. Unusable Photo Source: flickr.com/photos/32687125@N05/

  13. Usability is the Opposite Photo Source: flickr user geralds_1311

  14. Pleasing Photo Source: flickr user geralds_1311

  15. Inviting Photo Source: flickr user geralds_1311

  16. Clear Photo Source: flickr user geralds_1311

  17. Seems Difficult Photo Source: flickr user eworm

  18. Large Projects Photo Source: flickr user wwarby

  19. Information Architect Photo Source: flickr user wwarby

  20. Content Strategist Photo Source: flickr user wwarby

  21. Visual Designer Photo Source: flickr user wwarby

  22. UI Designer Photo Source: flickr user wwarby

  23. Interaction Designer Photo Source: flickr user wwarby

  24. ...

  25. Large Projects > Design Disciplines Photo Source: flickr user wwarby

  26. Small Projects Photo Source: flickr user folkbird

  27. Developer Photo Source: flickr user folkbird

  28. Software Developer Photo Source: flickr user folkbird

  29. Web Developer Photo Source: flickr user folkbird

  30. Large Projects > Design Disciplines Photo Source: flickr user wwarby

  31. Small Projects > Design Principles Photo Source: flickr user folkbird

  32. Procedures Photo Source: flickr user eworm

  33. Usability Principles Photo Source: http://www.flickr.com/photos/39877441@N05/

  34. Focus on User Goals evernote.com

  35. evernote.com

  36. evernote.com

  37. Use Your Users’ Language neonmob.com

  38. Ubiquitous Language neonmob.com

  39. neonmob.com

  40. neonmob.com

  41. neonmob.com

  42. neonmob.com

  43. neonmob.com

  44. Follow Conventions stripe.com

  45. stripe.com

  46. stripe.com

  47. Minimize the Cost of Failure gmail.com

  48. gmail.com

  49. github.com

  50. github.com

  51. github.com

  52. Photo Source: flickr user joshpuetz

  53. Give Emphasis firefox.com

  54. Provide Affordance firefox.com

  55. firefox.com

  56. firefox.com

  57. Use Symbology manage.windowsazure.com

  58. manage.windowsazure.com

  59. manage.windowsazure.com

  60. Tools Photo Source: http://www.flickr.com/photos/75905404@N00/

  61. None
  62. wireframe.cc

  63. None
  64. facebook.github.io/origami/

  65. None
  66. foundation.zurb.com

  67. A Cup of Coffee Photo Source: flickr user djwtwo

  68. Additional Resources Photo Source: http://www.flickr.com/photos/75905404@N00/

  69. dribbble.com/tags/ux

  70. uxdesign.smashingmagazine.com

  71. None
  72. icomoon.io

  73. Usability? Photo Source: flickr user comedynose

  74. Disciplines > Principles Photo Source: flickr user comedynose

  75. Tools & Resources Photo Source: flickr user comedynose

  76. Usability! Photo Source: flickr user daijihirata

  77. www.aaronweyenberg.com/uxgenerator/

  78. Thanks for coming! Photo Source: flickr user frankenstein

  79. @timgthomas bit.ly/ore-ux-slides Photo Source: flickr user frankenstein