User Focused Design
Download
Report
Transcript User Focused Design
Skolen på internettet, Nyborg
User Focused Design
April 24, 2003
Darlene Fichter
University of Saskatchewan
Overview
What is user-centered design?
Elements of user experience
User centered-design methodology
Stages of development
Techniques for involving the user
Usability testing
User-centered design
User-centered design is defined as
“the practice of creating engaging,
efficient user experiences.”
Jesse James Garrett, The Elements of User
Experience: User-Centered Design for the
Web, 2003.
User experience
Jesse Garret points out that the user experiences
the "totality of the web site" - not one piece
separate from another. We rise and fall together.”
Visible
Interface
Content,
Architecture and
Tools
Invisible
Web site layers
Web site visitor – (knowledge) exchange
Surface – visual design
Skeleton – Information architecture,
navigation, user experience
Scope – functional requirements, content
Business strategy – user needs, objectives
Layers
Web site visitor – (knowledge) exchange
Surface – visual design
Skeleton – Information architecture,
navigation, user experience
Scope – functional requirements, content
Business strategy – user needs, objectives
From layers to usability
Layers are useful to show the
various stages in planning
But it’s not enough to do all the
steps; we have to focus on users
and usability
Usability – relatively new field that
has techniques and tests for
determining what works and what
doesn’t
Where does usability start?
It’s all about the visitor.
What is usability?
Ease of use
Ease of learning
Fitness for purpose
An effective
product
Design for the visitor
Be
Be
Be
Be
Be
Be
Be
intuitive
familiar
consistent
appropriate
functional
polite
supportive
School web site
What is the purpose of the site?
What are your goals and objectives?
What are some goals?
Visitors to school web sites
Who are your visitors?
Segment your audience to help plan
content and consider needs
Which groups are the most
important? Why?
Example
Determining visitor needs
Talk to your users
Students, parents, teachers, community
Focus groups
User surveys
Formal needs assessment
Already have a web site?
Usage reports
Questions
Web log analysis
Search log analysis
Understanding visitor needs
Know their mental model
Methods
Peer analysis
Content clustering
Category prediction
Cognitive
walkthrough
User scenarios
One of the simplest & best techniques is
user scenarios
Invent “typical users”; give them a name,
characteristics, and a backdrop
Site visit plan
As each “visitor” comes to the site,
you describe in ideal terms what
would happen.
What words are they looking for on the
screen?
What do they want to happen next?
Accessible design
Visual
Physical/motor skills
Hearing
Learning disabilities
Accessibility guidelines
Use clear, direct language
Provide alternative content (audio/visual)
Don’t rely on any one mode exclusively
Use style sheets for form, not HTML
Allow user control of supplemental
technologies
Plug-ins and java applets
Ability to stop moving text, blinking, autoupdating
Content – inventory
Audience
needs?
Site goals?
Page for each classroom
Page for each teacher
Contact information
School floor plan
List everything you’d
like to have on your
site
Tip: Use a
spreadsheet
Calendar of events
Student art work
Organize your content
Typical site organization problems:
Information overload
Jargon
Mental models
Insider – organizational chart
Metaphors
“Shopping cart” for buying on
line
Usability research
Users find information easier if
Menus or lists are in columns not rows
Arranged categorical, not alphabetical
Set the priority order
Most used to least used
If there is both a top menu and left hand
side menu, only the left side will be used
Creating categories & structures
that work for users
Card sorting
List all of the content on the web site on
index cards
Ask people to group them and assign
labels
Typical organizational
structures
Library Site
By topic
Hybrid
Art
Biology
History
Teachers
Students
By task
Find a book
Find a article
Art Links
Biology
History
Especially for
By audience
Teachers
Students
Contact Us
Alphabetic
Books
Magazines
Maps
Examples
What is the organization structure?
Topic
Audience
Task
Alphabetical
Hybrid
Are there obvious chunks of
“content”?
Goal of navigation
Reduce the cognitive effort on the part of
the user by following a pattern the user
easily understands
Navigation Tips:
Putting navigation (menus) in a place
where the user looks
Cluster related items
Use the words on the labels that your
users know and recognize
Use preference testing for
difficult labels
Preference testing is also
called “cookie” testing
Focus in on troubling labels
Request book from another
library
Interlibrary Loan
Request forms
Books from other libraries
Home > Find Books > Search by Author
Establish a sense of place
Consistent logos
and banners
Consistent
terminology
Color coding
Bread crumb
navigation
Home > Grades > Grade 8 > Science
Visual design
The visual design should enhance
and improve the success rate, not
detract
Test ideas early
Create mockups of just the main
page
test them
Mockup
How do you know it works?
Task testing with users
Task based testing
Test participants:
Carry out specific tasks
Talk out loud as they use the site
Observers
Record the participants path, time on task,
comments
Observe
Time on task
Number of errors
Difficulty in
Navigation
Understanding
site structure
User satisfaction
Good web sites “evolve”
from bad sites
Continuous improvement
Not a print publication
Dynamic
Keep improving it
Evolution not revolution!
User focused design by stage
Goals and purpose
Audience
Content & organization
Navigation & interactivity
Page content (writing for the web)
Visual design prototypes
Live site feedback & evaluation
Final thoughts
Redesign should be an on-going
process
Must be based on user feedback
Supplement this with observations from
multiple sources
Never rely on a single perspective for
making adjustments
Be especially wary of using your own
perspective as a filter for the user’s
needs
Best web site
www.usability.gov
What font should I use?
Can I scroll?
What about mouseovers?
What about pop down menus?
Recommended books
Site organization
Information
Architecture for the
World Wide Web, 1st
Edition”
More books
Usability & User Experience
Finding out more
Check out my Online columns
on web design usability:
www.findarticles.com
More presentations on web
design:
library.usask.ca/~fichter
Thank you
Questions?
Darlene Fichter
library.usask.ca/~fichter/