CS 124: User-Interface Design (Fall 2002)

Professor Melissa O'Neill

This course draws on results from many disciplines, including industrial design, graphic design, anthropology, sociology, ergonomics, engineering, philosophy, artificial intelligence, linguistics, architecture, theater, and statistics, as well as specific research on human-computer interaction.

Project

Final Project Stage

Prototype Refinement & Comparison: Demo to class, Tuesday, December 17; Report due 1:15 P.M., Tuesday, December 19

First Computer-Based Prototype

UI Prototype Development and Testing: Demo to me, before 5:00 P.M., Friday, November 22; Report due 8:30 A.M., Monday, November 25

Lo-Fi Prototype

Lo-fi Prototype Development and Testing: Report due before class, Thursday, October 17

Lo-Fi Prototyping Resources

Prototyping for Tiny Fingers (Handed out in class, must be on HMC campus to access PDF file): Marc Rettig; Communications of the ACM, Volume 37, Issue 4

User Study

User Study: Report due before class, Thursday, October 3

User Study Resources

Methods for Gathering User Requirements: www.usabilitynet.org
Task Analysis for the Rosetta Editor/Viewer: Rittu Rasouli.; An example of detailed hierarchical task analysis.
Chapter 2 of Task-Centered User Interface Design: A Practical Introduction: Clayton Lewis and John Rieman; Shareware
Goal Composition: Extending Task Analysis to Predict Things People May Want to Do: Jakob Nielsen

Past Homework

Assignment 4: Due at class (1:15 PM), Thursday, December 5; Jakob Nielsen on Heristic Evaluation; Mundi Design Studios on Principles of Graphic Design

Assignment 3: Due before class (1:00 PM), Tuesday, November 19; In my reader, I used text from Alice's Adventures in Wonderland, massaged so that spaces were the only word separators. You can use excerpts from this text, use other text from Project Guttenberg, or find your own corpus of text.

Assignment 2: Due before class (1:15 PM), Thursday, October 31

Homework Resources

Norman's Model of Task Performance: PDF; PNG

Assignment 1: Due before class (1:00 PM), Thursday, September 19

Homework Resources

Developing Cocoa Objective-C Applications: A Tutorial: HTML; PDF
Developing Cocoa Java Applications: A Tutorial: HTML; PDF

Readings

For Thursday, Week 5 (Oct 3)

Prototyping for Tiny Fingers (Must be on HMC campus to access PDF file): Marc Rettig; Communications of the ACM, Volume 37, Issue 4
Affordance, Conventions and Design: Donald Norman; (Donald Norman, who popularized the term affordance in the UI community, argues that too many UI people use the term inappropriately.)

For Tuesday, Week 2 (Sept 10)

Foreword of Task-Centered User Interface Design: A Practical Introduction: Clayton Lewis and John Rieman; Shareware
Chapter 1 of Task-Centered User Interface Design: A Practical Introduction: Clayton Lewis and John Rieman; Shareware

For Thursday, Week 1 (Sept 5)

Is software too hard to use?: David Orenstein; CNN/Computerworld/IDG
When Interfaces Kill: What Really Happened to John Denver: Bruce Tognazzini; AskTog

Objectives

Students taking this class will learn how to

Express and apply the principles of user-centered design
Appraise, critique, and classify user interfaces
Differentiate and formulate examples of both good and bad design
Employ and explain psychological principles for human-centered design
Design and describe user interfaces
Study people to assess their needs for a computer system, and model their needs and work processes
Express and apply graphic design principles relevant to GUI design
Express and apply guidelines for good UI design
Use computer tools to construct elegant user interfaces
Relate and balance the conflicting factors that make up good design

Textbooks

This list is preliminary, and may change by the time class starts.

Recommended Books

Human-Computer Interaction: Jenny Preece, Yvonne Rogers, Helen Sharp, David Benyon, Simon Holland, and Tom Carey; Addison-Wesley, 1994; Despite its age, this book continues to be the most comprehensive in the area.
The Design of Everyday Things: Donald A. Norman; Doubleday, 1990
Designing Visual Interfaces: Communication Oriented Techniques: Kevin Mullet and Darrell Sano; Prentice Hall, January, 1995

Reference Books

Designing the User Interface: Strategies for Effective Human-Computer-Interaction, 3rd Edition: Ben Shneiderman; Addison-Wesley, July, 1997
Bringing Design to Software: Terry Winograd; Addison-Wesley, 1996
Usability Engineering: Jakob Nielsen; AP Professional, 1994
Tog on Software Design: Bruce Tognazzini; Addison-Wesley, 1995
Envisioning Information: Edward R. Tufte; Graphics Press, May, 1990

Syllabus

Segment 1: The Mess We're In

Background on history of UIs for computer systems. Dangers of poor interface design. Much technology is still ``unusable''.

Segment 2: Goals of Good UI Design

Goals in design of an interactive system. Factors to consider. Who? What? Where? Feasibility?

Segment 3: Studying the User

Interviews. Questionnaires. Observation (Hawthorne effect) Developing user profiles.

Segment 4: Modeling User Activity

Hierarchical task analysis. Task scenarios. User-object modeling.

Segment 5: Designing Everyday Things

Affordances. Constraints. Mappings. Feedback. Human error (capture errors, description errors, etc.). Mistakes.

Segment 6: Interaction Styles

Key modal (menu-based, Q & A, etc.). Form fill-in. Direct manipulation. Linguistic.

Segment 7: Devising Interfaces

Brainstorming. Use scenarios. Sketching, snapshots, and storyboards.

Segment 8: Conceptual Models

Norman's model of task performance. Gulfs of execution and evaluation. Conceptual models. Knowledge in the world vs. knowledge in the head. Memory.

Segment 9: Perception and Representation

The senses. Contrast. Properties of color. Visual variables and perceptual tasks. Perceptual layers. Visual noise. Representation.

Segment 10: Graphic Design

Elegance and simplicity. Unity. Reduction and refinement. Fitness. Scale, contrast and proportion. Clarity, harmony and restraint. Sharpening. Figure and ground. Negative space. Organization and visual structure. Grid-based design. Optical adjustment. Imagery (and appropriateness).

Segment 11: Metaphors

Developing metaphors. Evaluating metaphors. Using metaphors.

Segment 12: Describing and Documenting UI Design

Categories (delineation, enumeration, instantiation, schematization). Menu trees. Transition diagrams. Object-state transition charts. User-action notation. Grammars. Prototypes.

Segment 13: Usability Testing

Planning. Performing. Evaluating.

Segment 14: Studying Interface Properties

Reaction times (Fitts's law, etc.)

Segment 15: Other Guidelines

Other recommendations and topics, adjusted depending on time.

Assessment

Grades in this course are determined by student performance on assignments (undertaken individually), group project work (undertaken in groups of 2, 3, or 4), and examinations.

Assignments

Assignments develop basic skills and serve as checkpoints for ensuring that students are studying the additional materials to necessary undertake the project work.

Project Work

A group project provides the cornerstone of the course. The entire class is given a general description of an interactive system that they must design. Each group must then find a user community and study their work methods, devise a user interface, and provide a prototype implementation of that interface.

Examinations

A midterm and a final exam assess students' understanding of the key concepts of the course. In examinations, they may be asked to comment on example interfaces, suggest remedies, and show both their knowledge of design principles and how those principles are applied in practice.

Class Meeting Times and Location

There is one section of CS 124 in the fall 2002 semester. It meets from 1:15 PM - 3:00 PM in Thomas-Garrett Hall, room 101.