CS252. User Interface Design

Program 6 - Usability Evaluation of ParaGraph Tool

Due 11:59 PM, Wednesday, March 8


Note that you will now use electronic forms to submit your team, self, and peer evaluations. Log in to the COE secure server where you hand in assignments, and click on the table-of-contents entry for "Class Related -> Perform Team Evaluation".


If you downloaded the Zipfile before 9:30 AM on Wednesday, March 1, you will need to download the following files: frmMain.frm (the missing file) and ParaGraph.vbp (a corrected version of the VB project file).


Assigned teams are required for this assignment; you will continue with your teammates from the previous assignment.

Your team has been asked by your company to evaluated the ParaGraph product, identify the usability problems in its current interface, and design an improved version of the interface. The team should perform a complete evaluation of the existing interface, using two or more of the methods we studied in class. The evaluation will be documented in a team report. The team will also develop an improved interface that addresses the problems identified through the usability evaluation.

It is up to the team as a whole to divide up the responsibilities in an appropriate way and ensure that each team member participates in roughly equal proportions. Each team member will again provide assessments of him/herself, the team effort, and each teammate.


The ParaGraph Software

ParaGraph is a software tool designed to help parallel programmers decide if they are getting good performance from the CPUs executing the program. For purposes of this assignment, assume that the target audience is programmers who have general Computer Science degrees.

The program reads input from a "trace file" of measurements that were gathered during program execution. It then displays the information in a variety of graphical charts. The charts are animated so that the programmer can watch how things happened during execution. When a display is first brought up, only the title and legend show. The Start, Pause/Resume, and Step controls manage animation (try this out using the Meter and Clock windows). The Reset control starts the program over again. The Slow Motion control allows the user to adjust the speed of animation.

The current interface was designed a number of years ago, when windowing environments were just becoming common - and before there were standards for GUI design. Users have complained that it is clumsy, hard to learn, and confusing to use. Your job is to pinpoint the features that are causing problems, and re-design the interface to solve those issues.

Download the Paragraph program in WinZip'ed form. Note that there is an example trace file in addition to the VB files: sample.trf.

The VB version is actually just a mockup of the UNIX-based ParaGraph tool. There are a few issues which you should not consider to be usability problems:

Finally, this is not a particularly "good" VB program. For example, it is normal to use arrays of commandButtons to streamline performance. Since they were not covered in the class VB text, however, they were left out. You should be able to follow all of the code with no problem. There is one new type of element, a Module (modShared), which is used to declare Public arrays and other variables that are used by multiple forms (VB does not allow these declarations to be made inside normal Forms).


Evaluation Report

Each team will write an evaluation report and submit it as an MS-Word or HTML file. The report should discuss the following: The format is up to each team. Remember that lists and tables can be used to keep the information concise. As a guideline, the length of the report should be somewhere between 1.5 and 4 pages.

You are discouraged from using screendumps or illustrations for this report, since the time you would use to prepare them is better spent on improving the interface.

Your report will be graded on the basis of: appropriateness of methods selected, number and type of usability problems identified, grammar and spelling (use a spell-checker!), conciseness, and clarity.


Improved Interface

Your team can decide whether to implement an improved VB version, or create a paper prototype of your new design. Don't re-design the logo -- your company believes it has "product identity recognition" that outweighs any problems.

If you choose to implement a VB interface, you must include all functionality provided by the ParaGraph program that was given to you. You are not expected to be able to use any VB Controls that are not either in the course text and programming assignments, or in the existing ParaGraph program. The existing program will provide a lot of useful examples, such as how to force windows to appear in particular locations. Don't implement online help (that's the subject of the optional assignment), but tooltips are certainly appropriate.

If you choose to create a paper prototype, it must be complete. For example, you must show the contents of all menus, the appearance of popup dialogs and message boxes, indicate all error handling mechanisms, and clearly show how the different interface components relate to one another (e.g., which buttons and/or menu items bring up which windows or change which aspects of the interface). Remember that the prototype will be graded in isolation -- so you need to make sure that everything is explained in writing or via diagrams. Your prototype must appear professional, which means that hand-drawn illustrations will not be accepted. The prototype must also use color effectively. It is your responsibility to gain access to an appropriate color printer.

Your design will be graded on the basis of: successful addressing of the usability problems, completeness, correctness, conformance to standards for GUI design, and appearance.


What to Turn In

  1. Only one person on the team should turn in the report, calling it teamN.report.doc or teamN.report.html (where N is the team's number).

  2. Only one person on the team should turn in the new interface. If your team chose to implement the interface, be sure to include all files needed for running and examining the program. Use WinZip to package the files, calling it teamN.design.zip (where N is the team's number). If your team chose to develop a paper prototype, the hardcopy pages must be left under Dr. Pancake's door in CS, at or before the posted time. No late copies will be accepted for any reason -- it's your responsibility to make sure you have access to the building the evening the assignment is due.

  3. Each member of the team should turn in the same assessment forms used for the last assignment: Please do not use winzip to package these file together -- just upload them individually.