CS 5340 – Human-Computer Interaction

 

 

[Syllabus] [Schedule] [Homework] [Projects] [Bibliography] [Resources] [Directory] [Acks]

 

Homework (Individual Assignments)

 

The following assignments are to be completed individually and posted to your individual course web page by the start of class on the week due.

 

I1

Individual Homework #1 – UI Critique (due in 1 week)

 

Administrative

  1. If you do not have a CCIS account and have not requested one, you should do so immediately. An account is required to access the online readings. See the Resources page for details.
  2. Create a personal course web page with your name and email address at the at the top (animated gifs optional) and post it to a server (see the Resources page for instructions on doing this at CCIS). You will use this during the semester to post all of your individual homework assignments. You can organize this however you want, but make sure the instructor can quickly find each week’s work on the page.
  3. Send an email with: (a) your name, (b) preferred email address, and (c) URL of your personal course web page to cs5340@ccs.neu.edu.

 

Remdedial Java

If you’re new to Java you should start working your way through the Sun Java tutorial Trails Covering the Basics. You should have a good grasp on this material by the 10/3 class.

 

Assignment

Find 2 examples of good user interface design, and 2 examples of bad user interface design.

Your examples should be specific. It's very hard to find a large interface that's completely good or completely bad, so don't try. Instead, focus on a particular feature or aspect of a user interface that makes your case. Avoid fuzzy words like “intuitive” and “user-friendly”. Find concrete reasons for your judgment.

You aren't limited to desktop software. Web sites offer many great candidates for fame and shame. You aren't even limited to traditional computer interfaces. Feel free to go out into the real world, and consider consumer appliances, car dashboards, building entrances, traffic intersections, shower controls, etc. (Norman's book Design of Everyday Things includes a lot of examples of this kind, which you may find inspirational.)

What to Post   Your report should include 2 good examples and 2 bad examples. For each example:

·         describe the purpose of the overall interface

·         describe the particular aspect you find good or bad

·         explain why it's good or bad

·         if bad, speculate why it might have been designed that way, and suggest a better design if possible

·         illustrate with screenshots or photographs if possible 

 

I2

Individual Homework #2 – Project Brainstorming (due in 1 week)

 

Skim the bibliography of HCI for older adults , and the research papers on interfaces for older adults, and think about project ideas that could be deployed on a touch screen kiosk in a geriatrics clinic waiting room. Pick three different project ideas that you would be interested in working on for a team project, make a rough sketch of a user interface (a scanned or photographed sketch on paper is best) and write a 1 paragraph proposal for each, further fleshing out the idea. Post your write-ups and sketches on a web page in your order of preference (these will be used to help form project teams).

 

I3

Individual Homework #3 – Ethnography (due in 1 week)

 

The Geriatric Ambulatory Practice at Boston Medical Center has just hired you to revolutionize the waiting room experience, by making it more efficient, educational and/or entertaining. Your mission is to sit in the waiting room for an hour, people watching with a notebook and pencil. Spend some time watching the kinds of activities that people are engaged in, and think about how technology could help improve these activities. Pick one such activity to focus on and study. For your chosen activity watch several people perform the task and make detailed notes about the series of steps they go through, any objects (“artifacts”) they use, whether they interact with other people and, if so, the step-by-step details of this interaction. Conduct one or two "unstructured" interviews with patients (NOTE: You cannot talk to patients about their medical conditions, but can ask them about their waiting room experience.)

 

Some examples of activities (you can study one of these or, better yet, come up with your own, ideally related to your ideas for team projects):

  • the registration process
  • form filling
  • health information browsing
  • direction giving
  • appointment scheduling

 

IMPORTANT   This is an active clinic seeing real patients, so we must follow a strict protocol for access, and you must be as professional as possible when you are there.

  1. Schedule a time to go. We have set up a shared Google calendar to coordinate clinic visits. The clinic is open from 8:30am-4:30pm , Monday-Thursday. Monday and Tuesday are their busiest days and mornings are generally busier than afternoons – these are better times to go as you will see more activity. Feel free to pair up with someone, but NO MORE THAN TWO STUDENTS AT A TIME CAN BE OBSERVING, so please use the shared calendar to indicate when you will be visiting.
  2. The clinic is in the BMC Ambulatory Care Center, 850 Harrison Ave, Boston (map). This is a 25-minute walk from NU, or you can walk to Mass Ave and take the #1 or CT1 bus to the Harrison Ave/BMC stop.
  3. Enter the hospital through the large revolving doors to the right of the circular drive into the Yawkey Ambulatory clinic. Go past the security desk and take one of the 3 (4?) elevators to the 2nd floor. Turn left as you come out of the elevator and left again when you hit the wall – the clinic will be on your left (directly over Mass Ave ).
  4. Let the receptionist (Evelyn?) know that you are a student from Northeastern there for observation. Have a seat (if there are not enough seats available, please give priority to the patients).
  5. Please be courteous. Approach patients by saying something like "I'm ..., a student at Northeastern University, and I'm studying what happens in the waiting room. Do you mind if I ask you a few questions." If patients decline, don't push it. You should start your interview with a "grand tour" question (something like "What do you think of the waiting room?"), and have a few other questions prepared, but the tone of the interview should be a casual chat, not an interrogation. The most important part of this style of interview is following up on responses - if a patient says "It's nice.", ask them why it's nice, is it as nice as other waiting rooms they've been to, has it always been this nice, what would make it nicer, etc. YOU CANNOT TALK ABOUT PATIENT'S MEDICAL CONDITIONS.

 

What to Post  Your report should include a one-paragraph summary of why you picked your particular activity to focus on, followed by an overview of the activity, the kinds of people you observed engaging in it, a description of any artifacts they used. Following this, provide a detailed description of the activity and any variations you observed, and what you found out in your interviews (do not identify patients by full name in your writeup - first name is OK). You should try to include a few quotes from patients that support your conclusions. (See the research readings for this week for examples of how to write your report.)  You can include sketches in your report but no photographs and cannot mention any patient's name. Total report length should be 2-3 pages.

 

I4

Individual Homework #4 – SWING 1 – Rapid Prototyping Applets in NetBeans (due in 1 week)

 

Your mission in this exercise is to implement a Java applet to provide online ordering for your favorite restaurant. The interface need not be functional, but the controls should be laid out on the page in such a way that it could actually work if completely implemented.

 

Minimum requirements. Your interface need not implement the entire menu, but must contain at least the following:

  • Two JLabels, one with an icon.
  • Two JButtons, one with an icon.
  • One JButtonGroup with at least 3 JRadioButton options (with toggling between buttons functional).
  • Two JCheckBoxes.
  • One JComboBox with at least two items.
  • One JTextField
  • One JPanel with a titled border enclosing at least one other component.
  • One tool tip on one component.
  • One Menu with at least two options.

 

Note: you do not need to use NetBeans to do this exercise, but if you do here are step-by-step instructions.

 

What to post  Your applet!   In addition, zip and email your java source to cs5340@ccs.neu.edu.

 

I5

Individual Homework #5 – SWING 2 – Event Handling (due in 1 week)

 

Your mission in this exercise is to implement a very simple Java painting applet. The applet must support the following functions:

·         Drag to draw on the background panel.

·         Color selection using a combo box.

·         Line thickness using a group of radio buttons.

·         A CLEAR button.

 

You should read through the Java Swing Tutorial on Writing Event Listeners first.

For help on specific Swing components see How to…

 

Some other tips to get you started:

  • Put ‘import java.awt.*;’  and ‘import java.awt.event.*;’ at the top of your class source.
  • To find the mouse coordinates of a mouse event (e.g., a click), use the ‘int getX()’ and ‘int getY()’ methods on the MouseEvent object.
  • Remember that ‘getGraphics()’ returns a ‘Graphics’ object that represents one set of drawing parameter settings for the applet’s panel (there is no global Graphics object!).
  • Here’s a code snippet to draw a blue dot at X=10, Y=100 on the applet panel:

Graphics G=getGraphics();

G.setColor(Color.BLUE);

G.drawRect(10,100,1,1);

  • And another snippet to find out which item was selected from a combo box:

public void actionPerformed(ActionEvent e) {

   JComboBox cb=(JComboBox)e.getSource();

   String itemName=(String)cb.getSelectedItem();

   …

}

 

What to post  Your applet!   In addition, zip and email your java source to cs5340@ccs.neu.edu.

 

I6

Individual Homework #6 – SWING 3 – Constraint-Based Layout (due in 1 week)

 

Your objective in this assignment is to get some experience with Frames, Dialogs and layout managers in Swing. You have two choices for requirements: 1) try to duplicate the functionality of this applet; or, 2) create your own (ideally project-related) applet with the following minimum requirements:

  • A JFrame and a modal JDialog.
  • A JTabbedPane and JScrollPane.
  • Nested JPanels including the following layout managers: GridLayout, FlowLayout, BorderLayout
  • Some interaction widgets (JButton, etc.) on every JPanel and tab.
  • Reasonable behavior when the JFrame is resized.

 

NOTE: You may not use GridBagLayout or absolute layout anywhere in the project.

 

What to post  Your applet!   In addition, zip and email your java source to cs5340@ccs.neu.edu.

 

I7

Individual Homework #7 – Heuristic Evaluation (due in 1 week)

 

In this individual assignment, you will do heuristic evaluation on two computer prototypes developed by your classmates.

 

You will receive your two assignments by email. The email will include the T6 report for each project, which will give you instructions for running the prototype and background information about the project. This is not an anonymous evaluation, so feel free to contact a project group directly if you need more information than you were given. As soon as you receive your prototype assignments, try to download and run both prototypes. You don't have to do your heuristic evaluation right away, but poke around a bit and make sure the prototypes appear to work. We need to get logistical problems out of the way as early as possible, since everybody else is going to be working on heuristic evaluations too.

 

Follow the heuristic evaluation procedure to evaluate both interfaces carefully. Make a numbered list of usability problems and successes you find. For each problem or positive comment, you should:

  • describe the problem or positive feature
  • identify the relevant usability heuristics (from Nielsen's Ten Usability Heuristics, or any other guidelines we've discussed in class)
  • estimate its severity (for problems, use cosmetic, minor, major, or catastrophic; for positive comments, just say good)

 

You aren't required to recommend solutions for the problems, but any ideas you have would no doubt be appreciated.

 

Be thorough. You should have at least 20 useful comments (positive or negative) about each interface that you evaluate. Write your reports in a readable style. The usability of your report to its recipients will matter in your grade. In particular, don't bury the problems you found in reams of free-flowing prose. Where possible, include screenshots to illustrate the problems you found. In general, make your report easy to read and understand.

 

What to Post  You should post two reports, one for each interface you evaluated, on separate web pages. Email the relevant URL to the appropriate team members.

I8

Individual Homework #8 – IVR Mania (due in 1 week)

 

PART I. Evaluating a Commercial Telephony Spoken Dialog System

 

Call the FANDANGO IVR system (1-800-FANDANGO).

 

  1. Characterize the dialog for finding the showtimes for a particular movie at a particular theatre as a hierarchical STN (work top-down, only model up to 30 states).
  2. Evaluate the TRINDI tick list items (yes or no) presented in class.

 

PART II. Authoring VXML

  1. Get the Voxeo 'helloworld' VXML tutorial application working (here are step-by-step instructions). This involves signing up for a Voxeo developer account. NOTE: host your vxml pages on your own web server (not Voxeo's).
  2. Write a new VXML application to tell 'knock knock' jokes (as many as the user wants to hear - repeating after 3 is OK).

(Voxeo VXML documentation here.)

 

EMAIL the results of PART I, your VXML form(s) for PARTI II, and the Voxeo application PIN (from the Voxeo application settings page) cs5340@ccs.neu.edu.