![Page 1: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/1.jpg)
An Introduction toBen Shneiderman’sEight Golden Rulesof Interface Design
Jochen Wolters@jochenwolters
![Page 2: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/2.jpg)
They hate poorly designed ones!
Users don’t lovegreat user interfaces.
Users don’t lovegreat user interfaces.
![Page 3: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/3.jpg)
![Page 4: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/4.jpg)
via http://daringfireball.com
![Page 5: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/5.jpg)
DesignROI ?
![Page 6: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/6.jpg)
∆$ = ∆t ✕ $t
![Page 7: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/7.jpg)
Give Up
Select Products
Check out(& Register)
Sign UpLog In orContinue
Give Up
![Page 8: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/8.jpg)
$ ?$300MThe $300 Million Button
source: http://www.uie.com/articles/three_hund_million_button/
Additional revenue in first year at $25B retailer
![Page 9: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/9.jpg)
DesignROI ?
!!
![Page 10: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/10.jpg)
Ben Shneiderman’sEight Golden Rules of Interface Design
From: “ Designing the User Interface: Strategies for Effective Human-Computer Interaction.”
![Page 11: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/11.jpg)
1. Strive for consistency
Consistent sequences of actions should be required in similar situations; identical terminology should be used in prompts, menus, and help screens; and consistent commands should be employed throughout.
Workflows / Processes
Functionality
Appearance
Terminology
![Page 12: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/12.jpg)
1. Strive for consistency
![Page 13: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/13.jpg)
“The World” rocker switch, dial , …
1. Strive for consistency
(scripts, script direction, …)Cultural Region
home appliance, car, TV, …System Type
iPhone/iPad, Windows, car nav, …Platform
MS Word, WordPress, eBay, …App
![Page 14: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/14.jpg)
1. Strive for consistency
![Page 15: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/15.jpg)
1. Strive for consistency
✔
➜
“information scent”consistent terminology is key
![Page 16: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/16.jpg)
1. Strive for consistency
![Page 17: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/17.jpg)
1. Strive for consistency
![Page 18: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/18.jpg)
1. Strive for consistency
![Page 19: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/19.jpg)
1. Strive for consistency
![Page 20: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/20.jpg)
2. Enable frequent users to use shortcuts
As the frequency of use increases, so do the user's desires to reduce the number of interactions and to increase the pace of interaction. Abbreviations, function keys, hidden commands, and macro facilities are very helpful to an expert user.
Keyboard shortcuts
Hidden “Power User” features
Automation
![Page 21: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/21.jpg)
2. Enable frequent users to use shortcuts
![Page 22: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/22.jpg)
2. Enable frequent users to use shortcuts
Level 1
⌘C / ⌘VLevel 2
Level 3
![Page 23: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/23.jpg)
2. Enable frequent users to use shortcuts
![Page 24: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/24.jpg)
3. Offer informative feedback
For every operator action, there should be some system feedback. For frequent and minor actions, the response can be modest, while for infrequent and major actions, the response should be more substantial.
Relevant
Fits importance and urgency
Comprehensible and meaningful
Within appropriate context (time & place)
![Page 25: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/25.jpg)
3. Offer informative feedback
0,1 s 1,0 s 10 s
Experiencingcause and effect
Taking turns ina conversation
Typical humanattention span
Respond to mouse click, key press, …
Open window,bring up progressbar / spinner, …
Wake machine,load file into app,start printing, …
![Page 26: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/26.jpg)
3. Offer informative feedback
![Page 27: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/27.jpg)
3. Offer informative feedback
![Page 28: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/28.jpg)
4. Design dialog to yield closure
Sequences of actions should be organized into groups with a beginning, middle, and end. The informative feedback at the completion of a group of actions gives the operators the satisfaction of accomplishment, a sense of relief, the signal to drop contingency plans and options from their minds, and an indication that the way is clear to prepare for the next group of actions.
Grouping of actions
Explicit completion of an action
Well-defined options for the next step
![Page 29: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/29.jpg)
4. Design dialog to yield closure
![Page 30: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/30.jpg)
4. Design dialog to yield closure
![Page 31: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/31.jpg)
4. Design dialog to yield closure
source: http://www.headphone.com/
![Page 32: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/32.jpg)
4. Design dialog to yield closure
![Page 33: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/33.jpg)
5. Offer simple error handling
As much as possible, design the system so the user cannot make a serious error. If an error is made, the system should be able to detect the error and offer simple, comprehensible mechanisms for handling the error.
Error prevention over error correction
Automatic detection of errors
Clear error notifications
Hints for solving the problem
![Page 34: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/34.jpg)
3. Offer simple error handling
![Page 35: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/35.jpg)
3. Offer simple error handling
![Page 36: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/36.jpg)
5. Offer simple error handling
![Page 37: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/37.jpg)
5. Offer simple error handling
![Page 38: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/38.jpg)
6. Permit easy reversal of actions
This feature relieves anxiety, since the user knows that errors can be undone; it thus encourages exploration of unfamiliar options. The units of reversibility may be a single action, a data entry, or a complete group of actions.
No interference with workflow
More freedom for the user
Single-action undo vs. action history
![Page 39: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/39.jpg)
6. Permit easy reversal of actions
![Page 40: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/40.jpg)
6. Permit easy reversal of actions
![Page 41: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/41.jpg)
6. Permit easy reversal of actions
![Page 42: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/42.jpg)
6. Permit easy reversal of actions
![Page 43: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/43.jpg)
7. Support internal locus of control
Experienced operators strongly desire the sense that they are in charge of the system and that the system responds to their actions. Design the system to make users the initiators of actions rather than the responders.
The user commands, the system obeys
Strongly relies on Informative Feedback
“The Principle of Least Surprise”
![Page 44: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/44.jpg)
7. Support internal locus of control
![Page 45: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/45.jpg)
7. Support internal locus of control
![Page 46: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/46.jpg)
7. Support internal locus of control
![Page 47: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/47.jpg)
7. Support internal locus of control
modal non-modalinspectordialog box
![Page 48: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/48.jpg)
7. Support internal locus of control
quasi-modal
⇧
command
⌃⌥⌘
control
option
shift
+key
clickor
modifier keys
![Page 49: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/49.jpg)
7. Support internal locus of control
click and drag
click and drag + ⌘
resize
rotate
![Page 50: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/50.jpg)
7. Support internal locus of control
![Page 51: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/51.jpg)
7. Support internal locus of control
Time-outs are
PURE EVIL
![Page 52: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/52.jpg)
HotelAlarmClocks
HotelAlarmClocks
7. Support internal locus of control
![Page 53: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/53.jpg)
7. Support internal locus of control
Dear DHL customer,since no actions were initiated on your part for a longer period of time, we have automatically closed your session for security reasons.
Please start DHL Online Postage with a new shopping cart.Your DHL Team
New Shopping Cart
![Page 54: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/54.jpg)
7. Support internal locus of control
![Page 55: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/55.jpg)
8. Reduce short-term memory load
The limitation of human information processing in short-term memory requires that displays be kept simple, multiple page displays be consolidated, window-motion frequency be reduced, and sufficient training time be allotted for codes, mnemonics, and sequences of actions.
Clear structure: windows, dialogs, app in its entirety
“Recognition over Recall”
Implicit help
![Page 56: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/56.jpg)
Understanding a simple sentence can — if interrupted with a tangent like this one, which contains just twenty words, but already noticeably challenges your short-term memory — become a problem.
8. Reduce short-term memory load
Understanding a simple sentence can — if interrupted with a tangent like this one, which contains just twenty words, but already noticeably challenges your short-term memory — become a problem.
![Page 57: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/57.jpg)
8. Reduce short-term memory load
7 ± 2“Chunks” of Information
source: http://www.musanim.com/miller1956/
![Page 58: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/58.jpg)
8. Reduce short-term memory load
source top: http://www.headphone.com/
![Page 59: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/59.jpg)
8. Reduce short-term memory load
![Page 60: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/60.jpg)
8. Reduce short-term memory load
Deck 3→
![Page 61: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/61.jpg)
1. Strive for consistency
2. Enable frequent users to use shortcuts
3. Offer informative feedback
4. Design dialog to yield closure
5. Offer simple error handling
6. Permit easy reversal of actions
7. Support internal locus of control
8. Reduce short-term memory load
Ben Shneiderman’sEight Golden Rules of Interface Design
![Page 62: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/62.jpg)
Ben Shneiderman’sEight Golden Rules of Interface Designhttp://faculty.washington.edu/jtenenbg/courses/360/f04/sessions/schneidermanGoldenRules.html
Bruce “Tog” Tognazzini’sFirst Principles of Interaction Designhttp://www.asktog.com/basics/firstPrinciples.html
Jakob Nielsen’sTen Usability Heuristicshttp://www.useit.com/papers/heuristic/heuristic_list.html
Dieter Rams’Ten Principles for Good Designhttps://www.vitsoe.com/gb/about/good-design
![Page 63: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/63.jpg)
Donald Norman
TheDesign ofEverydayThings
![Page 64: An Introduction to Ben Shneiderman's Eight Golden Rules of Interface Design](https://reader033.vdocuments.mx/reader033/viewer/2022050920/549c1848b479599b318b4656/html5/thumbnails/64.jpg)
http://www.slideshare.net/jochen_wolters
Thanks a lotfor interfacingwith me today!
Find these slides at:
An Introduction toBen Shneiderman’sEight Golden Rulesof Interface Design
Jochen Wolters@jochenwolters | http://uiobservatory.com