1. Introduction to Usability Engineering
CS 352
Winter 2017
Elevator photo: I took it Fall 2014 at Phoenix Renaissance Hotel (I was at the Grace Hopper Conference).

2. Logistics: CS352
Syllabus:

3. To the meat of the matter…

4. What is Usability Engineering?
Usability Engineering is the process of Methodically designing systems which are
Useful
Usable
Which includes
Determining what is useful
Determining what is usable
Evaluating these two factors empirically

5. Usability by Other Names in Other Fields
Usability Engineering
Human-computer interaction
Ergonomics
Interaction Design
User-interface design
User-centered design
Informatics/information systems/library science
Psychology/cognitive science
Ergonomics
Industrial engineering/design
Architecture
Art
Social sciences

6. Why bother with usability engineering?
Most software is supposed to help people be productive.
Build better software.
Help people like it enough to buy it (keep your job!).
Avoid fatal flaws in software, like Norman’s 2 gulfs:
Gulf of execution
Gulf of evaluation
Film projector, circa 1940s-1960s – to discuss the Gulfs.
UIs and Gulfs -- Don’t tell them the following – make them guess!
Top one: The numbers are clickable, it’s not really a rotary..
Bottom one: its a click wheel. The buttons are (probably) back to beg, skip to end, and backspace/delete.
compare potential gulfs w these 2 interfaces.

7. Goals of Usability Engineering
(See Rogers handout, ch. 1):
effectiveness at task
eg, the nurses
safety
eg, privacy, losing work, mistakes that endanger
utility
learnability
memorability
efficiency
differences among last 3
effectiveness: tell the story of the nurses.
differences: learnability is for first-time user, memorability is for occasional user, efficiency is for all users (but esp those who use it everyday).
could compare these attributes on both versions of the dial.
* Top one is supposed to represent a phone dial, but it doesn’t “dial” – instead, the numbers are buttons.

8. Design Principles: (Some tools for achieving goals)
Visibility of user’s options/actions.
WHAT options/actions available.
Feedback
Constrain
(making certain errors impossible)
eg: menus vs typing to prevent syntax errors.
(Internal) consistency
Affordance
makes clear HOW I can operate an object
widgets are for talking about most of these points.

9. HW #1: Design Principles
Pairs for this assignment.

10. How to do interaction design/usability engineering
Process (generally)
Identify needs/requirements
of the user experience.
Develop many alternative design ideas
that meet the requirements.
Mock-up and later build versions of the designs
to communicate/evaluate.
Evaluate
throughout the process.
PRICPE will guide us thru these.

11. When to do interaction design
At beginning of software project:
to help establish needs/requirements correctly in the first place
During design/implementation:
to continuously evaluate/monitor
During testing.
to evaluate.

12. Historical Perspective
How the history of computing is tied to the history of computer usability
This is just to be covered if time permits.

13. Eniac (1943) - Gen 0
A general view of the ENIAC, the world's first all electronic numerical integrator and computer.
From IBM Archives.

14. Batch Processing – Gen 1 Computer performed one task at a time
No “interaction” once computation started
Switches, wires, punch cards and tapes for I/O
Very limited, highly trained group of operators

15. Command Line (Mid 1960s) – Gen 2
Computers hit “big business”
More varied tasks; text processing, editing, etc
Need for interactivity
Used by secretaries, salesmen, accountants, CS students etc
Reduced training
Need
for
HCI

16. The Glass Teletype: late 60s
24 x 80 characters
Up to 19,200 bps (Wow - was big stuff!)
Construction: Monitor + detachable keyboard
Display: x80 or 14x132 character cells, optional 24x132
Character matrix: x9 with descenders
Screen size: " diagonal (8" x 4.5" active display)
Character set: Complete US ASCII (128 codes)
Keys: keys in ANSI X typewriter layout
Auxiliary keypad: keys (digits, arrows, function keys)
Visual indicators: LEDs
Interface: RS-232/V.24, optional 20mA Current Loop
Flow control: Xon/Xoff
Communication Speeds: 75,110,150,300,600,1200,2400,4800,9600,19200 bps
Dimensions: "x18"14.25" (monitor), 3.5"x18"x8" (keyboard)
Minimum table depth: "
Weight: pounds
Source:

17. Generation 4 – A computer in every home
Pushing beyond Computing in Business
Need to do more with less
Need to rethink usability
Little or no training for users
More diverse populations
More diverse uses

18. WIMP / GUI WIMP interface emulates existing work practices
Windows, Icons, Menus, Pointers
Graphical User Interface
WIMP interface emulates existing work practices
Direct manipulation
Desktop metaphor
Why was this such an innovation?
What were the innovations making this possible?

19. Ivan Sutherland SketchPad - 1963 PhD thesis at MIT
Hierarchy - pictures & subpictures
Master picture with instances (ie, OOP)
Constraints
Icons
Copying
Light pen input device
Recursive operations

20. Douglas Engelbart The Problem (early ‘50s)
“...The world is getting more complex, and problems are getting more urgent. These must be dealt with collectively. However, human abilities to deal collectively with complex / urgent problems are not increasing as fast as these problems.
If you could do something to improve human capability to deal with these problems, then you'd really contribute something basic.”
...Doug Engelbart
In the very early 1950's, Doug had just become engaged. He realized that he had achieved all his personal goals, but had not yet articulated his work goals.
He thought hard about what problems were worth solving in
terms of its benefit to mankind. To paraphrase, he came up with the following problem statement. [READ FROM SLIDE]

21. The First Mouse (1964)
Over the next 6 years, he created a team, acquired funding, and started implementing his vision. Along the way, he and
his group invented the mouse, but as we will see this is
only a small part of the complete project.

22. Xerox Star
First commercial PC designed for “business professionals”
desktop metaphor, pointing, WYSIWYG, high degree of consistency and simplicity
First system engineered for usability
Paper prototyping and analysis
Usability testing and iterative refinement

23. Xerox Star Desktop

24. Lessons from Xerox Star?
Usability matters, usability sells
Star flopped, but Mac succeeded
Cost $15,000
Lacked spreadsheet, standard business software
Usability can be “engineered”
Birth of HCI as a design discipline

25. Evolution from Xerox Star?
1981

26. Evolution from Xerox Star?
1981
1985
Windows 1.0
Mac OS 1.0

27. Evolution from Xerox Star?
1981
1985
1987
Windows 1.0
Mac OS 1.0
Mac OS 5.0
Windows 2.0

28. Evolution from Xerox Star?
1981
1985
1987
1992
Windows 1.0
Mac OS 1.0
Mac OS 5.0
Windows 3.0
Mac OS 7

29. Evolution from Xerox Star?
1981
1985
1987
1992
1998
Windows 1.0
Mac OS 1.0
Mac OS 5.0
Windows 3.0
Mac OS 7

30. Evolution from Xerox Star?
1981
1985
1987
1992
1998
2007
Windows 1.0
Mac OS 1.0
Mac OS 5.0
Windows 3.0
Mac OS 7

31. Evolution from Xerox Star?
1981
1985
1987
1992
1998
2007
Windows 1.0
Mac OS 1.0
Mac OS 5.0
Windows 3.0
Mac OS 7

32. Where do we go next? ? User Productivity Time Touch/voice WIMP
(Windows)
User Productivity
Command Line
Batch
1940s – 1950s
1960s – 1970s
1980s - Present
2000s-present
Time

33. Examples of new paradigms
Mobile computing
Wearable computing
Tangible computing
Ubiquitous computing
and many more….