User Experience and WordPress

886 views
722 views

Published on

Presentation at WordCamp Louisville, 2011

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
886
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
12
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

User Experience and WordPress

  1. 1. and UX Anne Miles www.redtoadmedia.com @redtoadmedia +Anne Miles
  2. 2. What creates good UX?-Peter Morvillehttp://semanticstudios.com/publications/semantics/000029.php
  3. 3. A Good UX
  4. 4. Bad UX
  5. 5. UX on the web is not … UI - user interface design or Usability - ease and clarity of use for a set of controls orVisual Design -making an impact
  6. 6. Visual Design: Color
  7. 7. Visual Design: Typography
  8. 8. Visual Design: Hierarchy
  9. 9. Visual Design: Balance
  10. 10. Visual Design: Rhythm
  11. 11. Visual Design: Emphasis
  12. 12. Usability/UI Design• Consistency • Error Handling/Prevention• Metaphors • Forgiveness• Simplicity • Error recovery • Workload Reduction• Visibility • Supportive automation• Feedback • Free cognitive resources• Structure for high-level tasks• Sequencing.• Help
  13. 13. Visual Design + Bad UI = Bad UX
  14. 14. Visual Design + Bad Usability = Bad UX
  15. 15. Good Usability + Bad Visual Design= Bad UX
  16. 16. Simple UI + Poor Usability=Bad UX
  17. 17. Usability vs UX
  18. 18. UX requires Context
  19. 19. Good UX Requires Clear Goals
  20. 20. Where is the “Friends” Button?
  21. 21. UX = GestaltUsability + Interface + Aesthetics that are appropriate to their context
  22. 22. User ExperienceGood UX means users are happy, and makes businesses more successful. Clarity Utility UX Clear Context Goals Quality Thoughtfulness Charm Content
  23. 23. UX is theestablishment of a philosophy of how to treat people-Whitney Hess
  24. 24. How to Improve UX with your WP Site (one philosophy) 1.Know your users and anticipate their needs. 2.Be responsive 3.Provide feedback at points of interaction 4.Create opportunities for delight 5.Promote clarity 6.Simplify 7.Be appropriate & responsible
  25. 25. Know your Users
  26. 26. Know yourUsers (Clever Twitter integration)
  27. 27. Be ResponsiveAsk questionsListenDon’t barrage with huge survey or pop-ups, ask nicely.Add in sidebar or at bottom of postsUp to 3 questions.Use Twitter/FB to engageDo A/B tests
  28. 28. User Testing
  29. 29. Be ResponsiveCustom Search Response Phrase,custom comments phrases
  30. 30. Promote Clarity (Hierarchy meeting Need)
  31. 31. Provide Feedback at points ofInteraction
  32. 32. Provide Feedback at points ofInteraction
  33. 33. Create Opportunities for Delight (appropriate & responsible!)
  34. 34. Create Opportunities for Delight (appropriate & responsible!) *not a WordPress site, Hubspot.com
  35. 35. Simplify
  36. 36. Be appropriate and responsible:Choose an appropriate THEME PATTERNto match information scent/user needs Blog Magazine Portfolio
  37. 37. Blog Chronologically Driven No landing pages without hacking it Do your users care about the latest posts?
  38. 38. Magazine Landing/ Category Pages More Images Sidebar widgets Invite repeat visits by conveying affordances
  39. 39. Portfolio List driven Highly visual Good for e-commerce or those not content-driven (showcases)
  40. 40. ResourcesPlug-ins:Search Suggesthttp://yoast.com/wordpress/search-suggest/Search Excerpthttp://scott.yang.id.au/code/search-excerpt/#toc-abstractBreadcrumbshttp://mtekk.us/code/breadcrumb-navxt/Hacks:Change “Leave a Reply”http://wordpress.org/support/topic/how-to-change-wording-of-leave-a-replyCustom 404http://www.1stwebdesigner.com/wordpress/how-to-create-a-custom-error-404-page-for-wordpress/
  41. 41. ResourcesTypography:Font Squirrel @font-face kitshttp://www.fontsquirrel.com/Google web fontshttp://www.google.com/webfontsColor:http://kuler.adobe.com/Themes:http://themeforest.net/ Use original photographyUX Resources: whenever possible.Whitney Hesshttp://whitneyhess.com/blog/UX Boothhttp://www.uxbooth.com/
  42. 42. Anne Milesowner and Toad-in-Chief atRed Toad MediaFormer board member ofLouisville Women in TechnologyFormer President of Women in Networking 2 (WIN2).Just published a contribution for Smashing Magazine,one of the top web design blogs in the world.
  43. 43. Let’s build a better web.Thank you.You may download this presentation athttp://www.redtoadmedia.com/goodies.php

×