• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Designing With Usability In Mind
 

Designing With Usability In Mind

on

  • 9,627 views

 

Statistics

Views

Total Views
9,627
Views on SlideShare
8,583
Embed Views
1,044

Actions

Likes
12
Downloads
0
Comments
0

5 Embeds 1,044

https://mycourses.tstc.edu 932
http://mycourses.tstc.edu 88
http://www.slideshare.net 13
http://tstc.mrooms.net 7
https://cenergy.backpackit.com 4

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Francis Drucker

Designing With Usability In Mind Designing With Usability In Mind Presentation Transcript

  • Cenergy Interactive: Designing with Usability in Mind
  • What is usability?
    • Usability is the measure of the quality of a user’s experience when interacting with a product.
  • The 5 E’s Usability Effective Easy to Learn Error Tolerant Engaging Efficient [1] “Using the 5 E’s to Understand Users” Whitney Quesenbery  2002-2004
  • how the heck do we do all that?
  • Define Objectives
    • what are the goals of the site?
    • will we be able to measure effectiveness?
    • what do we want the users to do?
  • Know the User
    • Know thy user!
    • “ Designers who spend more time thinking about the users are the ones that end up with more usable designs.”
      • someone smart? (I forgot)
  • Who is your primary audience?
  • Audiences have different needs
  • A design for all
  • Gathering Data: Field Research
    • Conduct 1 on 1 interviews with users in target group
    • User environment can yield important clues
    • Use a consistent interview team
    • Don’t ask straight out….analyze!
    • Use research that’s available
  • Personas
    • Model of a typical user, a “common case”
    • Based on observed behavior patterns and objectives
    • Represent the needs of many
  • Why Personas?
    • Determine what a site should do and how it should behave
    • Communicate with stakeholders, other MKT companies, clients
    • Measure a design’s effectiveness
    • Get people committed to a design
  • Developing a Persona
    • Identify variables for the common case
      • - map interviewees to variables
    • Identify characteristics and goals
    • Develop narrative
  • Map against variables Tech savvy Tech Unskilled High Brand Consciousness Low Brand Consciousness Info Only Entertainment User 1,3,4 User 2 User 1, 2, 3 User 4 User 1, 2 User 4 User 3
  • What’s next?
    • Defining a structure/navigation based on that user.
  • Why is navigation important?
    • Navigation is a tool for the user
      • - Find information quickly
      • - Move between tasks easily
      • - Increased confidence = better experience
    • Navigation is a tool for the brand
      • - Drive users to important tasks
  • Step 1: Identify your audience
    • Use your personas!
    • Who is your primary audience?
    • Are there secondary audiences?
  • Step 2: Gather Resources and Tasks
    • Define tasks for your primary audience
      • - Your goals research is key!
    • Collect supporting resources
      • - e.g. job postings, logo downloads, etc
  • Step 3: Choose a Grouping Strategy
    • Consider the following items. How would you group these?
  • Grouping Strategies
    • Did you pick size? Shape? How about color?
    • How do you know which one to use?
      • - Everyone does it differently!
      • - Your primary audience decides
  • Best Practices
    • Keep it SIMPLE!
    • Design for Scent by using trigger words
    • Use Seducible Moments to drive user action
    • Plan for growth
  • Navigational Hazards
    • Ignore the three-click rule
    • Search-dominance?
    • Watch for off-site links
  • What’s next?
    • Creative Design
  • A Designer’s Guidelines
    • Know thy user! “Designers who spend more time thinking about the users are the ones that end up with more usable designs.” - Jared Spool
    • Design with scent
    • Persuade the user
    • Follow these usability best practices…
  • Visual Design
    • A professional looking design: - lends credibility, builds trust - can appropriately serve the user - will match current branding initiatives
  • Content
    • “ Ultimately, users visit your website for its content. Everything else is just the backdrop" (Nielsen)
    • Not providing the content the user is seeking = ultimate failure
  • Content tips
    • Write for reader, not the client
    • Trigger words
    • Cute and clever…but clear?
    • Provide substance/positioning
    • Make it memorable
  •  
  •  
  • Content
    • “Seducible Moments” - after completing a task
    • Write for “scan-ability”…less is more
      • use shorter paragraphs
      • bulleted lists
      • highlight key words
  • Content
    • function 1st.. form 2nd..
    • Include page titles/breadcrumbs
    • 1:1 marketing
  •  
  • Interactivity/Functionality
    • Take advantage of the medium
      • - break away from a static page!
    • Engage your users
  •  
  •  
  •  
  • Page Layout
    • Visual Hierarchy
    • Avoid Clutter!
  •  
  •  
  •  
  • Visual Design: Be Consistent
    • User feels at ease
    • Find things quicker and confidently
    • Placement & function of nav and elements
      • - fonts (type, size, style)
  •  
  •  
  •  
  • Visual Design: Consistency
    • Inconsistency creates more “work”
    • Frustration: gets lost or leaves
    • “ Unprofessional feel”: seen as lower quality brand
    • “ Patchwork Quilt”: am I on the same site?
  • Visual Design: Imagery
    • Represent your brand accurately
    • Be unique to your brand
  • Visual Design: Imagery
    • Common Mistakes: - Imagery that appears “posed”
  •  
  • Visual Design: Imagery
    • Common mistakes: - Imagery that appears “posed” - Imagery that’s cliché in the specific brand - Dated imagery (hair/fashion/bldgs) - Use of stock imagery
  •  
  •  
  • Performance
    • QA all platforms and browsers
    • Usability test
    • Usability Testing
  • The 5 E’s Usability Effective Easy to Learn Error Tolerant Engaging Efficient [1] “Using the 5 E’s to Understand Users” Whitney Quesenbery  2002-2004
  • Why test?
    • Find out if it’s successful
    • Designers are “too close” to product
    • You’ll find out eventually .. unhappy client
  • Some testing better than none
    • “ 3 to 5 participants get you 80-90% of major problems. 10 to 12 participants get you 70 - 80% of minor problems” - Virzi, 1992
  • Thank you
    • Questions?