Designing Intuitive SharePoint Sites: The Science of "Easy to Use"

8,919 views

Published on

Updated slide deck for SharePoint Saturday NYC 2012

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

No Downloads
Views
Total views
8,919
On SlideShare
0
From Embeds
0
Number of Embeds
470
Actions
Shares
0
Downloads
106
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Designing Intuitive SharePoint Sites: The Science of "Easy to Use"

  1. How to Make a SharePointSite IntuitiveThe Science of “Easy-to-Use”Presented by Marcy KellarSharePoint Saturday New York City #SPSNYC
  2. Your Speaker: Marcy Kellar • SharePoint Solution Architect at Perficient • Co-author of Beginning SharePoint Designer 2010 (Wrox, October 2010) • Professor, Art Institute, Intro to User Centered Design” and “Usability Testing.” • Specialties include – SharePoint – Over 6 years experience – User experience design (UX) – SharePoint Branding and UI customization – Information architecture – Web content management Marcy Kellar – usability testing Twitter: @marcykellar Blog: http://thesharepointmuse.com Linkedin: http://linkedin.com/in/marcykellar
  3. What You Will Learn Today• How to articulate and define “easy-to-use” (and how to measure it)• Why your users do what they do• Fundamentals and best practices in usability• How to take advantage of current web conventions and patterns• The relationship between “easy-to-use”, psychology and user adoption
  4. 3 Things Must Be Defined For a Site ToBe “Easy To Use”
  5. This Sink Should Be Easy to UseSink, 33rd floor, Hard Rock Hotel, Chicago April 2012
  6. Define the User to make it “Easy to Use”Sink, 33rd floor, Hard Rock Hotel, Chicago April 2012
  7. Define the TaskPhoto Courtesy icanhascheezburger.com
  8. Defining Metrics• What are you measuring? – Time to Task? – Completion? – User Satisfaction?• Be Specific – % – Seconds• How will you test? – Feedback – Survey – Logs – Usability Testing
  9. USABILITYUsability is a quality attribute that assesses how easy user interfaces are touse.
  10. First Law of Usability • Don’t Make Me THINK!! • Thought Bubbles = The Moment When User is Pulled Out of Task • Buy Steve Krug’s book, “Don’t Make Me Think”
  11. Fundamentals of Usability – The 5 E’s• Effective• Efficient• Engaging• Error Tolerant• Easy to LearnPhoto: Courtesy of http://commons.wikimedia.org/wiki/Image:Elephant_side-view_Kruger.jpg
  12. Fundamentals of Usability – The 5 E’sEffectiveness – Did you do what you said you were going todo?Efficiency ISO 9241 defines efficiency as the total resourcesexpended in a task.Engaging -An interface is engaging if it is pleasant andsatisfying to use.Errors - Make it difficult to take incorrect actions. Make it difficultto take invalid actions.Easy to Learn – This one is the part people spend too muchtime focusing on. So if your users have to think – make themonly think one time. Easy to learn can still be usable.http://www.wqusability.com/articles/more-than-ease-of-use.html
  13. Testing Those Metrics• Qualitative – Users provide anecdotal evidence; Informal; “feedback”• Quantitative – Data. Scientific. Don’t Really Need User. (Search Fails. 404s. Logs)Photo Courtesy of Fox Broadcasting Company
  14. QUESTION:What 3 things should be defined tosuccessfully make a site “Easy to Use”
  15. Better Requirement Definitions• Efficient - "The system will improve user performance on expense tasks by 3 minutes"• Effective - "Less than 5% of the registrations will have errors, omissions or inconsistencies requiring a follow-up contact by the staff."• Engaging - "At least 80% of employees will express comfort with using the online system rather than visiting the HR office."• Error Tolerant – "The system will validate all housing, meal and tutorial choices and allow the user to confirm pricing for these options before completing the registration."• Easy to Learn – "Users will be able to successfully complete a benefits calculation without needing any external instruction or help screens."http://www.wqusability.com/articles/more-than-ease-of-use.html
  16. Better Requirement Definitions for“Easy to Use”• Authors will be able to upload content daily without complaint• Content authors will report no more than 2 errors per month with content uploads• Email Servers will reduce load by 50%• Users will be able to complete expense reports 100% of attempts.• Users will be able to complete expense reports without errors after receiving training.
  17. HOW USERS REALLY USETHE WEB
  18. What You Design For… Steve Krug, Don’t Make Me Think: A Common Sense Approach to Web Usability
  19. The Reality… Steve Krug, Don’t Make Me Think: A Common Sense Approach to Web Usability
  20. Questions Users Ask• What type of site is this?• Have I experienced a site like this before?• Have I been to this site before?• Where am I?• Where have I been?
  21. Questions Users Ask• What type of site is this?• Have I experienced a site like this before?• Have I been to this site before?• Where am I?• Where have I been? The answers to these questions are generally first conveyed to the user through visual design.
  22. Intuitive =Readily learned or understood
  23. Defining the Intuitive Factor What Your Users What You Want Already Know Your Users To Do Current Target Knowledge Knowledge
  24. Defining the Intuitive Factor What Your Users What You Want Already Know Your Users To Do GAP Current Target Knowledge Knowledge
  25. Intuitive Sites• Intuitiveness is based on the user’s current knowledge• Design around users expectations• Learn Design Patterns• Follow Visual Design Best Practices• Be Consistent
  26. Get Inside Users MindsPhoto Courtesy iStock
  27. “If I had asked people what theywanted, they would have said fasterhorses.” Henry Ford
  28. Users spend most of their time on other sites Jakobs Law of the Web User Experience
  29. What Users Expect: ConventionsFound at Universal Usability Guidelines
  30. Users don’t like to feel dum b ~Marcy Kellar and basic general psychology
  31. Discussion/Whiteboard
  32. “We find that people quickly evaluate a site by visual design alone.” ~ Stanford Guidelines for Web Credibility,
  33. Visual Design Isnt AboutMaking Things “Pretty”
  34. Visual DesignCommunicates
  35. The Presentation Ecosystem • Educate users • Maintain consistency to create • Establish relationships between a sense of place content • Effectively convey your message to your audience • Guide users through actions • Emotional impact • Focus user attention • Make organizational systems clear • Engage and invite • Give sites a unique personality • Provide situational awareness Slide Based on information created by Luke Wroblewski
  36. Purpose
  37. Mood/Emotion
  38. Brand
  39. Action/State
  40. Orientation
  41. Visual Design Communicates• Relationships• Importance• Relevance
  42. Organizes Information
  43. Conveys Relationships
  44. 1. Clear Visual Hierarchy 2. Unclear Visual Hierarchy Provides Visual Hierarchy
  45. Take Aways• “Easy to Use” is not a good enough definition to make it so• Usability must be considered at the beginning of a project• Usability metrics can be defined by anecdotes or data• To build something intuitive means understanding how users think and what they expect• Anyone can make a SharePoint site easy to use by considering the user, task and defining how it will be measured.• Users adopt what is easy and engaging• If you don’t have user information follow web conventions for where to place items, follow visual design guidelines and consider usability• Visual design communicates many things to the user before one word is read
  46. Questions?
  47. Where To Find Me• Twitter: @marcykellar• Blog: http://thesharepointmuse.com• Linkedin: http://linkedin.com/in/marcykellar
  48. Resources• useit.com • 10 Useful Usability Findings and Guidelines• boxesandarrows.com • 20 Do’s and Don’ts of Effective Web Design• uxmatters.com • Usability – More than Ease of Use• uxmag.com • http://designingwebinterfaces.com/• Usability.gov • Gestalt Principles of Design• Usability.net • The Gestalt Principle: Design Theory for Web Designers• Usability Professional’s Association• Universal Usability Guidelines• Standard Web Components
  49. Resources: Design Patterns• http://patternry.com• http://ui-patterns.com• http://mobile-patterns.com• QUINCE: X Patterns Explorer• Interaction Design Pattern Library• Pattern Tap• http://designingsocialinterfaces.com/patterns/

×