The course will cover user interface design principles, task and user analysis, interface design methods, user interface evaluation and usability testing. Students will be expected to do readings, participate in discussion, and complete all assignments. They will extensively use web design tools (Dreamweaver/MS PowerPoint) to prototype user interfaces for information retrieval systems. For further information about the topics covered in this class, please see the class topics and schedule.

This is NOT a course on Web page design. The course requires a basic understanding of information *systems* and hands-on skills with the use of prototyping tools.

Course Objectives

The objective of this course is for students to learn how to design, prototype and evaluate user interfaces to effective browse and search systems by examining what research has uncovered, what developers have produced, and how people perform information tasks.

Objectives:

• Learn the main concepts in human computer interaction
• Learn basic user interface principles through practice
• Learn about cognitive and perceptual abilities and constraints that impact information use
• Learn about human information processing and how it is applied to the design of user interfaces
• Learn to conduct user and task analysis specifically for information retrieval tasks
• Learn to design and prototype user interfaces
• Learn to perform user interface evaluation and usability testing
• Prepare for further training and research in this area
• Be familiar with research issues in user interface design

Organization of the Course

The course combines lectures, discussions, demonstrations, and assignments/projects to help students understand UI design principles, task and user analysis, design methods, and UI evaluation and usability testing techniques in developing information retrieval systems. Students are encouraged to discuss, question, and clarify course content in class meetings.

The assignments are individual and group work. The assignments reflect a process and each one builds on the results of the previous. All focus on conceiving, developing and testing an interface to information content. and will follow the material discussed in class.

Major Assignments

Assignment 1: Good & Bad Design (5% - Due Week 3)

Identify on the world wide web one example of a well designed and one example of a poorly design website. Use your intuition and your knowledge gained from this week's readings. In particular, please use Norman?s design principles: mapping, visibility, feedback, consistency, constraints, affordances, and/or conceptual model to support your judgment (for more info see below).

Submission:

• About one page description per website (but no more than three single spaced pages in total)
• Identify the site and the URL (the site must have public access, so that I can visit it)
• For the well designed website: state what is good about the website's design and why you find it well designed (e.g., show how does it follow Norman's "feedback" principle).
• For poorly designed website: state what the problem is and why you find it to be a problem (i.e., what difficulties, misunderstandings does it cause).
• In both cases, support your argument by using at least two of Norman's design principles. Explain how these principles are met or violated by the websites you have chosen.

Assessment criteria:

• 90% content - 45% for each design critiqued; out of 45%
• 32.5%- basic (intuitive) description of what is good/bad about a website
• 10% - for supporting your argument by two design principle (5% for correct application of each principle)
• 5% (overall, not per design) for extra strong argumentation, using more then two principles, etc.
• 10% style (stylistically & grammatically correct writing, neat appearance of the submitted work, etc.)

Note: This is NOT a group assignment

Assignment 2: Project Proposal (5% - Due Week 4)

The general topic area in which the project proposals are expected to fall are interfaces for information systems. Find a type of information task(s) that you plan to design a system to support. This could be a new system or a re-design of an existing sytem. Do not be too broad, e.g., to support the library's public face, nor too narrow, e.g., managing the list of web resources for this course. Think of a particular context in which information is used, and the purposes for which it is used. It may be in any type of information environment and used by any type of user.

Details:

• Submit about two-three pages (about 1000-1200 words). Your document should include:
• a consise statement of the purpose of your system
• identification of the types of users and description of some of their goals
• indication if a system is currently in place; if so, provide an image of that site, and indicate the types of changes that you propose to make.
• Create your document in HTML format and choose a name that you will use throughout this course and append the assignment number, e.g., MLIS512_LibrarySystem_2.html, where you would replace "LibrarySystem" with project name.
• As you build the prototype, each new segment will be added to your website. By the end of the course, you will have created a portfolio showing your design process.

The intent of this assignment is to start thinking about the process early in the term.

Assessment criteria:

• 90% content
• 10% style (stylistically & grammatically correct writing, neat appearance of the submitted work, etc.)

Assignment 3: User Needs & Task Analysis (15% - Due Week 7)

In this assignment, you will use your approved project idea. One of the first steps in an iterative user-centered system design is to get to know the intended users and their tasks. Only then can one consider what the actual system design should look like. This process requires you to identify actual users, talk to them about what tasks they are trying to do, and understand how they go about performing these tasks. Armed with this knowledge, you will decide on the most important user goals. You will develop corresponding scenarios and use cases that will guide the design of your system.

First: Design an interview script that you will use in interviewing around three typical users. The purpose of the interview is to find out how they currently perform the same task, whether using a paper-based system, or a currently existing information system. Do not under-estimate this step ? you will need to walk away from this process with a reasonably rich picture of the user community, and the tasks and goals they have.

Second: Conduct the interviews. Determine how you will record the interviews.

Third: Develop from the interviews at least two types of representative users and what they are trying to achieve. Identify all tasks that the these representative users typically do. Pay attention to differences in their goals. Using the the prototypical users and tasks, create several scenarios that encompass the range of functionality required in the system. Note that these scenarios will be used in later assignments to determine if the design/re-design actually supports these scenarios.

Details

• Based on the analysis of the new requirements (and based on an earlier received feedback, submit a revision of the system description you now believe you are designing. this should be the first part of the document, and if you do it well, you will be able to directly insert it as is into the final report.
• Submit your interview script, summary of the interviews, as well as short description of representative users, their tasks, and scenarios. Explain how each was created. Presenting and organizing this information will be important; it should not be a lengthy narrative, but it should also not be just a one long lists.
• Provide your document in html form (use the same naming scheme as before) and upload it to your webspace (eden).
• As you build the prototype, each new segment will be added to the Website

Sample sections that you may want to include in your submission:

• Revised Problem Statement
• Your revision will be based on what you have learned at this project stage
• Short justification of revisions (if any) to your initial design problem
• Representative users (2 or more)
• Task Analysis ? Tasks performed by the typical users
• include User X Task matrix and Task Matrices ? one per User
• depending on a case, you may want to include HTA
• Scenarios - 3 or more
• (Include a brief explanation of how tasks and scenarios were created)
• Appendices : a) Questionnaire / Interview Script; b) Summary of Interviews (not detailed data)

Assessment criteria:

• 05% Interview questions
• 05% Summary of interviews / notes from interviews
• 30% Tasks / Task Matrices / HTA / Use Cases etc.
• 30% Scenarios
• 20% Explanations / rationale behind personas, tasks, scenarios. Revision of problem statement (if applicable). Background info / motivation
• 10% Overall organization, clarity (e.g. language, style) etc.

Assignment 4: Prototype and Evaluation I (20% - Due Week 8)

Using your task analysis, create at least two initial designs for the system and do a cognitive walkthrough of each.

First: conceptual design - on what should you base each design? One strategy is to create design ideas for each user type separately, then look for ways that the designs and user needs can be logically combined, focusing on the most frequent user. Another way to create different designs is to put different priorities on the scenarios. Emphasizing one scenario over another might result in creating a different organization of the interaction flow. A third approach could be to generate designs for specific tasks.

Second: develop the prototype designs. Pay no attention to graphical and visual representation at this point. Address functionality. You may use paper, overheads, simple software prototyping tools, such as PowerPoint, or DENIM. This should appear as a work-in-progress and not a final or near-final development. For each design, plan for the interaction flow. What happens if a person selects something from your top page (for example) ? You should aim for some sort of storyboard that outlines the flow in your system. Add any additional comments (script) to the design so that the intent behind the design is understood.

Third: for each prototype design, conduct a cognitive walkthrough. Cognitive walkthroughs are performed by experts. Using the tasks generated in the previous assignment, use the approach described in your textbook. In your write-up, describe the task used, describe briefly what would happen in the outcome from the task, and indicate any recommended design modifications that should result. You should use no fewer than five tasks (and no more than ten) per design.

Details

• Submit a no-more-than-one-page description of how you approached this task (HTML).
• Submit your sketches for the designs, with sufficient annotation so that I understand what you are proposing.
• These should include interaction flows, initial sketches and explanatory narrative.

1. If you have used paper prototyping please submit a copy of your design (keeping the original).
2. If you have used a computer tool, please upload file(s) to your webspace as usually

• Submit each of your cognitive walkthroughs to the your webspace.
• If applicable, submit revisions to tasks / scenarios.
• The prototype work is worth - 10%; the cognitive walkthrough - 5%; class presentation - 5% (described in a separate document)

Assessment criteria - prototyping:

• 10% Approach to prototyping (desciption)
• 25% Prototype: number of prototypes * prototype complexity
• 25% Prototype description, annotation, flow
• 25% Prototype: quality (not visual quality of proto., but quality & amount of work)
• 05% Optional elements (e.g. revised tasks)
• 10% Overall organization and clarity, etc.

Assessment criteria - cognitive walkthrough:

• 10% Tasks
• 10% Suitability of Tasks
• 25% Accuracy of Cognitive Walkthrough
• 25% Thoroughness of Cognitive Walkthrough
• 20% Proposed re-design (of your prototype(s))
• 10% Overall organization and clarity, etc.

Assignment 5: Revised Prototype & Heuristic Evaluation (15% - Due Week 11)

Using a prototyping tool such as Dreamweaver, develop an interactive prototype of your system based on the designs you created in the previous assignment, and the feedback from "experts" (i.e., your cognitive walkthroughs).

First: Using the results from your previous assignment, create an interactive higher-fidelity prototype. Remember, at this project stage, there is no  time for fancy design and a lot of code. Demonstrate how the functionality will be handled. Remember also, we are not doing the back-end work. If you believe that the content of some screens in your information system will be generated dynamically, do 'canned' input and output from the database using static screens (e.g. web pages) to illustrate how the system might work. How much should you do? I suggest that you think in terms of two to four interaction flows (tasks), each involving three to five screens. However, there may also be a tradeoff between the number of screens and the complexity of the information on each screen.

Second: write a report to accompany your prototype. It should include the following elements (remember: iterate! Some section are revised version from your previous submissions):

• Intro: The design problem addressed - the main goals / functions of your system.
• Brief description of the user group.
• Describe how you moved from your low-fidelity prototype(s) to your higher-fidelity interactive prototypes. In particular:
• What changes have you made to the prototype(s) based on your cognitive walkthroughs?
• If you have combined two (or more) low-fi prototypes into one interactive prototype, please describe your approach to doing this.
• Include enough detail about your interactive prototype, so that I know how it is to be used.
• Lessons learned from prototyping.
• By now you should have used (at least) two different prototyping techniques. Based on your experience, describe briefly what have you learned about these techniques.
• If you have revised the scenarios or tasks at this stage, please include the revised versions.

The report should be no more than 6 to 8 pages. Please create it in HTML format.

Third: in class each member of the class will serve as a usability expert and be matched with a prototype to do a heuristic evaluation. You must have your prototype ready for that class. All class members present at the begining will be matched with a prototype. Each person will have an hour and a half to assess the prototype and write an assessment and a recommendation for the potential client group. The intent is to identify: a) which usability guideline was violated, b) why you think it was violated, c) a severity rating for the violation, and c) a suggested solution. Those who are not present at the beginning of the class, will be excused from this class, and will lose 5% of the course grade for their non-participation. This will be a 'real-world' situation. We will do the analysis and write the report in the class time. The report from the heuristic evaluation should include:

• Clear identification of the system that you have evaluated.
• Short description of how you conducted the evaluations.
• Include your comments on whether it was easy or difficult to understand the system your were evaluating.
• Did you get any description (written or verbal) from the system's project team.
• If not, would it have been helpful?
• If yes, was it useful?
• Description of the results obtained from the evaluation
• Recommendations for further re-design of the interface you tested (very important)
• Lessons learned from conducting heuristic evaluations (if any)
• And (in the hard copy version) include in an appendix the heuristic evaluation forms, which you will have filled out in the class

Remember:

• Heuristic evaluation is usually an essentially task-free approach - meaning: you do not tell your system evaluators the exact tasks, but just give them a sufficient description of your system (in terms of functions / tasks supported by the system). You may need to tell them about the current limitations (what parts have not been made interactive).
• During the evaluations step through the set of heuristics several times. For example, do one set of heuristics for each web page / UI screen / dialog box.

Review class notes, the tutorial and the readings about heuristic evaluation; in particular, I'd recommend a short section (#4.3) with a heuristic evaluation example in : http://hcibib.org/tcuid/chap-4.html

Finally:

• Upload your interactive prototype to eden (and send me email about it) before the class;
• Submit your report in the same manner;
• Submit your heuristic evaluation of another student's system by email one day after the class at the latest ;
• Be sure to include your name and email address on all submissions

Assessment criteria - prototype #2 (worth 10% of the total grade):

• 05% Intro, user group description etc. (incl any necessary revisions)
• 30% Description Lo-fi to Hi-fi prototype (design changes made (CW), combining prototypes)
• 25% Lessons learned
• 30% Prototype (description (how it is to be used and the prototype itself)
• 10% Overall organization and clarity, etc.

Assessment criteria - heuristic evaluation (worth 5% of the total grade):

• 30% Accuracy of Heuristic Evaluation
• 30% Thoroughness of Heuristic Evaluation
• 30% Re-design recommenations and lessons learned from the evaluation process
• 10% Overall organization and clarity, etc.

Final Project (30% - Due Week 15)

Before you start writing the final report, make at least one modification to your prototype based on what you have learned from heuristic evaluations.

The final report should provide a good overview of the project and should cover the following:

• Which design problem was addressed?
• Who is the user group? What is the context in which they will use the system? What constraints do they have in using the system?
• What tasks do they need to perform with the system? (include task analysis, tables, HTA, etc.)
• Which design concept(s) did you consider?
• What are the key features of the prototype constructed?
• What did you learn from different prototyping methods?
• How were your prototypes evaluated (talk about all evaluations)?
• What lessons did you learn from evaluations?
• What do you recommend for further re-design of the interface? (include a discussion of what you have learned from the heuristic evaluations, and a description of the modification that you have already implemented)

You should be able to re-use several existing sections from your previous assignments. In addition to the above points, your task is to identify one design feature contained in your final prototype. For the selected feature:

1. describe what the feature is supposed to do (e.g., what task it supports, what problem it resolves, what benefit it has).
2. include evidence from the HCI and related literature to support the design choice. For example, is there a human cognitive aspect that the design addresses? is there research literature that supports (or does not support) the solution. Choose your evidence wisely.
3. indicate your assessment of the effectiveness of this particular design feature: is it a good solution, an acceptable solution given environmental constraints, or a poor solution.

Write about two-three pages about the selected feature; illustrations (if used) are in addition to the page limits. Include a bibliography for each item cited in the paper. The intent of this part of your assignment is for you to demonstrate your knowledge of the area.

Finally:

• Submit your individual report by Week 15.

Assessment criteria:

• 05% - Intro, description of design problem, user groups, tasks, etc.
• 10% - Design concepts, requirements and prototype(s) presentation (text figures)
• 10% - Evaluation (description, results)
• 25% - Lessons learned and Future re-design recommendations
• 10% - Design feature - description
• 30% - Design feature - evidence from HCI lit, own assessment
• 10% - overall organization, style (stylistically & grammatically correct writing, neat appearance of the submitted work, etc.)

Methods of Assessment

Bibliography

Textbook:

Preece, Rogers, Sharpe. (2002). Interaction design: beyond human-computer interaction. Wiley. (available at the Rutgers Bookstore).

Recommended Books:

Norman, D. (1998). The Psychology of Everyday Things. New York: Basic Books. Also published under "The Design of Everyday Things"

Rosson, M.B & Carroll, J.M. (2002). Usability engineering: scenario-based development of human-computer interaction. Morgan Kaufman.

Allen, B.L. (1996). Information Tasks: Toward a User-Centred Approach to Information Systems. San Diego: Academic Press.

Norman, D.A., Draper, S.W. (Editors) (1986). User centered system design : new perspectives on human-computer interaction. Mahwah, NJ,: Lawrence Erlbaum Associates.

Background reading:

Marchionini, G. (1995). Information Seeking in Electronic Environments. Cambridge University Press.

Vicente, K. (2003). The Human Factor: Revolutionizing the Way People Live With Technology. Knopf Canada. In particular, chapters 1,2,4 & 5.

[You can get more information abou this course at http://comminfo.rutgers.edu/~jacekg/teaching/MLIS512/index.html].