interface presentation.ppt

7/29/2019 Interface Presentation.ppt

1/17

HCI and UI Design

From Theory to Implementation

Michael Saltsman

Computer Science Program, University of Utah


2/17

What is an interface?

the place at which independent and often

unrelated systems meet and act on or

communicate with each other.

Meriam-Webster


3/17

Why do we remember only the bad?

A good interface should be transparent

Bad interfaces cause user frustration

What was this product designer thinking?

GOOD BAD


4/17

Topics of this presentation

Brief history of software user interface (UI)

design

Some of the psychological studies done in

human computer interface (HCI) design Usability and the use of icons

Necessities for accessibility

Some guidelines for good UI design


5/17

Brief history of software UI

1968: Douglas Engelbart, Stanford

Research Institute, regarded as father of

the GUI

Text-based manipulation using a mouse 1970: XEROX establishes Palo Alto

Research Center (PARC) to develop first

mainstream GUI


6/17

The First Graphical User Interfaces

XEROXs GUI (1981)

Microsofts Window (1985)

Apple Computers Lisa GUI (1983)


7/17

Psychology of HCI

GOAL: To determine how best to produce

predictive theories of user and system behaviors

William Edmond Hick British Psychologist

Hicks Law

Paul Fitts Ohio State University

Fitts Law


8/17

Hicks Law

William Edmund Hick

British Psychologist

1952

Ability of a human to quickly predict an outcomebased on the number of simultaneous stimuli

Relationship between speed and accuracy

Software Example More options are not always better


9/17

Fitts Law

Paul Fitts

Psychologist at Ohio State University

1954

Mathamatical model used to predict how long it

takes a user to move from one point on a screen

to another

Based on the distance between two points


10/17

Fitts Law(contd)

Farther away an object is, the longer it takes to

acquire with a mouse

In order to keep the average acquisition speed,

object needs to be larger


11/17

Principles of UI design

Focus on the user

Standards Example Phone number

US uses 10 characters

Europe can be up to 15 characters Color

1 in 12 people are colorblind in some way

Red / Green is most common

Occurs mostly in males

Icons as a means of communication


12/17

3-Click rule

Visibility

Accessibility

Keyboard equivalents

Undo action

Short term memory load

Average person can hold a maximum of 7 pieces ofindependent information

Can hold information from 3 to 20 seconds

Principles of UI design (contd)


13/17

Keep in mind

This notALL of the principles of UI

design, but what I have found to bethe most important ones.


14/17

Thank you.

For more information on UI design, contact

Michael Saltsman at [email protected]


15/17

Works Cited

Merriam Webster Online Dictionary. Retrieved March 10, 2008 from

http://www.merriam-webster.com/dictionary/interface

Reimer, J. (May 05, 2005). A history of the Gui.Ars technical, the art of technology.

Retrieved March 15, 2008 from http://arstechnica.com/articles/paedia/gui.ars

Abowd G. D. (17 Dec, 1991). Formal descriptions of user interfaces. Theory in

Human-Computer Interaction (HCI), IEE Colloquium on. pp. 7/1-7/3. London, UK

Seow, S. C. (2005). Information Theoretic Models of HCI: A comparison of the Hick-

Hyman Law and Fitts Law. Human-Computer Interaction, Volume 20, pp. 315-352.

Norman, K. L. (1991). The Psychology of Menu Selection: Designing Cognitive

Control at the Human/Computer Interface . Alex Publishing Corporation. 1991 ISBN:

0-89391-553-X. Retrieved on March 30, 2008 from

http://lap.umd.edu/POMS/Chapter4/Chapter4.html

Olson J.R. and Nilsen, E. (1987). "Anaiysis of the Cognition Involved in Spreadsheet

Software Interaction," Human-Computer Interaction (3:4), 1987, pp. 309-349.

Harris J. (2006). Giving You Fitts, Jensen Harris: An Office User Interface Blog.

Retrieved on March 30, 2008 from

http://blogs.msdn.com/jensenh/archive/2006/08/22/711808.aspx


16/17

Works Cited

Guiard Y., Beaudouin-Lafon M., Bastin J., Pasveer D., & Zhai S. (2004). View size

and pointing difficulty in multi-scale navigation. Proceedings of AVI, Advanced Visual

Interfaces. Pp. 117-124. New York: ACM Press.

Dr. Riesenfeld suggested that when designing a UI of any sort, the most important

thing to focus on in this design is your user. Who will you be designing this interface

for? (personal communication, Dr. Richard Riesenfeld, University of Utah School of

Computing. March 14, 2008).

Dr. Riesenfeld suggested you cannot globally standardize an interface because

standards vary between countries. (personal communication, Dr. Richard

Riesenfeld, University of Utah School of Computing. March 14, 2008).

Henderson C. (2002). Color Vision. Retrieved on March 15, 2008 from

http://www.iamcal.com/toys/colors/stats.php.

Cooper E., Demchak MA. (2000). Facts About Colorblindness. Tips for Home orSchool. Retrieved on March 15, 2008 from

http://www.unr.edu/educ/ndsip/tipsheets/colorblindness.pdf

Fahlman S. (2007) SMILEY: 25 YEARS OLD AND NEVER LOOKED HAPPIER!.

Retrieved on March 15, 2008 from http://www.cs.cmu.edu/smiley/history.html


17/17

Works Cited

Aronson J. (2005) Medical emoticons. BMJ, Volume 330, January 8, 2005, pp. 87.

Retrieved on March 15, 2008 from http://www.bmj.com/cgi/reprint/330/7482/87.pdf

Usability Glossary: 3-click rule. Retrieved on March 15, 2008 from

http://www.usabilityfirst.com/glossary/term_707.txl

Norman D. (1990). Design of Everyday Things. New York: Doubleday. ISBN 0-385-

26774-6 (Original work published 1988 underPsychology of Everyday Things).

US Department of Justice. (2000). Software Accessibility Checklist. Retrieved on

March 20, 2008 from http://www.usdoj.gov/crt/508/archive/oldsoftware.html

Shneiderman, B. (2005) Shneidermans Principles of Computer Interface Design,

Retrieved from http://www.sjsu.edu/depts/it/itcdpdf/shneiderman.pdf.

Skaalid B. (1999). Human-Computer Interface Design: Shneidermans Principles of

Human-Computer Interface Design. Retrieved on March 20, 2008 from

http://www.usask.ca/education/coursework/skaalid/theory/interface.htm

Clark D. (2007). Memory: Short Term Memory (STM). Retrieved on March 21, 2008

from http://www.nwlink.com/~donclark/hrd/learning/memory.html

interface presentation.ppt

Documents