1. Cooper Part III Interaction Details Designing for the Desktop
Jeff Offutt
SWE 632
User Interface Design and Development
Cooper Ed4, Ch 18
(abbreviated version)

2. Outline Windows on the Desktop Menus
Pointing, Selection, and Direct Manipulation
15 February 2019
© Jeff Offutt

3. MDI vs. SDI Multiple Document Interface (MDI)
One process runs multiple instances
One program running, but two documents open
Users can only see one at a time
Navigation among documents is painful (excise)
Single Document Interface (SDI)
Each instance has a different process
Two Powerpoint files can be viewed simultaneously
MDI uses fewer computer resources
SDI gives more flexibility to users
15 February 2019
© Jeff Offutt

4. Windows Are Rooms A dialog box is another room;
Metaphor : Each application window is a separate room
Do not add a room unless it has a purpose
Unnecessary rooms take up space and adds unnecessary navigation (are formal living rooms necessary today?)
Many UIs have too many dialog boxes
We don’t have different rooms for toilets and sinks
A dialog box is another room;
have a good reason to go there
Provide functions in the window where they are used
15 February 2019
© Jeff Offutt

5. Outline Windows on the Desktop Menus
Pointing, Selection, and Direct Manipulation
15 February 2019
© Jeff Offutt

6. Menus are Effective When
Users have little or no training
Users are beginners
Users are not familiar with terminology
Users need help making decisions
Use menus to teach beginners
A screen that only lists functions helps beginners, but slows down intermediate and advanced users
Creates a wall between users and functionality
15 February 2019
© Jeff Offutt

7. Ordering Menu Items Frequently used first (most common strategy)
Chronological (time)
Numeric
Alphabetic
“Important” items first (exit)
15 February 2019
© Jeff Offutt

8. Phrasing of Menu Choices
Words should be familiar
All screens must be consistent
Every word must be distinct
Start with a verb
Phrases must be concise
Use the keyword first
15 February 2019
© Jeff Offutt

9. Keyboard Accelerators
Help users invoke a function from the keyboard
All tools in a “collection” should have the same style and same accelerators when possible
Users must be able to find them
Conventions from early 1980s
Ctrl-C, Ctrl-V
Ctrl-P
Ctrl-S
Ctrl-Z, Ctrl-Y
Which commands should have accelerators?
Let users define their own (power users!)
PPT accelerators are a real mess …
15 February 2019
© Jeff Offutt

10. Outline Windows on the Desktop Menus
Pointing, Selection, and Direct Manipulation
15 February 2019
© Jeff Offutt

11. Object-verb vs. Verb-object
Carr, “Programmers at Work”, pg 220
Originated at Xerox Parc : All commands should act on data that is already selected
Think of this as “object-oriented” UI design
Verb-object : Choose copy, system asks you what to copy
User is in a reactive mode
Object-verb : Choose the file, then copy
User is in control
Just like spoken grammar, do we say
drink beer?
beer drink?
V-O is natural for command languages
O-V is better for GUIs
15-Feb-19
© Jeff Offutt

12. Support both mouse and keyboard use for navigation and selection tasks
Selecting Events
Clicking uses fine motor skills, but dragging uses gross motor skills
The standard scrollbar requires a mix of fine and gross motor skills
Good!
Stupid
Better
Support both mouse and keyboard use for navigation and selection tasks
15 February 2019
© Jeff Offutt

13. Discrete and Contiguous Selection
Discrete data : Objects that are independent and need to be selected independently
Picture elements in a drawing tool
Contiguous data : Objects that are grouped together in lists or matrices
Spreadsheet cells and words in word processors
Whether data is discrete or contiguous sometimes depends on user needs
Files can often be selected in both ways
Shift-left mouse for contiguous selection
Ctrl-left mouse for discrete selection
15 February 2019
© Jeff Offutt

14. Drag and Drop
Drag-and-drop is one of the most powerful direct manipulation idioms
The Web has decreased its use
Drag-and-drop is rare on the web
JavaScript allows it …
From the book : “Microsoft … pioneered some novel uses … movable toolbars and dockable palettes”
These were in the Xerox Star in 1982
Remember that drag-and-drop mixes fine and gross motor skills
15 February 2019
© Jeff Offutt

15. Summary Chapter 18 Primary and secondary windows
SDI is more usable than MDI
Design UIs with as few windows as you can
Menus teach beginners
Mixing fine and gross motor skills is hard
Help experts keep their hands on the keyboard
15 February 2019
© Jeff Offutt