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.

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/
62. wireframe.cc
64. facebook.github.io/origami/
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
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