Usability Overview
Jeff Offutt
https://www.cs.gmu.edu/~offutt/
SWE 432
Design and Implementation of
Software for the Web
Usability Overview
Working title
Why we hate computers
And what we can do about them
In mature engineering fields, customers choose products
they can use without help
• Can I drive the car without extra training?
• Can I use this web application without being taught?
• Can I program my DVR without the manual?
• Can I use my stopwatch without help?
1 July 2016
© Offutt
2
What Will You Learn About
Usability ?
• How to break down the essential characteristics of usable
software from an analytical viewpoint
• Engineering principles for designing and building software
interfaces that are
• Fast to learn
• Speedy to use
• Avoid user errors
• How to recognize and articulate the difference between
“this program sucks” and “I can improve this program by
changing X,Y, and Z”
• Life-long habits for engineering usable products
1 July 2016
© Offutt
3
Usability Engineering
• This is a design class
• Engineers tend to focus on functionality
– But slick features are worthless if users cannot use
them
• VCR programming
– Programming was impossible with the original
interfaces
– It was easy with later models
– But why use the intimidating word “programming”?
1 July 2016
© Offutt
4
User Friendly
• The term user friendly is over-used and under-defined
– What is “friendly” to one person may be trite, tedious, or
confusing to another
• “User appropriate” is a much more meaningful term
– But we have to know the user
Never use the term “user friendly” again!
• Part 1 of this class is largely about communication
– Between software and people
1 July 2016
© Offutt
5
Sad Example
• Blackboard -> Courses
• Where is my current course?
Courses List
Courses where you are: Instructor
201310. 12460 SWE-205-001 (Spring 2013)
201310.13636 CS-990-001 (Spring 2013) (not currently
available)
Why show me
…
Where are my
something not
current courses?
available?
1 July 2016
© Offutt
6
Software Design
•
Inside-out
1. Develop a system
2. Then add the interface
•
Outside-in
1. Develop the interface
2. Then build the system to support it
When design decisions are made, either the
developer must conform to the user, or the user
must conform to the developer
1 July 2016
© Offutt
7
Software Design (2)
• Effective software systems could be designed inside-out
in the 1970s
• Modern systems must be designed outside-in to be
effective
• Web sites sink or swim based on the usability
Traditional computer science courses are
almost entirely inside-out!
1 July 2016
© Offutt
8
Fundamental Software Design
Principle: the 7  2 Rule
• Human’s short term memory can only hold about seven
things at a time (plus or minus 2)
• That is all we can concentrate on!
–
–
–
–
–
Sports
Books
People and organizations
Software
User interfaces
• When we get more than about 7 items, we get confused
1 July 2016
© Offutt
9
Simplicity
• An old quote :
“It’s easy to make things hard, it’s hard to make things easy”
• Or as Mark Twain said :
“It takes three weeks to prepare a good ad lib speech”
• Simple is hard!
– A good interface is a lot like a good umpire … you never notice
it’s there
• It takes talent, diligence, knowledge and skills to design
simple things
What is the secret to Apple’s success?
Keep It Simple Stupid!
1 July 2016
© Offutt
10
Shneiderman’s Measurable
Criteria
• User interface design has long been considered an art
rather than a science
– That is, decisions have been made subjectively rather than
objectively
• There has been a lot of effort to make UI design more
objective – that is, an engineering activity
• This course will teach you some of that
• The most important step was taken by Shneiderman …
1 July 2016
© Offutt
11
Shneiderman’s Measurable
Criteria (2)
1. Time to learn : The time it takes to learn some basic
level of skills
2. Speed of UI performance : Number of UI “interactions”
it takes to accomplish tasks
3. Rate of user errors : How often users make mistakes
4. Retention of skills : How well users remember how to
use the UI after not using for a time
5. Subjective satisfaction : The lack of annoying features
1 July 2016
© Offutt
12
1. Time to Learn
• With complicated UIs, the users must “plateau”
Plateau 3
additional
commands
More tasks,
more choices,
or more speed
Plateau 2
additional
commands
Plateau 1
initial
set of
commands
More tasks,
more choices,
or more speed
Ability to
complete at least
one simple task
• Well designed interfaces make
• the first plateau easy to get to
• subsequent plateaus clearly available
1 July 2016
© Offutt
13
2. Speed of UI Performance
• This is about navigating through the interface, not how
fast the software or network runs
• Interaction points are places where the users interact with
the software:
– Buttons
– Text boxes
– Commands
• Speed of UI performance is roughly the number of
interactions needed to accomplish a task
1 July 2016
© Offutt
14
2. Speed of UI Performance:
The tyranny of the mouse
• The simplest way to slow down a UI is to use the mouse
• The mouse is incredibly slow: Most users can type
between 8 to 15 keystrokes in the time it takes to move
the hand from the keyboard to the mouse
– The two activities use different muscles and parts of the brain
• Good UI designers need to reduce the number of
keyboard-to-mouse switches
1 July 2016
© Offutt
15
3. Rate of User Errors
• Users will always make mistakes
• UIs can encourage or discourage mistakes
– Consistency, instructions, navigation, …
• Consider :
– C/C++ : The lack of typing, particularly on pointers, and the complexity of
the syntax actively encourages programmers to make mistakes
Thus we become debuggers, not programmers
– Unix : The large, complicated command language encourages many
mistakes as a result of simple typos and confusion
– Blackboard 9.1 has many more features than Blackboard 8
– Entering grades in a dropdown instead of radio buttons
1 July 2016
© Offutt
16
4. Retention of Skills
• “Once you learn to ride a bicycle, you never forget”
• Some interfaces are easy to remember, some are hard
• If they flow logically (that is, match the user’s mental
model or expectations), they are very easy to remember
• If an interface is very easy to learn, then the retention is
not important – users can just learn again
• Retention is typically more important with UIs that are
hard to learn
1 July 2016
© Offutt
17
5. Subjective Satisfaction
• Subjective satisfaction is defined to be how much the
users “like” the UI
• This depends on the user (thus the word “subjective”)
• Think of it in reverse: Users are unhappy when there is
something annoying in the interface
– Blinking
– Ugly colors
– Spelling errors in massages
• Most important in competitive software systems
– Like … everything on the Web !
1 July 2016
© Offutt
18
Establishing Criteria Priorities
Before designing, decide what is acceptable for
each of the five criteria
• Order of priorities
• Minimally acceptable
• Optimistic goal
1 July 2016
© Offutt
19
Three Categories of Knowledge
1.
Syntactic Knowledge
•
•
•
2.
Task Semantic Knowledge
•
•
•
3.
Structured
Independent of computer and OS
More stable in memory
Computer Semantic Knowledge
•
•
1 July 2016
Varied, depends on computer and OS
Based on rote memorization
Easy to forget
About how software and hardware works on the inside
Not learned by using software, but from reading and classes
© Offutt
20
Three Categories of Knowledge (2)
• Good syntax can :
– Decrease the amount of memorization
– Decrease time to learn
– Decrease rate of errors
• Semantic knowledge involves :
– Actions – things that can happen
– Objects – things that exist
1 July 2016
© Offutt
21
Three Categories of Knowledge (3)
H
H
H
L
H H
L
High
H
H L
L
Task
Semantic
L
H L
L
H
Syntactic
Low
Low
1 July 2016
L
High
© Offutt
L
22
Any Key
1 July 2016
© Offutt
23
And Our Favorite Dilbert
patriot
web
1 July 2016
© Offutt
24
Yahoo! Craziness
• Question : How can I print a receipt?
• Answer: Thank you for writing to Yahoo! Travel concerning your receipt
request. We are committed to provide quick and efficient service and will be glad
to assist you.
Additionally, you may also choose to print your receipt online. Please follow the
instructions provided below:
–
–
–
–
Retrieve your reservation online
are they crazy ???
Click on the link ‘Email a friend’
A different page will
be displayed
which will have a radio button ‘View/ Print Receipt’
Email
a friend
Click on this button and print your receipt for this reservation.
We appreciate your association with us and look forward to being of assistance
to you in the future.
Yahoo! Travel/Travelocity Customer Support
1 July 2016
© Offutt
25
Summary of New Concepts
1.
2.
3.
4.
5.
6.
7.
Usability engineering
Goals for the class
Design for the user
“User friendly” is a meaningless term
“Outside-in” design
7  2 rule
Five criteria :
–
8.
Learn, Speed, Errors, Skills, SS
Three types of knowledge
–
1 July 2016
Syntactic, task-semantic, computer-semantic
© Offutt
26