Building a Better Website:
User-Centered Design
Selma Zafar
Senior User Experience Designer
OpenRoad Communications
About me
Session Topics
•
•
•
•
•
User Centred Design
User Centred Design Methods
Introduction to Information Architecture
Information Architecture Creation
Information Architecture Evaluations
User centred design
How do we get to know
our users and their needs?
1.
2.
3.
4.
Interviews
Surveys
Observational Research
Diaries
What users say and what they do are
different
What can’t be answered
Specific Design Questions
• Should the Buy button be red or orange?
• Is it better to use a drop-down menu or a set of
radio buttons for a certain set of choices?
• Where should the Foo product line reside in the
IA?
• Is it better to have 3 levels of navigation, or
should we stick to 2 levels even if it means longer
menus?
• How should you write the Help information to
best teach people how to correctly use the
system?
Predicting use
• "Would you use (potential future) feature X?
• "How useful is feature Y?
What can be answered
•
•
•
•
What users thought of the site AFTER use
Explore general attitudes
Understand how they think about a problem
Critical incident method
The Long Interview
Grant McCracken
Mental Models
Indi Young
2. Surveys
5 Processes in Survey Design
Social
Processes
Persuasive processes
Business processes
Cognitive Process
Analytical process
5 Processes in Survey Design
1. Social: collaboration among stakeholders
2. Persuasive: getting respondents to answer the
questions
3. Business: do I have the questions and response
categories that will yield data to help us answer our
business questions
4. Cognitive: understanding about how memory and
context affect respondents answers
5. Analytic: how do I analyze and present the data
Good Survey Approaches
• Keep survey’s short and concise
• Avoid embarrassing questions (don’t ask "how
old are you?"),
• Minimize the need for personal information
• Make every question is relevant and avoid
lengthy questionnaires
• Allow users to change answers easily in online
surveys
Observational Research
Goal:
Watch people in context of their natural
environment to understand how they complete
tasks.
Things to pay attention to:
• Language: what are users calling items?
• Problem Solving: how do they work around
issues?
• Interaction with Others: when and why do they
talk to others?
• Tasks: How are they completing tasks? In what
order?
Diary Study
• Participants keep a diary, or journal, of their
interactions with a computer system, any
significant events or problems during their use
of a system, or other aspects of their working
life
What do they record?
•
•
•
•
the date and time of an event,
where they are,
information about the event of significance,
ratings about how they feel, etc.
Advantage
• Obtain information about the user's
experience over time.
• Feedback provided while the user is
interacting with the product
Disadvantage
• All information is self-reported
1.
2.
3.
4.
Interviews
Surveys
Observational Research
Diaries
Source: http://gapingvoid.com
observation
design solution
observation
conclusion
design solution
I observed X happening.
65% of survey responded Y.
I heard employees say Z during interviews.
But what does that tell us
about the world?
Observation
Many calls heard during call centre visit included common
tasks, universal in format to all employees, typically
characterized as low-stress or not time-sensitive.
Conclusion
These calls could have been answered through the intranet.
Opportunities exist to further drive call centre displacement
and encourage use of intranet channel with employees.
Design
Implication
Obtain and use call centre call-log data to further prioritize
and highlight intranet content.
Observation
Employees review their benefits information once a year
during the annual benefits adjustment period, driving a lot
of traffic to that section of the site every October.
Conclusion
Employees may be unfamiliar with improvements or
changes to process because there is no incentive to learn
them since their last time through. Employees have little
opportunity to "master" the process and feel competent.
Opportunity exists to let employees know "what's changed"
since their last time through the benefits adjustment
process.
Design
Implication
Acknowledge the infrequent time-based (temporal) aspect
of the benefits experience by focusing on design
learnability. Assume this is the user's first time through the
process, because they've likely forgotten everything from
last year.
1. Observation
2. Conclusion
3. Design Implication
Information Architecture 101:
Card Sorting
IA Challenges for Websites
• Reflects a company organization chart that
your users don’t understand
• Stale, out-dated content
• ‘Dumping Ground’ for content
• No publishing standards or style guide
Business/Context
Content
Users
CARD SORTING
“It is important to use Card Sorting for the right
reasons and the right time in the project and to
analyze the results in combination with other
inputs.”
- DONNA SPENCER 2009
Steps in a Card Sort
1.
2.
3.
4.
5.
6.
7.
Decide what you want to learn
Select the type of Card Sort (open vs closed)
Choose Suitable Content
Choose and invite participants
Conduct the sort (online or in-person)
Analyze Results
Integrate results
OPEN VS CLOSED
OPEN SORT
Vacation
Policy
Christmas
Party
Pay Days
Vacation
Policy
Vacation
request Pay Days
form
Product
Targets
Year in
Review
Meeting
Christmas
Party
Walkathon
Results
CRM
Organizati
CRM
on Chart
Project
Review
Year in
Review
Company
Meeting
News
Vacation
Human
Policy
Vacation
Resources
request Pay Days
form
CRM
Product
Organizati
Targets
CRM
Projects
on Chart
Project
Review
Walkathon
Events
Results
Christmas
Party
CRM
Organizati
on Chart
Vacation
request
CRM
form
Year in
Project
Review
Review
Product
Meeting
Walkathon
Targets
Results
Company
News
CLOSED SORT
Human
Resources
Projects
Departments
Christmas Year in
Party
Review
Company
Walkathon Meeting
News
Results
Vacation
Human
Policy
Vacation
Resources
request Pay Days
form
CRM
Project
Product
Projects
Review
Targets
Departments
CRM
Organizati
on Chart
Selecting Content
Do’s
• 30 – 100 Cards
• Select content that
can be grouped
• Select terms and
concepts that mean
something to users
Don’ts
• More than 100 cards
• Mix functionality and
content
• Include both detailed
and broad content
Analysis
Look at
• What groups were created
• Where the cards were placed
• What terms were used for labels
• Organization scheme used
• Whether people created accurate or
inaccurate groups
Category Characteristics
• Users understand the categories & can find
information
• Content fits well in categories with not too
much overlap
• Category names match users mental models
Online Tools
• Optimal Workshop (www.optimalworkshop.com)
• Card Sorting
Information Architecture 101:
Task Testing
What it is good for
1.
2.
3.
4.
5.
Improving the organization of your site
Improving top down navigation
Improving your structure terminology
Isolating structure itself
Focuses on content - No visual design; page
layout, content design
6. Getting user data early (before site is built)
7. Cheap and quick to try out ideas
What it is not
1.
2.
3.
4.
5.
6.
Not testing other navigation routes
Not testing feature links, see also links
Not testing search
Not testing page layout
Not testing visual design
Not a substitute for real-site user testing –
usability testing with visual design etc
7. Not a replacement for card sorting
Task Based Testing
#60
The information in this presentation is confidential. Please do not redistribute. Thanks!
Define Your Goals
Planning
What are you testing?
Why are you testing?
Who are you testing?
When are you testing?
Selecting Tasks
General
• applicable to all users
• Represent the variety of use cases
• Reflect the main goals of your website
e.g.
• Contact Information
• Corporate Information
• News, blogs
Writing Tasks
1. Use real scenarios to make task believable
2. Don’t use the name of the location of the
information in the task.
3. Keep it simple and to the point – don’t
embellish with a whole story.
4. Read the task out loud to someone first! If
they don’t understand it, then rewrite it.
Each Task Must…
1.
2.
3.
4.
Be specific
Be clearly worded
Use the customer’s language
Be concise
Selecting Participants
How many users to test?
• 30 minimum (ideal 50 – 100)
• Multiple user groups – 25+ per group
• 10 tasks maximum
Analysis
Summary
User centred design
Never ask someone what they wants,
work to understand what they do.
1.
2.
3.
4.
Interviews
Surveys
Observational Research
Diaries
observation
conclusion
design solution
CARD SORTING
Task Based Testing
#77
The information in this presentation is confidential. Please do not redistribute. Thanks!
Selma Zafar
selma@openroad.ca
twitter.com/selmaz