IS 4300 – Human-Computer Interaction

 

 

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

 

Homework (Individual Assignments)

 

The following assignments are to be completed individually and posted to your individual course web page by noon on the day due.

 

I1

Individual Homework #1 – Project Brainstorming (due NEXT CLASS, NOT GRADED)

 

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 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 is4300f15@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 9/25 class.

 

Assignment

Pick three different project ideas that you would be interested in working on, 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). For ideas, review recent years' CHI proceedings.

I2

Individual Homework #2 – UI Critique (due 9/21)

 

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.

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 (please make explicit reference to the principles covered on 9/8: visibility, mapping, feedback, consistency, etc).

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

·         illustrate with screenshots or photographs  

 

I3

Individual Homework #3 – Ethnography (due 9/30)

 

Northeastern has just hired you to make the student center more efficient and friendly. Pick a location and spend 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 two or three unstructured interviews with your subjects.

Some examples of activities (you can study one of these or, better yet, come up with your own):

  • finding a seat
  • choosing a restaurant
  • finding a meeting room
  • deciding whether to take the stairs or elevator

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, and a description of any artifacts they used. Describe the individuals you interviewed (not by name) and what you learned from the interviews. Following this, provide a detailed description of the activity and any variations you observed. Review the two papers assigned this class for examples of how to write your report.  You can include sketches or photographs. Total report length should be 2-3 pages.

I4

Individual Homework #4 – SWING 1 – Rapid Prototyping in NetBeans (due 10/7)

 

Your mission in this exercise is to implement a Java application 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.

 

here are step-by-step instructions (if you really, really don't want to use NetBeans, talk to theinstructor)

 

What to post: email a screen shot of your app running, along with a zip archive of your netbeans project directory, to is4300f15@ccs.neu.edu.

 

I5

Individual Homework #5 – SWING 2 – Event Handling (due 10/19)

 

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

  • Draw curves, specified by a mouse drag.
  • Draw filled rectangles or ovals, specified by a mouse drag (don't worry about dynamically drawing the shape during the drag - just draw the final shape indicated).
  • Shape selection (line, rectangle or oval) selected by a combo box OR menu.
  • Color selection using radio buttons OR menu.
  • Line thickness using a combo box OR menu.
  • 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 java 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 JFrame (there is no global Graphics object!).
  • Here’s a code snippet to draw a blue dot at X=10, Y=100 on the JFrame:

Graphics G=getGraphics();

G.setColor(Color.BLUE);

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

  • Here's the mouse dragged handler we wrote in class for a (lame) painting function on the JFrame: 
    private void myMouseDragged(java.awt.event.MouseEvent evt) {                                
            int x=evt.getX();
            int y=evt.getY();
            java.awt.Graphics G=getGraphics();
            G.drawRect(x, y, 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  zip your netbeans project and email it to is4300f15@ccs.neu.edu.

 

 

 

I6

Individual Homework #6 – SWING 3 – Constraint-Based Layout (due 10/28)

 

Your objective in this assignment is to get some experience with Frames, Dialogs and layout managers in Swing. Your mission is to create your own (ideally project-related) application with the following minimum requirements:

  • A JFrame and a (non-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, Free Design, Box, Overlay, Null or Absolute Layout anywhere in the project.

 

What to post  Zip and email your netbeans project folder to  is4300f15@ccs.neu.edu.

 

 

I7

Individual Homework #7 -Heuristic Evaluation (due 11/25)

 

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

 

The two interfaces you will be evaluating will be assigned in class. For each, go to the project team's webpage and review the P6 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 all 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 all 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 12 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. 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.