Project Proposal
Personas, Goals, and Task Analysis
Scenarios, Comparative Analysis, and Initial Design
Low-fi Prototyping and Usability Testing
First Interactive Prototype and Presentation
Heuristic Evaluation
Second Interactive Prototype and Heuristic Evaluation Integration
Pilot Usability Study and Formal Usability Test Design
Third Interactive Prototype and Final Write-up (Final Presentation)
For our second interactive prototype, we incorporated feedback from a heuristic evaluation by the Paparazzi team. We also made changes based on MartiÕs feedback and further evaluation by our team.
We maintained the same screen layout as in our first prototype. The screen is divided into three main sections: a top panel that provides navigational links and feedback on the current search conditions, a left panel that provides the controls for setting the search criteria, and a right panel that displays the search results. WeÕve added documentation to the initial blank search results area, and have added color cues to tie the top navigational links to the corresponding left panel controls.
Clicking one of the navigational links in the top panel causes the search criteria controls to be shown in the left panel. For example, after clicking Location in the top panel, the Location search criteria panel displays on the left:
When the user clicks the Find Location button in the left panel, the search results are displayed in the right panel, and the current Location search condition is displayed underneath the Location link on the top panel. Users can remove the search condition by clicking on the ÔXÕ underneath the link in the top panel. The controls for the Taxon, Date, Institution, and Advanced panels work in a similar manner.
This version of the prototype contains textual hints for all text input boxes. WeÕve also carried the color coding scheme through to the column headings, to reinforce the connections between the search results and the corresponding controls. WeÕve worked on improving the placement, alignment, and spacing of various screen elements.
Clicking on the Show/Hide Columns link allows users to reorganize the results table:
Finally, in this version of the prototype weÕve implemented many new features, including a taxon hierarchy to allowing browsing of the taxon data. See the Design Changes table for the complete list of changes and new features.
The design changes for the second interactive prototype were derived from 3 sources:
1) Paparazzi's heuristic evaluation (severity 3 violations)
2) Marti's assignment feedback
3) Manis team
The type of design change is classified under one of five categories:
1) Documentation - provide hints and instructions
2) Enhancement - augment already implemented features
3) Cosmetic - modify formatting, layout, color, and spacing
4) Bug Fix - re-code already implemented features
5) New Feature - add new or implement deferred functionality
Type | Design Change | Source | Severity | Screenshot |
---|---|---|---|---|
Bug Fix | Show/Hide Columns checkboxes on the left panel reflects and retains user selection. | Paparazzi | 3 | Screenshot |
Enhancement | Allow spaces before and after text entry. | Paparazzi | 3 | Screenshot |
New Feature | Add 'x' to column headings for hiding columns. | Paparazzi | 2 | Screenshot |
Documentation | Instructions for navigating the application upon initial load of web page. Provide hints for text entry formats. Highlight that top panel is used to narrow down search conditions. | Marti, Paparazzi | 3 | Screenshot |
New Feature | Add a way to conduct a new search. | Paparazzi | 3 | Screenshot |
New Feature | Add "Did you mean..." to help user with misspelled text entries and zero result set. | Marti | - | Screenshot |
New Feature | Add Taxon Tree representation to help user with zero result set. Hyperlink implementation is similar to Institution panel hyperlink implementation. | Marti, Paparazzi | 3 | Screenshot |
Documentation | Indicate sort parameter selected by the user. | Paparazzi | 2 | Screenshot |
Cosmetic | Improve background colors and spacing. Use colors, font size, and spacing to better relate the top navigation panel to both the left panel and results panel. | Marti, Paparazzi | 3 | Screenshot |
Bug Fix | Add 'x' to delete to-date condition from top navigation panel. | Paparazzi | 3 | Screenshot |
Cosmetic | Re-locate Export, Print, and Show/Hide Columns hyperlinks. | Manis | - | Screenshot |
Source | Design Change | Justification |
---|---|---|
Marti | Allow user to opt out of synonyms. | Deferred to next iteration. |
Marti | Allow user to browse available content. | Full implementation deferred to next iteration. |
Paparazzi | Implement Advanced Search functionality. | Not within scope of IS213 project. Only included in the prototype as a place-holder. |
Paparazzi | Heuristic Evaluation violations with severity 1 and 2. | Deferred to next iteration. |